From e8227b153436dae490fee28ccd953f4f243d97f5 Mon Sep 17 00:00:00 2001 From: Brendan Allan Date: Fri, 22 Mar 2024 14:29:14 +0800 Subject: [PATCH] fix topbar hmr (#2231) --- .../Explorer/View/DragScrollable.tsx | 2 +- interface/app/$libraryId/Explorer/index.tsx | 2 +- interface/app/$libraryId/PageLayout/index.tsx | 2 +- interface/app/$libraryId/TopBar/Context.tsx | 36 ++++++++++++++++++ interface/app/$libraryId/TopBar/Layout.tsx | 38 +------------------ interface/app/$libraryId/TopBar/Portal.tsx | 2 +- interface/app/$libraryId/TopBar/index.tsx | 2 +- interface/app/$libraryId/ephemeral.tsx | 2 +- 8 files changed, 44 insertions(+), 42 deletions(-) create mode 100644 interface/app/$libraryId/TopBar/Context.tsx diff --git a/interface/app/$libraryId/Explorer/View/DragScrollable.tsx b/interface/app/$libraryId/Explorer/View/DragScrollable.tsx index 119e06c8f..4d4d789ac 100644 --- a/interface/app/$libraryId/Explorer/View/DragScrollable.tsx +++ b/interface/app/$libraryId/Explorer/View/DragScrollable.tsx @@ -1,7 +1,7 @@ import { useExplorerLayoutStore } from '@sd/client'; import { tw } from '@sd/ui'; -import { useTopBarContext } from '../../TopBar/Layout'; +import { useTopBarContext } from '../../TopBar/Context'; import { useExplorerContext } from '../Context'; import { PATH_BAR_HEIGHT } from '../ExplorerPath'; import { useDragScrollable } from './useDragScrollable'; diff --git a/interface/app/$libraryId/Explorer/index.tsx b/interface/app/$libraryId/Explorer/index.tsx index ae094db67..9048d5614 100644 --- a/interface/app/$libraryId/Explorer/index.tsx +++ b/interface/app/$libraryId/Explorer/index.tsx @@ -8,7 +8,7 @@ import { } from '@sd/client'; import { useShortcut } from '~/hooks'; -import { useTopBarContext } from '../TopBar/Layout'; +import { useTopBarContext } from '../TopBar/Context'; import { useExplorerContext } from './Context'; import ContextMenu from './ContextMenu'; import DismissibleNotice from './DismissibleNotice'; diff --git a/interface/app/$libraryId/PageLayout/index.tsx b/interface/app/$libraryId/PageLayout/index.tsx index 13b1a15e0..f992740ce 100644 --- a/interface/app/$libraryId/PageLayout/index.tsx +++ b/interface/app/$libraryId/PageLayout/index.tsx @@ -3,7 +3,7 @@ import { useRef } from 'react'; import { Outlet } from 'react-router'; import { useShowControls } from '../../../hooks'; -import { useTopBarContext } from '../TopBar/Layout'; +import { useTopBarContext } from '../TopBar/Context'; import { PageLayoutContext } from './Context'; export const Component = () => { diff --git a/interface/app/$libraryId/TopBar/Context.tsx b/interface/app/$libraryId/TopBar/Context.tsx new file mode 100644 index 000000000..26287d97b --- /dev/null +++ b/interface/app/$libraryId/TopBar/Context.tsx @@ -0,0 +1,36 @@ +import { createContext, useContext, useState } from 'react'; +import { SearchFilterArgs } from '@sd/client'; + +export const TopBarContext = createContext | null>(null); + +export function useContextValue() { + const [left, setLeft] = useState(null); + const [center, setCenter] = useState(null); + const [right, setRight] = useState(null); + const [children, setChildren] = useState(null); + const [fixedArgs, setFixedArgs] = useState(null); + const [topBarHeight, setTopBarHeight] = useState(0); + + return { + left, + setLeft, + center, + setCenter, + right, + setRight, + children, + setChildren, + fixedArgs, + setFixedArgs, + topBarHeight, + setTopBarHeight + }; +} + +export function useTopBarContext() { + const ctx = useContext(TopBarContext); + + if (!ctx) throw new Error('TopBarContext not found!'); + + return ctx; +} diff --git a/interface/app/$libraryId/TopBar/Layout.tsx b/interface/app/$libraryId/TopBar/Layout.tsx index 7f843e0e6..7c37452b5 100644 --- a/interface/app/$libraryId/TopBar/Layout.tsx +++ b/interface/app/$libraryId/TopBar/Layout.tsx @@ -1,35 +1,9 @@ -import { createContext, useContext, useEffect, useState } from 'react'; +import { useEffect } from 'react'; import { Outlet } from 'react-router'; -import { SearchFilterArgs } from '@sd/client'; import TopBar from '.'; import { explorerStore } from '../Explorer/store'; - -const TopBarContext = createContext | null>(null); - -function useContextValue() { - const [left, setLeft] = useState(null); - const [center, setCenter] = useState(null); - const [right, setRight] = useState(null); - const [children, setChildren] = useState(null); - const [fixedArgs, setFixedArgs] = useState(null); - const [topBarHeight, setTopBarHeight] = useState(0); - - return { - left, - setLeft, - center, - setCenter, - right, - setRight, - children, - setChildren, - fixedArgs, - setFixedArgs, - topBarHeight, - setTopBarHeight - }; -} +import { TopBarContext, useContextValue } from './Context'; export const Component = () => { const value = useContextValue(); @@ -48,11 +22,3 @@ export const Component = () => { ); }; - -export function useTopBarContext() { - const ctx = useContext(TopBarContext); - - if (!ctx) throw new Error('TopBarContext not found!'); - - return ctx; -} diff --git a/interface/app/$libraryId/TopBar/Portal.tsx b/interface/app/$libraryId/TopBar/Portal.tsx index 8d9d97b66..032f964ab 100644 --- a/interface/app/$libraryId/TopBar/Portal.tsx +++ b/interface/app/$libraryId/TopBar/Portal.tsx @@ -1,7 +1,7 @@ import { PropsWithChildren, type ReactNode } from 'react'; import { createPortal } from 'react-dom'; -import { useTopBarContext } from './Layout'; +import { useTopBarContext } from './Context'; interface Props extends PropsWithChildren { left?: ReactNode; diff --git a/interface/app/$libraryId/TopBar/index.tsx b/interface/app/$libraryId/TopBar/index.tsx index d238a3f67..44745c6a2 100644 --- a/interface/app/$libraryId/TopBar/index.tsx +++ b/interface/app/$libraryId/TopBar/index.tsx @@ -15,7 +15,7 @@ import { useRoutingContext } from '~/RoutingContext'; import { useTabsContext } from '~/TabsContext'; import { explorerStore } from '../Explorer/store'; -import { useTopBarContext } from './Layout'; +import { useTopBarContext } from './Context'; import { NavigationButtons } from './NavigationButtons'; // million-ignore diff --git a/interface/app/$libraryId/ephemeral.tsx b/interface/app/$libraryId/ephemeral.tsx index 70faf5030..75b074def 100644 --- a/interface/app/$libraryId/ephemeral.tsx +++ b/interface/app/$libraryId/ephemeral.tsx @@ -37,7 +37,7 @@ import { DefaultTopBarOptions } from './Explorer/TopBarOptions'; import { useExplorer, useExplorerSettings } from './Explorer/useExplorer'; import { EmptyNotice } from './Explorer/View/EmptyNotice'; import { AddLocationButton } from './settings/library/locations/AddLocationButton'; -import { useTopBarContext } from './TopBar/Layout'; +import { useTopBarContext } from './TopBar/Context'; import { TopBarPortal } from './TopBar/Portal'; import TopBarButton from './TopBar/TopBarButton';