Revert "oauth-confirm moved"

This reverts commit 5700968caf.

src/components/Nav/AuthModal/ConfirmOAuth.tsx

@@ -1,38 +0,0 @@
-import styles from './ConfirmEmail.module.scss'
-import authModalStyles from './AuthModal.module.scss'
-import { clsx } from 'clsx'
-import { t } from '../../../utils/intl'
-import { hideModal } from '../../../stores/ui'
-import { onMount } from 'solid-js'
-import { useRouter } from '../../../stores/router'
-
-type ConfirmOAuthSearchParams = {
-  token: string
-}
-
-export const ConfirmOAuth = () => {
-  const { searchParams } = useRouter<ConfirmOAuthSearchParams>()
-
-  onMount(async () => {
-    console.debug('[confirm-oauth] params', searchParams())
-    const token = searchParams().token
-    localStorage.setItem('token', token)
-    window.addEventListener('mousemove', () => window.close())
-    window.addEventListener('keydown', () => window.close())
-    window.addEventListener('click', () => window.close())
-  })
-
-  return (
-    <div>
-      <div class={styles.title}>{t('Hooray! Welcome!')}</div>
-      <div class={styles.text}>
-        {t("You've confirmed your account")} { /* TODO: get '%username%' */ }
-      </div>
-      <div>
-        <button class={clsx('button', authModalStyles.submitButton)} onClick={() => hideModal()}>
-          {t('Back to mainpage')}
-        </button>
-      </div>
-    </div>
-  )
-}

src/components/Nav/AuthModal/EmailConfirm.tsx

@@ -1,4 +1,4 @@
-import styles from './ConfirmEmail.module.scss'
+import styles from './EmailConfirm.module.scss'
 import authModalStyles from './AuthModal.module.scss'
 import { clsx } from 'clsx'
 import { t } from '../../../utils/intl'
@@ -11,7 +11,7 @@ type ConfirmEmailSearchParams = {
   token: string
 }
 
-export const ConfirmEmail = () => {
+export const EmailConfirm = () => {
   const confirmedEmail = 'test@test.com'
 
   const { searchParams } = useRouter<ConfirmEmailSearchParams>()

src/components/Nav/AuthModal/index.tsx

@@ -1,5 +1,5 @@
 import { Show } from 'solid-js/web'
-import { createEffect, createMemo } from 'solid-js'
+import { createEffect, createMemo, onMount } from 'solid-js'
 import { t } from '../../../utils/intl'
 import { hideModal } from '../../../stores/ui'
 import { handleClientRouteLinkClick, useRouter } from '../../../stores/router'
@@ -8,15 +8,25 @@ import styles from './AuthModal.module.scss'
 import { LoginForm } from './LoginForm'
 import { RegisterForm } from './RegisterForm'
 import { ForgotPasswordForm } from './ForgotPasswordForm'
-import { ConfirmEmail } from './ConfirmEmail'
+import { EmailConfirm } from './EmailConfirm'
 import type { AuthModalMode, AuthModalSearchParams } from './types'
-import { ConfirmOAuth } from './ConfirmOAuth'
 
+const AUTH_MODAL_MODES: Record<AuthModalMode, AuthModalMode> = {
+  login: 'login',
+  register: 'register',
+  'forgot-password': 'forgot-password',
+  // eslint-disable-next-line sonarjs/no-duplicate-string
+  'confirm-email': 'confirm-email'
+}
 
 export const AuthModal = () => {
   let rootRef: HTMLDivElement
+
   const { searchParams } = useRouter<AuthModalSearchParams>()
-  const mode = createMemo<AuthModalMode>(() => searchParams().mode || 'login')
+
+  const mode = createMemo<AuthModalMode>(() => {
+    return AUTH_MODAL_MODES[searchParams().mode] || 'login'
+  })
 
   createEffect((oldMode) => {
     if (oldMode !== mode()) {
@@ -28,12 +38,12 @@ export const AuthModal = () => {
     <div
       ref={rootRef}
       class={clsx('row', styles.view)}
-      classList={{ [styles.signUp]: mode() === 'register' || mode().startsWith('confirm-') }}
+      classList={{ [styles.signUp]: mode() === 'register' || mode() === 'confirm-email' }}
     >
       <div class={clsx('col-sm-6', 'd-md-none', styles.authImage)}>
         <div
           class={styles.authImageText}
-          classList={{ [styles.hidden]: mode() !== 'register' && !mode().startsWith('confirm-') }}
+          classList={{ [styles.hidden]: mode() !== 'register' && mode() !== 'confirm-email' }}
         >
           <h2>{t('Discours')}</h2>
           <h4>{t(`Join the global community of authors!`)}</h4>
@@ -70,10 +80,7 @@ export const AuthModal = () => {
           <ForgotPasswordForm />
         </Show>
         <Show when={mode() === 'confirm-email'}>
-          <ConfirmEmail />
+          <EmailConfirm />
-        </Show>
-        <Show when={mode() === 'confirm-oauth'}>
-          <ConfirmOAuth />
         </Show>
       </div>
     </div>

src/components/Nav/AuthModal/types.ts

@@ -1,4 +1,4 @@
-export type AuthModalMode = 'login' | 'register' | 'confirm-email' | 'confirm-oauth' | 'forgot-password'
+export type AuthModalMode = 'login' | 'register' | 'confirm-email' | 'forgot-password'
 
 export type AuthModalSearchParams = {
   mode: AuthModalMode

src/components/Nav/Confirmed.scss

@@ -0,0 +1,6 @@
+.center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 420px;
+}

src/components/Nav/Confirmed.tsx

@@ -0,0 +1,18 @@
+import './Confirmed.scss'
+import { onMount } from 'solid-js'
+import { t } from '../../utils/intl'
+
+export const Confirmed = (props: { token?: string }) => {
+  onMount(() => {
+    const token = props.token ?? document.cookie.split(';').at(0).replace('token=', '')
+    window.addEventListener('mousemove', () => window.close())
+    window.addEventListener('keydown', () => window.close())
+    window.addEventListener('click', () => window.close())
+    localStorage.setItem('token', token)
+  })
+  return (
+    <>
+      <div class="center">{t('You was successfully authorized')}</div>
+    </>
+  )
+}

src/components/Nav/Popup.tsx

@@ -1,11 +1,11 @@
-import { createEffect, createSignal, JSX, onMount, Show } from 'solid-js'
+import { createEffect, createSignal, onMount, Show } from 'solid-js'
 import style from './Popup.module.scss'
 import { hideModal, useModalStore } from '../../stores/ui'
 import { clsx } from 'clsx'
 
 interface PopupProps {
   name: string
-  children: JSX.Element
+  children: any
   class?: string
 }
 

src/graphql/types.gen.ts

@@ -171,7 +171,7 @@ export type Mutation = {
 }
 
 export type MutationConfirmEmailArgs = {
-  token: Scalars['String']
+  code: Scalars['String']
 }
 
 export type MutationCreateChatArgs = {

src/locales/ru.json

@@ -157,7 +157,6 @@
   "Restore password": "Восстановить пароль",
   "Hooray! Welcome!": "Ура! Добро пожаловать!",
   "You've confirmed email": "Вы подтвердили почту",
-  "You've confirmed your account": "Вы подтвердили свою учётную запись",
   "This email is already taken. If it's you": "Такой email уже зарегистрирован. Если это вы",
   "enter": "войдите"
 }

src/pages/confirm/[token].astro

@@ -1,4 +1,12 @@
 ---
+import { Confirmed } from '../../components/Nav/Confirmed'
+import { t } from '../../utils/intl'
+
 const token = Astro.params.token?.toString() || ''
-return Astro.redirect('/?modal=confirm-oauth&token=' + token)
 ---
+<html>
+<head><title>{t('Discours')}</title></head>
+<body>
+  <Confirmed token={token} />
+</body>
+</html>

src/pages/confirm/index.astro

@@ -0,0 +1,10 @@
+---
+import { t } from '../../utils/intl'
+import { Confirmed } from '../../components/Nav/Confirmed'
+---
+<html>
+<head><title>{t('Discours')}</title></head>
+<body>
+    <Confirmed />
+</body>
+</html>

src/utils/config.ts

@@ -1,4 +1,4 @@
 export const isDev = import.meta.env.MODE === 'development'
 
-// export const apiBaseUrl = 'https://newapi.discours.io'
+export const apiBaseUrl = 'https://newapi.discours.io'
-export const apiBaseUrl = 'http://localhost:8000'
+// export const apiBaseUrl = 'http://localhost:8000'