fix(striker-ui): allow retain/discard tab content

This commit is contained in:
Tsu-ba-me 2023-02-17 00:36:39 -05:00
parent 5e5c767670
commit a1ba570eee
2 changed files with 22 additions and 9 deletions

View File

@ -1,21 +1,29 @@
import { Box } from '@mui/material';
import { ReactElement, useMemo } from 'react';
import { ReactElement, ReactNode, useMemo } from 'react';
const TabContent = <T,>({
changingTabId,
children,
retain = false,
tabId,
}: TabContentProps<T>): ReactElement => {
const isTabIdMatch = useMemo(
() => changingTabId === tabId,
[changingTabId, tabId],
);
const displayValue = useMemo(
() => (isTabIdMatch ? 'initial' : 'none'),
[isTabIdMatch],
const result = useMemo<ReactNode>(
() =>
retain ? (
<Box sx={{ display: isTabIdMatch ? 'initial' : 'none' }}>
{children}
</Box>
) : (
isTabIdMatch && children
),
[children, isTabIdMatch, retain],
);
return <Box sx={{ display: displayValue }}>{children}</Box>;
return <>{result}</>;
};
export default TabContent;

View File

@ -1,4 +1,9 @@
type TabContentProps<T> = import('react').PropsWithChildren<{
type TabContentOptionalProps = {
retain?: boolean;
};
type TabContentProps<T> = TabContentOptionalProps &
import('react').PropsWithChildren<{
changingTabId: T;
tabId: T;
}>;