import React, { useRef, useState } from "react"; import BasicTable from "./BasicTable"; import TitleSubtitle from "../TitleSubtitle"; import MultiRangeInput from "./MultiRangeInput"; import grayLeftArrow from "./gray-arrow-left.svg"; import { BreadCrumb } from "../BreadCrumb"; const ReactTable4 = ({ breadCrumbs, subTitle, title }) => { const [tabs, setTabs] = useState([ { name: "جدول " + breadCrumbs[breadCrumbs.length - 1].name, id: 0 }, ]); let [activeTab, setActivateTab] = useState(0); const stateRef = useRef(); const stateActiveRef = useRef(); stateRef.current = tabs; stateActiveRef.current = activeTab; const addTab = (newTab) => { setActivateTab(newTab.id); if (stateRef.current.find((e) => e.id === newTab.id)) return; setTabs([...stateRef.current, newTab]); }; const delTab = (id) => { setTabs(stateRef.current.filter((e) => e.id != id)); if (stateActiveRef.current == id) setActivateTab(0); }; return (