perf: unmount hidden team list tab
This commit is contained in:
parent
0c6bf5dd33
commit
32b7bc3386
1 changed files with 2 additions and 1 deletions
|
|
@ -86,6 +86,7 @@ const PaneLazyFallback = (): React.JSX.Element => {
|
||||||
|
|
||||||
const PaneTabSlot = ({ tab, isActive, isPaneFocused }: PaneTabSlotProps): React.JSX.Element => {
|
const PaneTabSlot = ({ tab, isActive, isPaneFocused }: PaneTabSlotProps): React.JSX.Element => {
|
||||||
const [hasActivated, setHasActivated] = useState(isActive);
|
const [hasActivated, setHasActivated] = useState(isActive);
|
||||||
|
const shouldRenderContent = hasActivated && (tab.type !== 'teams' || isActive);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (isActive) {
|
if (isActive) {
|
||||||
|
|
@ -95,7 +96,7 @@ const PaneTabSlot = ({ tab, isActive, isPaneFocused }: PaneTabSlotProps): React.
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="absolute inset-0 flex" style={{ display: isActive ? 'flex' : 'none' }}>
|
<div className="absolute inset-0 flex" style={{ display: isActive ? 'flex' : 'none' }}>
|
||||||
{hasActivated && (
|
{shouldRenderContent && (
|
||||||
<Suspense fallback={<PaneLazyFallback />}>
|
<Suspense fallback={<PaneLazyFallback />}>
|
||||||
{tab.type === 'dashboard' && <DashboardView />}
|
{tab.type === 'dashboard' && <DashboardView />}
|
||||||
{tab.type === 'notifications' && <NotificationsView />}
|
{tab.type === 'notifications' && <NotificationsView />}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue