TabandTabPanel.tsx

const Tab = ({ id, children }: any) => {
  const tab = useContext(context);
  return <div onClick={() => tab.changeTab(id)}>{children}</div>;
};

const TabPanel = ({ whenActive, children }: any) => {
  const tab = useContext(context);
  return tab.activeTabId === whenActive ? children : null;
};