feat/authorization

app/entrypoints/renderer/package.json

@@ -10,6 +10,8 @@
     "start": "node dist/src/index.cjs"
   },
   "dependencies": {
+    "@apollo/client": "3.10.5",
+    "graphql": "16.8.2",
     "react-intl": "6.6.8"
   },
   "devDependencies": {
@@ -27,5 +29,8 @@
     "react-dom": "18.3.1",
     "react-intl": "6.6.8",
     "typescript": "5.2.2"
+  },
+  "peerDependencies": {
+    "typescript": "*"
   }
 }

app/entrypoints/renderer/src/app/api/github/route.ts

@@ -0,0 +1,14 @@
+// @ts-ignore:next-line
+import { cookies }  from 'next/headers'
+// @ts-ignore:next-line
+import { redirect } from 'next/navigation'
+
+export async function GET(request: Request) {
+  const { searchParams } = new URL(request.url)
+
+  const code = searchParams.get('code')
+  cookies().set('code', code)
+
+  const redirectUrl = new URL(request.url)
+  return redirect(redirectUrl.origin)
+}

app/fragments/app-registration/src/registration.component.tsx

@@ -3,6 +3,8 @@
 import { useTheme }   from '@emotion/react'
 
 import React          from 'react'
+// @ts-ignore:next-line
+import { useRouter }  from 'next/navigation'
 import { useIntl }    from 'react-intl'
 
 import { MainLogo }   from '@app/main-logo'
@@ -17,12 +19,34 @@ import { ThemeType }  from '@ui/theme'
 const Registration: React.FC = () => {
   const theme = useTheme() as ThemeType
   const { formatMessage } = useIntl()
+
+  const router = useRouter()
+
+  const currentUrl = new URL(window.location.href)
+
+  const gitHubAuthBaseUrl = 'https://github.com/login/oauth/authorize'
+  const gitHubAuthUrl = new URL('', gitHubAuthBaseUrl)
+
+  if (!process.env.NEXT_PUBLIC_GH_CLIENT_ID) throw new Error('need github cliend id')
+  gitHubAuthUrl.searchParams.set('client_id', process.env.NEXT_PUBLIC_GH_CLIENT_ID)
+
+  gitHubAuthUrl.searchParams.set('redirect_uri', `${currentUrl.origin}/api/github`)
+
+  const authButtonClickHandler = async () => {
+    router.replace(gitHubAuthUrl.href)
+  }
+
   return (
     <Background backgroundUrl='url(/Bg.png)'>
       <Column margin={theme.spaces.tb180lra} height='auto'>
         <MainLogo />
         <Box justifyContent='center'>
-          <Button variant='blackBackgroundButton' shape='rectangle' size='bigRoundedPadding'>
+          <Button
+            variant='blackBackgroundButton'
+            shape='rectangle'
+            size='bigRoundedPadding'
+            onClick={authButtonClickHandler}
+          >
             <GitHubIcon width={theme.spaces.bigDecreased} height={theme.spaces.bigDecreased} />
             <Text
               fontSize={theme.fontSizes.normal.semiIncreased}