diff --git a/src/components/AccessDeniedDescription.tsx b/src/components/AccessDeniedDescription.tsx
index cc8290b..6705aa8 100644
--- a/src/components/AccessDeniedDescription.tsx
+++ b/src/components/AccessDeniedDescription.tsx
@@ -1,9 +1,13 @@
+import { useConfigs } from 'containers/ConfigsContext'
import { GITHUB_OAUTH } from 'env'
import { platform } from 'platforms'
import { GitHub } from 'platforms/GitHub'
import * as React from 'react'
-export function AccessDeniedDescription({ hasToken }: { hasToken: boolean }) {
+export function AccessDeniedDescription() {
+ const configContext = useConfigs()
+ const hasToken = Boolean(configContext.value.accessToken)
+
return (
Access Denied
diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx
index 536195d..80aa238 100644
--- a/src/components/SideBar.tsx
+++ b/src/components/SideBar.tsx
@@ -59,10 +59,10 @@ export function SideBar(props: {
const $shouldShow = useStateIO(false)
const shouldShow = $shouldShow.value
- const setShouldShow = React.useCallback((shouldShow: boolean) => {
- $shouldShow.onChange(shouldShow)
+ React.useEffect(() => {
DOMHelper.setBodyIndent(shouldShow)
- }, [])
+ }, [shouldShow])
+
React.useEffect(() => {
if (shouldShow) {
DOMHelper.focusFileExplorer() // TODO: verify if it works
@@ -70,16 +70,15 @@ export function SideBar(props: {
}, [shouldShow])
const toggleShowSideBar = React.useCallback(() => {
$shouldShow.onChange(shouldShow => {
- DOMHelper.setBodyIndent(!shouldShow)
+ const {
+ value: { intelligentToggle },
+ } = configContext
+ if (intelligentToggle !== null) {
+ configContext.onChange({ intelligentToggle: !shouldShow })
+ }
+
return !shouldShow
})
-
- const {
- value: { intelligentToggle },
- } = configContext
- if (intelligentToggle !== null) {
- configContext.onChange({ intelligentToggle: !shouldShow })
- }
}, [])
useToggleSideBarWithKeyboard(state, configContext, toggleShowSideBar)
@@ -89,10 +88,10 @@ export function SideBar(props: {
intelligentToggle === null && Boolean(state === 'error-due-to-auth' && accessToken)
React.useEffect(() => {
if (hideSidebarOnInvalidToken) {
- setShouldShow(false)
+ $shouldShow.onChange(false)
} else {
const shouldShow = intelligentToggle === null ? platform.shouldShow() : intelligentToggle
- setShouldShow(shouldShow)
+ $shouldShow.onChange(shouldShow)
}
}, [intelligentToggle, hideSidebarOnInvalidToken, metaData])
@@ -106,9 +105,9 @@ export function SideBar(props: {
const updateSideBarVisibility = React.useCallback(
function updateSideBarVisibility() {
if (hideSidebarOnInvalidToken) {
- setShouldShow(false)
+ $shouldShow.onChange(false)
} else if (intelligentToggle === null) {
- setShouldShow(platform.shouldShow())
+ $shouldShow.onChange(platform.shouldShow())
}
},
[metaData?.branchName, intelligentToggle, hideSidebarOnInvalidToken],
@@ -147,7 +146,7 @@ export function SideBar(props: {
case 'meta-loading':
return
case 'error-due-to-auth':
- return
+ return
default:
return metaData ? (
<>
diff --git a/src/components/ToggleShowButton.tsx b/src/components/ToggleShowButton.tsx
index 85bb34f..53a8d1a 100644
--- a/src/components/ToggleShowButton.tsx
+++ b/src/components/ToggleShowButton.tsx
@@ -2,6 +2,7 @@ import iconSrc from 'assets/icons/Gitako.png'
import { useConfigs } from 'containers/ConfigsContext'
import * as React from 'react'
import { useDebounce, useWindowSize } from 'react-use'
+import { cx } from 'utils/cx'
import { Icon } from './Icon'
type Props = {
@@ -37,7 +38,9 @@ export function ToggleShowButton({ error, onClick }: Props) {
return (