From 822b595a2f2e0c43b55cd0ba9cae7c01d72ffc4c Mon Sep 17 00:00:00 2001 From: EnixCoda Date: Mon, 7 Jun 2021 22:11:58 +0800 Subject: [PATCH] refactor: add platform hooks --- src/components/SideBar.tsx | 9 +---- .../hooks/useGitHubAttachCopyFileButton.ts | 17 ++++++++ .../hooks/useGitHubAttachCopySnippetButton.ts | 17 ++++++++ .../GitHub/{ => hooks}/useGitHubCodeFold.tsx | 2 +- src/platforms/GitHub/index.ts | 39 ++++++------------- src/platforms/platform.d.ts | 5 +-- 6 files changed, 49 insertions(+), 40 deletions(-) create mode 100644 src/platforms/GitHub/hooks/useGitHubAttachCopyFileButton.ts create mode 100644 src/platforms/GitHub/hooks/useGitHubAttachCopySnippetButton.ts rename src/platforms/GitHub/{ => hooks}/useGitHubCodeFold.tsx (99%) diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx index b2b7fea..c3d0427 100644 --- a/src/components/SideBar.tsx +++ b/src/components/SideBar.tsx @@ -7,11 +7,6 @@ import { SideBarBodyWrapper } from 'components/SideBarBodyWrapper' import { ToggleShowButton } from 'components/ToggleShowButton' import { useConfigs } from 'containers/ConfigsContext' import { platform } from 'platforms' -import { - useGitHubAttachCopyFileButton, - useGitHubAttachCopySnippetButton, - useGitHubCodeFold, -} from 'platforms/GitHub' import * as React from 'react' import { cx } from 'utils/cx' import * as DOMHelper from 'utils/DOMHelper' @@ -100,9 +95,7 @@ export function SideBar() { useSetShouldShowOnPJAXDone(setShowSideBar) - useGitHubAttachCopyFileButton(configContext.value.copyFileButton) - useGitHubAttachCopySnippetButton(configContext.value.copySnippetButton) - useGitHubCodeFold(configContext.value.codeFolding) + platform.usePlatformHooks?.() usePJAX() useProgressBar() diff --git a/src/platforms/GitHub/hooks/useGitHubAttachCopyFileButton.ts b/src/platforms/GitHub/hooks/useGitHubAttachCopyFileButton.ts new file mode 100644 index 0000000..aa1e409 --- /dev/null +++ b/src/platforms/GitHub/hooks/useGitHubAttachCopyFileButton.ts @@ -0,0 +1,17 @@ +import { platform } from 'platforms' +import * as React from 'react' +import { useOnPJAXDone } from 'utils/hooks/usePJAX' +import * as DOMHelper from '../DOMHelper' +import { GitHub } from '../index' + +export function useGitHubAttachCopyFileButton(copyFileButton: boolean) { + const attachCopyFileButton = React.useCallback( + function attachCopyFileButton() { + if (platform !== GitHub) return + if (copyFileButton) return DOMHelper.attachCopyFileBtn() || undefined // for the sake of react effect + }, + [copyFileButton], + ) + React.useEffect(attachCopyFileButton, [copyFileButton]) + useOnPJAXDone(attachCopyFileButton) +} diff --git a/src/platforms/GitHub/hooks/useGitHubAttachCopySnippetButton.ts b/src/platforms/GitHub/hooks/useGitHubAttachCopySnippetButton.ts new file mode 100644 index 0000000..9a92f76 --- /dev/null +++ b/src/platforms/GitHub/hooks/useGitHubAttachCopySnippetButton.ts @@ -0,0 +1,17 @@ +import { platform } from 'platforms' +import * as React from 'react' +import { useOnPJAXDone } from 'utils/hooks/usePJAX' +import * as DOMHelper from '../DOMHelper' +import { GitHub } from '../index' + +export function useGitHubAttachCopySnippetButton(copySnippetButton: boolean) { + const attachCopySnippetButton = React.useCallback( + function attachCopySnippetButton() { + if (platform !== GitHub) return + if (copySnippetButton) return DOMHelper.attachCopySnippet() || undefined // for the sake of react effect + }, + [copySnippetButton], + ) + React.useEffect(attachCopySnippetButton, [copySnippetButton]) + useOnPJAXDone(attachCopySnippetButton) +} diff --git a/src/platforms/GitHub/useGitHubCodeFold.tsx b/src/platforms/GitHub/hooks/useGitHubCodeFold.tsx similarity index 99% rename from src/platforms/GitHub/useGitHubCodeFold.tsx rename to src/platforms/GitHub/hooks/useGitHubCodeFold.tsx index df71aae..e176c05 100644 --- a/src/platforms/GitHub/useGitHubCodeFold.tsx +++ b/src/platforms/GitHub/hooks/useGitHubCodeFold.tsx @@ -1,7 +1,7 @@ import { platform } from 'platforms' import { useCallback, useEffect } from 'react' import { useOnPJAXDone } from 'utils/hooks/usePJAX' -import { GitHub } from '.' +import { GitHub } from '..' const theCSSClassMark = 'gitako-code-fold-attached' const theCSSClassMarkWhenDisabled = 'gitako-code-fold-attached-disabled' diff --git a/src/platforms/GitHub/index.ts b/src/platforms/GitHub/index.ts index b6dab28..2b8f7c9 100644 --- a/src/platforms/GitHub/index.ts +++ b/src/platforms/GitHub/index.ts @@ -1,14 +1,15 @@ +import { useConfigs } from 'containers/ConfigsContext' import { GITHUB_OAUTH } from 'env' import { Base64 } from 'js-base64' -import { platform } from 'platforms' -import * as React from 'react' import { resolveGitModules } from 'utils/gitSubmodule' -import { useOnPJAXDone } from 'utils/hooks/usePJAX' import { sortFoldersToFront } from 'utils/treeParser' import * as API from './API' import * as DOMHelper from './DOMHelper' +import { useGitHubAttachCopyFileButton } from './hooks/useGitHubAttachCopyFileButton' +import { useGitHubAttachCopySnippetButton } from './hooks/useGitHubAttachCopySnippetButton' +import { useGitHubCodeFold } from './hooks/useGitHubCodeFold' import * as URLHelper from './URLHelper' -export { useGitHubCodeFold } from './useGitHubCodeFold' +export { useGitHubCodeFold } from './hooks/useGitHubCodeFold' function processTree(tree: TreeNode[]): TreeNode { // nodes are created from items and put onto tree @@ -273,6 +274,12 @@ export const GitHub: Platform = { }) return `https://github.com/login/oauth/authorize?` + params.toString() }, + usePlatformHooks() { + const { copyFileButton, copySnippetButton, codeFolding } = useConfigs().value + useGitHubAttachCopyFileButton(copyFileButton) + useGitHubAttachCopySnippetButton(copySnippetButton) + useGitHubCodeFold(codeFolding) + }, } async function createPullFileResolver(userName: string, repoName: string, pullId: string) { @@ -283,27 +290,3 @@ async function createPullFileResolver(userName: string, repoName: string, pullId return id } } - -export function useGitHubAttachCopySnippetButton(copySnippetButton: boolean) { - const attachCopySnippetButton = React.useCallback( - function attachCopySnippetButton() { - if (platform !== GitHub) return - if (copySnippetButton) return DOMHelper.attachCopySnippet() || undefined // for the sake of react effect - }, - [copySnippetButton], - ) - React.useEffect(attachCopySnippetButton, [copySnippetButton]) - useOnPJAXDone(attachCopySnippetButton) -} - -export function useGitHubAttachCopyFileButton(copyFileButton: boolean) { - const attachCopyFileButton = React.useCallback( - function attachCopyFileButton() { - if (platform !== GitHub) return - if (copyFileButton) return DOMHelper.attachCopyFileBtn() || undefined // for the sake of react effect - }, - [copyFileButton], - ) - React.useEffect(attachCopyFileButton, [copyFileButton]) - useOnPJAXDone(attachCopyFileButton) -} diff --git a/src/platforms/platform.d.ts b/src/platforms/platform.d.ts index fe82adc..9fe0ec9 100644 --- a/src/platforms/platform.d.ts +++ b/src/platforms/platform.d.ts @@ -7,9 +7,7 @@ type Platform = { metaData: Pick, accessToken?: string, ): Promise - resolveUrlFromMetaData( - metaData: Pick, - ): { + resolveUrlFromMetaData(metaData: Pick): { userUrl: string repoUrl: string } @@ -24,4 +22,5 @@ type Platform = { getCurrentPath(branchName: string): string[] | null setOAuth(code: string): Promise getOAuthLink(): string + usePlatformHooks?(): void }