From c88b817d6099341d7b4e633f1b024c148b258478 Mon Sep 17 00:00:00 2001 From: EnixCoda Date: Mon, 6 Nov 2023 22:07:34 +0800 Subject: [PATCH] refactor: support saving inspector status --- src/components/FileExplorer/index.tsx | 2 +- src/components/Gitako.tsx | 22 +++++++++---------- src/containers/ErrorContext.tsx | 2 +- .../{StateInspector.tsx => Inspector.tsx} | 7 +++++- src/containers/RepoContext.tsx | 2 +- src/containers/SideBarState.tsx | 2 +- src/utils/config/helper.ts | 2 ++ 7 files changed, 23 insertions(+), 16 deletions(-) rename src/containers/{StateInspector.tsx => Inspector.tsx} (87%) diff --git a/src/components/FileExplorer/index.tsx b/src/components/FileExplorer/index.tsx index da5e794..9a32ac1 100644 --- a/src/components/FileExplorer/index.tsx +++ b/src/components/FileExplorer/index.tsx @@ -5,7 +5,7 @@ import { SearchBar } from 'components/SearchBar' import { useConfigs } from 'containers/ConfigsContext' import { PortalContext } from 'containers/PortalContext' import { RepoContext } from 'containers/RepoContext' -import { useInspector } from 'containers/StateInspector' +import { useInspector } from 'containers/Inspector' import * as React from 'react' import { usePrevious, useUpdateEffect } from 'react-use' import { cx } from 'utils/cx' diff --git a/src/components/Gitako.tsx b/src/components/Gitako.tsx index 76bc18b..2ce5d1a 100644 --- a/src/components/Gitako.tsx +++ b/src/components/Gitako.tsx @@ -1,7 +1,7 @@ import { SideBar } from 'components/SideBar' import { ConfigsContextWrapper } from 'containers/ConfigsContext' +import { InspectorContextWrapper } from 'containers/Inspector' import { ReloadContextWrapper } from 'containers/ReloadContext' -import { InspectorContextWrapper } from 'containers/StateInspector' import * as React from 'react' import { StyleSheetManager } from 'styled-components' import { insertMountPoint } from 'utils/DOMHelper' @@ -14,11 +14,11 @@ import { StateBarStateContextWrapper } from '../containers/SideBarState' export function Gitako() { const mountPoint = React.useMemo(() => insertMountPoint(), []) return ( - - - - - + + + + + @@ -28,10 +28,10 @@ export function Gitako() { - - - - - + + + + + ) } diff --git a/src/containers/ErrorContext.tsx b/src/containers/ErrorContext.tsx index 557e1a0..f63d28e 100644 --- a/src/containers/ErrorContext.tsx +++ b/src/containers/ErrorContext.tsx @@ -1,5 +1,5 @@ import { PropsWithChildren } from 'common' -import { useInspector } from 'containers/StateInspector' +import { useInspector } from 'containers/Inspector' import * as React from 'react' import { useStateIO } from 'utils/hooks/useStateIO' diff --git a/src/containers/StateInspector.tsx b/src/containers/Inspector.tsx similarity index 87% rename from src/containers/StateInspector.tsx rename to src/containers/Inspector.tsx index a3b3aea..d9fc143 100644 --- a/src/containers/StateInspector.tsx +++ b/src/containers/Inspector.tsx @@ -3,6 +3,8 @@ import { IN_PRODUCTION_MODE } from 'env' import * as React from 'react' import { noop } from 'utils/general' import { useStateIO } from 'utils/hooks/useStateIO' +import { useConfigs } from './ConfigsContext' +import { Config } from 'utils/config/helper' export type InspectorContextShape = ReactIO @@ -12,7 +14,10 @@ export const InspectorContextWrapper = IN_PRODUCTION_MODE ? React.Fragment : function InspectorContextWrapper({ children }: PropsWithChildren) { const $ = useStateIO({}) - const [show, setShow] = React.useState(true) + const configs = useConfigs() + const { __showInspector: show } = configs.value + const setShow = (__showInspector: Config['__showInspector']) => + configs.onChange({ __showInspector }) return ( diff --git a/src/containers/RepoContext.tsx b/src/containers/RepoContext.tsx index c6f088c..a133c9a 100644 --- a/src/containers/RepoContext.tsx +++ b/src/containers/RepoContext.tsx @@ -9,7 +9,7 @@ import { useHandleNetworkError } from 'utils/hooks/useHandleNetworkError' import { useLoadedContext } from 'utils/hooks/useLoadedContext' import { useStateIO } from 'utils/hooks/useStateIO' import { SideBarStateContext } from './SideBarState' -import { useInspector } from './StateInspector' +import { useInspector } from './Inspector' export const RepoContext = React.createContext(null) diff --git a/src/containers/SideBarState.tsx b/src/containers/SideBarState.tsx index 6030adf..be921c9 100644 --- a/src/containers/SideBarState.tsx +++ b/src/containers/SideBarState.tsx @@ -3,7 +3,7 @@ import * as React from 'react' import { useLoadedContext } from 'utils/hooks/useLoadedContext' import { useStateIO } from 'utils/hooks/useStateIO' import { SideBarErrorContext } from './ErrorContext' -import { useInspector } from './StateInspector' +import { useInspector } from './Inspector' export type SideBarState = | 'disabled' diff --git a/src/utils/config/helper.ts b/src/utils/config/helper.ts index fb1b316..8092378 100644 --- a/src/utils/config/helper.ts +++ b/src/utils/config/helper.ts @@ -22,6 +22,7 @@ export type Config = { restoreExpandedFolders: boolean pjaxMode: 'native' | 'pjax-api' showDiffInText: boolean + __showInspector?: boolean } export type ConfigKeys = keyof Config @@ -45,6 +46,7 @@ enum configKeys { restoreExpandedFolders = 'restoreExpandedFolders', pjaxMode = 'pjaxMode', showDiffInText = 'showDiffInText', + __showInspector = '__showInspector', } // NOT use platform name to distinguish GHE from github.com