refactor: add platform hooks

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()

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)
+}

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)
+}

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'

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)
-}

src/platforms/platform.d.ts

@@ -7,9 +7,7 @@ type Platform = {
     metaData: Pick<MetaData, 'userName' | 'repoName'>,
     accessToken?: string,
   ): Promise<string>
-  resolveUrlFromMetaData(
-    metaData: Pick<MetaData, 'userName' | 'repoName'>,
-  ): {
+  resolveUrlFromMetaData(metaData: Pick<MetaData, 'userName' | 'repoName'>): {
     userUrl: string
     repoUrl: string
   }
@@ -24,4 +22,5 @@ type Platform = {
   getCurrentPath(branchName: string): string[] | null
   setOAuth(code: string): Promise<string | null>
   getOAuthLink(): string
+  usePlatformHooks?(): void
 }