feat: platform getOAuthLink

src/components/settings/AccessTokenSettings.tsx

@@ -1,7 +1,7 @@
 import { Button, TextInput } from '@primer/components'
-import { wikiLinks } from 'components/SettingsBar'
+import { wikiLinks } from 'components/settings/SettingsBar'
 import { useConfigs } from 'containers/ConfigsContext'
-import { GITHUB_OAUTH } from 'env'
+import { usePlatform } from 'containers/PlatformContext'
 import * as React from 'react'
 import { useStates } from 'utils/hooks/useStates'
 import { SettingsSection } from './SettingsSection'
@@ -16,6 +16,7 @@ export function AccessTokenSettings(props: React.PropsWithChildren<Props>) {
   const useAccessToken = useStates('')
   const useAccessTokenHint = useStates<React.ReactNode>('')
   const focusInput = useStates(false)
+  const platform = usePlatform()
 
   const { val: accessTokenHint } = useAccessTokenHint
   const { val: accessToken } = useAccessToken
@@ -78,10 +79,7 @@ export function AccessTokenSettings(props: React.PropsWithChildren<Props>) {
             className={'link-button'}
             onClick={() => {
               // use js here to make sure redirect_uri is latest url
-              const url = `https://github.com/login/oauth/authorize?client_id=${
-                GITHUB_OAUTH.clientId
-              }&scope=repo&redirect_uri=${encodeURIComponent(window.location.href)}`
-              window.location.href = url
+              window.location.href = platform.getOAuthLink()
             }}
           >
             Create with OAuth (recommended)

src/components/settings/FileTreeSettings.tsx

@@ -1,4 +1,4 @@
-import { wikiLinks } from 'components/SettingsBar'
+import { wikiLinks } from 'components/settings/SettingsBar'
 import { SimpleToggleField } from 'components/SimpleToggleField'
 import { useConfigs } from 'containers/ConfigsContext'
 import * as React from 'react'

src/components/settings/SettingsBar.tsx

@@ -1,13 +1,15 @@
 import { Link } from '@primer/components'
 import { Icon } from 'components/Icon'
+import { usePlatform } from 'containers/PlatformContext'
 import { VERSION } from 'env'
+import { GitHub } from 'platforms/GitHub'
 import * as React from 'react'
 import { useStates } from 'utils/hooks/useStates'
-import { AccessTokenSettings } from './settings/AccessTokenSettings'
-import { FileTreeSettings } from './settings/FileTreeSettings'
-import { SettingsSection } from './settings/SettingsSection'
-import { SidebarSettings } from './settings/SidebarSettings'
-import { SimpleField, SimpleToggleField } from './SimpleToggleField'
+import { SimpleField, SimpleToggleField } from '../SimpleToggleField'
+import { AccessTokenSettings } from './AccessTokenSettings'
+import { FileTreeSettings } from './FileTreeSettings'
+import { SettingsSection } from './SettingsSection'
+import { SidebarSettings } from './SidebarSettings'
 
 const WIKI_HOME_LINK = 'https://github.com/EnixCoda/Gitako/wiki'
 export const wikiLinks = {
@@ -23,23 +25,27 @@ type Props = {
   toggleShowSettings: () => void
 }
 
-const moreFields: SimpleField[] = [
-  {
-    key: 'copyFileButton',
-    label: 'Copy file shortcut',
-    wikiLink: wikiLinks.copyFileButton,
-  },
-  {
-    key: 'copySnippetButton',
-    label: 'Copy snippet shortcut',
-    wikiLink: wikiLinks.copySnippet,
-  },
-]
-
 function SettingsBarContent() {
   const useReloadHint = useStates<React.ReactNode>('')
   const { val: reloadHint } = useReloadHint
 
+  const platform = usePlatform()
+  const moreFields: SimpleField[] =
+    platform === GitHub
+      ? [
+          {
+            key: 'copyFileButton',
+            label: 'Copy file shortcut',
+            wikiLink: wikiLinks.copyFileButton,
+          },
+          {
+            key: 'copySnippetButton',
+            label: 'Copy snippet shortcut',
+            wikiLink: wikiLinks.copySnippet,
+          },
+        ]
+      : []
+
   return (
     <>
       <h2 className={'gitako-settings-bar-title'}>Settings</h2>
@@ -48,15 +54,17 @@ function SettingsBarContent() {
         <AccessTokenSettings />
         <SidebarSettings />
         <FileTreeSettings />
-        <SettingsSection title={'More'}>
-          {moreFields.map(field => (
-            <React.Fragment key={field.key}>
-              <SimpleToggleField field={field} />
-            </React.Fragment>
-          ))}
+        {moreFields.length > 0 && (
+          <SettingsSection title={'More'}>
+            {moreFields.map(field => (
+              <React.Fragment key={field.key}>
+                <SimpleToggleField field={field} />
+              </React.Fragment>
+            ))}
 
-          {reloadHint && <div className={'hint'}>{reloadHint}</div>}
-        </SettingsSection>
+            {reloadHint && <div className={'hint'}>{reloadHint}</div>}
+          </SettingsSection>
+        )}
         <SettingsSection title={'Contact'}>
           <a href="https://github.com/EnixCoda/Gitako/issues" target="_blank">
             Report bug / Request feature.

src/platforms/GitHub/index.ts

@@ -1,4 +1,5 @@
 import { platform } from 'platforms'
+import { GITHUB_OAUTH } from 'env'
 import * as React from 'react'
 import { useEvent } from 'react-use'
 import { bodySpacingClassName } from 'utils/DOMHelper'
@@ -155,6 +156,11 @@ export const GitHub: Platform = {
     return accessToken
   },
   useResizeStylesheets,
+  getOAuthLink() {
+    return `https://github.com/login/oauth/authorize?client_id=${
+      GITHUB_OAUTH.clientId
+    }&scope=repo&redirect_uri=${encodeURIComponent(window.location.href)}`
+  },
 }
 
 export function useGitHubAttachCopySnippetButton(copySnippetButton: boolean) {

src/platforms/Gitee/index.ts

@@ -1,4 +1,5 @@
 import { platform } from 'platforms'
+import { GITEE_OAUTH } from 'env'
 import * as React from 'react'
 import { useEvent } from 'react-use'
 import { bodySpacingClassName } from 'utils/DOMHelper'
@@ -104,7 +105,7 @@ export const Gitee: Platform = {
       userName,
       repoName,
       branchName,
-      userUrl: data?.parent?.url,
+      userUrl: data?.html_url?.replace(/(.*)\/.*?$/, '$1'),
       repoUrl: data?.html_url,
     }
 
@@ -155,6 +156,11 @@ export const Gitee: Platform = {
     return accessToken
   },
   useResizeStylesheets,
+  getOAuthLink() {
+    return `https://gitee.com/oauth/authorize?client_id=${
+      GITEE_OAUTH.clientId
+    }&scope=repo&response_type=code&redirect_uri=${encodeURIComponent(window.location.href)}`
+  },
 }
 
 export function useGiteeAttachCopySnippetButton(copySnippetButton: boolean) {

src/platforms/platform.d.ts

@@ -4,6 +4,7 @@ type Platform = {
   getTreeData(metaData: MetaData, accessToken?: string): Promise<TreeNode>
   shouldShow(metaData?: Partial<MetaData>): boolean
   getCurrentPath(branchName: string): string[] | null
-  setOAuth(code: string): Promise<string | null>
   useResizeStylesheets(size: number): void
+  setOAuth(code: string): Promise<string | null>
+  getOAuthLink(): string
 }