Merge pull request #66 from Dialogue-Bot/DIAL-42-implement-test-your-bot

Dial 42 implement test your bot

Author: hi02102002

client/src/apis/auth.ts

@@ -1,7 +1,7 @@
 import { ENDPOINTS } from '@/constants'
 import http_client from '@/lib/http-client'
-import { TForgotPass } from '@/lib/schema/forgot-pass'
 import { TLogin } from '@/lib/schema/login'
+import { TForgotPass } from '@/lib/schema/mail'
 import { TRegister } from '@/lib/schema/register'
 import { TSetPass } from '@/lib/schema/set-pass'
 import { TBaseResponse, TToken } from '@/types/share'
@@ -45,6 +45,13 @@ class Auth {
   logout(): Promise<TBaseResponse<null>> {
     return http_client.post(ENDPOINTS.AUTH.LOGOUT)
   }
+
+  requestVerifyAccount(email: string): Promise<TBaseResponse<null>> {
+    return http_client.post(ENDPOINTS.AUTH.REQUEST_VERIFY_ACCOUNT, { email })
+  }
+  verifyAccount(token: string): Promise<TBaseResponse<null>> {
+    return http_client.post(ENDPOINTS.AUTH.VERIFY_ACCOUNT, { token })
+  }
 }
 
 export const auth = new Auth()

client/src/components/forms/index.tsx

@@ -1,8 +1,8 @@
 export * from './card'
 export * from './change-pass'
-export * from './forgot-pass'
 export * from './general-setting'
 export * from './login'
+export * from './mail'
 export * from './register'
 export * from './set-pass'
 export * from './setting-mail'

client/src/components/forms/intent.tsx

@@ -4,6 +4,7 @@ import {
 } from '@/lib/schema/intent-input'
 import { TIntentInput } from '@/types/intent'
 import { zodResolver } from '@hookform/resolvers/zod'
+import { createId } from '@paralleldrive/cuid2'
 import _ from 'lodash'
 import { Minus, Plus } from 'lucide-react'
 import { useCallback } from 'react'
@@ -38,14 +39,13 @@ const IntentForm = ({ defaultValues, id = 'intent-form', onSubmit }: Props) => {
   const form = useForm<TIntentInputForm>({
     defaultValues: {
       trainType: 'manual',
+      referenceId: createId(),
       ...defaultValues,
     },
     resolver: zodResolver(schema),
     mode: 'onChange',
   })
 
-  console.log(form.formState.errors)
-
   const watchTrainType = form.watch('trainType')
   const trainDescriptionWatch = useWatch({
     control: form.control,
@@ -369,6 +369,7 @@ const IntentForm = ({ defaultValues, id = 'intent-form', onSubmit }: Props) => {
                     <Input
                       {...field}
                       placeholder={t('referenceId.placeholder')}
+                      disabled
                     />
                   </FormControl>
                   <FormMessage />

client/src/components/forms/forgot-pass.tsx renamed to client/src/components/forms/mail.tsx

@@ -1,10 +1,9 @@
 import { useErrorsLngChange } from '@/hooks/use-errors-lng-change'
-import { TForgotPass, useForgotPassSchema } from '@/lib/schema/forgot-pass'
+import { TEmail, useMailSchema } from '@/lib/schema/mail'
 import { zodResolver } from '@hookform/resolvers/zod'
 import { useForm } from 'react-hook-form'
 import { useTranslation } from 'react-i18next'
 import {
-  Button,
   Form,
   FormControl,
   FormField,
@@ -15,29 +14,39 @@ import {
 } from '../ui'
 
 type Props = {
-  loading?: boolean
-  onSubmit?: (data: TForgotPass) => void
+  onSubmit?: (data: TEmail) => void
+  id?: string
+  defaultValues?: TEmail
 }
 
-export const ForgotPassForm = ({ loading, onSubmit }: Props) => {
+export const MailForm = ({
+  onSubmit,
+  id = 'mail-form',
+  defaultValues,
+}: Props) => {
   const { t } = useTranslation(['set_pass', 'forms'])
 
-  const schema = useForgotPassSchema()
+  const schema = useMailSchema()
 
-  const form = useForm<TForgotPass>({
+  const form = useForm<TEmail>({
     resolver: zodResolver(schema),
     mode: 'onChange',
+    defaultValues,
   })
 
-  const handleSubmit = (data: TForgotPass) => {
+  const handleSubmit = (data: TEmail) => {
     onSubmit?.(data)
   }
 
   useErrorsLngChange(form)
 
   return (
     <Form {...form}>
-      <form className='space-y-3' onSubmit={form.handleSubmit(handleSubmit)}>
+      <form
+        className='space-y-3'
+        onSubmit={form.handleSubmit(handleSubmit)}
+        id={id}
+      >
         <FormField
           control={form.control}
           name='email'
@@ -62,14 +71,9 @@ export const ForgotPassForm = ({ loading, onSubmit }: Props) => {
             )
           }}
         />
-        <Button className='w-full' type='submit' loading={loading}>
-          {t('btn_submit', {
-            ns: 'set_pass',
-          })}
-        </Button>
       </form>
     </Form>
   )
 }
 
-export default ForgotPassForm
+export default MailForm

client/src/components/ui/multiple-lelect.tsx

@@ -1,9 +1,9 @@
+import { cn } from '@/lib/utils'
 import { CaretSortIcon } from '@radix-ui/react-icons'
+import { CheckIcon, X } from 'lucide-react'
 import { memo, useCallback, useMemo, useState } from 'react'
-import { Popover, PopoverContent, PopoverTrigger } from './popover'
-import { cn } from '@/lib/utils'
 import { Badge } from './badge'
-import { CheckIcon, X } from 'lucide-react'
+import { Popover, PopoverContent, PopoverTrigger } from './popover'
 
 export type TOption = {
   label: string
@@ -72,7 +72,7 @@ export const MultipleSelect = memo(
     return (
       <Popover>
         <PopoverTrigger asChild>
-          <div className='flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 cursor-pointer focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none select-none gap-1'>
+          <div className='flex min-h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 cursor-pointer focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none select-none gap-1 flex-wrap'>
             {selectedWithLabel && selectedWithLabel.length ? (
               selectedWithLabel?.map((item) => (
                 <Badge

client/src/constants/index.ts

@@ -12,6 +12,8 @@ export const ENDPOINTS = {
     RESET_PASSWORD: '/auth/reset-password',
     WITH_ID_TOKEN: '/auth/with-id-token',
     LOGOUT: '/auth/logout',
+    VERIFY_ACCOUNT: '/auth/verify-account',
+    REQUEST_VERIFY_ACCOUNT: '/auth/request-verify-account',
   },
   UPLOAD: {
     SINGLE: '/upload/single',
@@ -53,6 +55,8 @@ export const ROUTES = {
     REGISTER: '/register',
     FORGOT_PASS: '/forgot-password',
     RESET_PASS: '/set-password',
+    REQUEST_VERIFY_ACCOUNT: '/request-verify-account',
+    VERIFY_ACCOUNT: '/verify-account',
   },
   PUBLIC: {
     LANDING_PAGE: '/',

client/src/hooks/auth/index.ts

@@ -4,4 +4,5 @@ export * from './use-login-with-id-token'
 export * from './use-login-with-provider'
 export * from './use-logout'
 export * from './use-register'
+export * from './use-req-verify-account'
 export * from './use-set-pass'

client/src/hooks/auth/use-forgot-pass.ts

@@ -1,13 +1,13 @@
 import { auth } from '@/apis/auth'
-import { TForgotPass } from '@/lib/schema/forgot-pass'
+import { TEmail } from '@/lib/schema/mail'
 import { useMutation } from '@tanstack/react-query'
 import { useTranslation } from 'react-i18next'
 import { toast } from 'sonner'
 
 export const useForgotPass = () => {
   const { t } = useTranslation('common')
   return useMutation({
-    mutationFn: (data: TForgotPass) => {
+    mutationFn: (data: TEmail) => {
       return auth.forgotPassword(data)
     },
     onSuccess(data) {

client/src/hooks/auth/use-login.ts

@@ -2,12 +2,13 @@ import { auth } from '@/apis/auth'
 import { TLogin } from '@/lib/schema/login'
 import { useMutation } from '@tanstack/react-query'
 import { useTranslation } from 'react-i18next'
-import { useSearchParams } from 'react-router-dom'
+import { useNavigate, useSearchParams } from 'react-router-dom'
 import { toast } from 'sonner'
 
 export const useLogin = () => {
   const { t } = useTranslation('common')
   const [search] = useSearchParams()
+  const navigate = useNavigate()
   return useMutation({
     mutationFn: (data: TLogin) => {
       return auth.login(data)
@@ -18,6 +19,10 @@ export const useLogin = () => {
     onError(err: any) {
       console.log(err)
       toast.error(err?.response?.data?.message || t('api_error'))
+
+      if (err?.response?.data?.errorKey === 'EMAIL_NOT_VERIFIED') {
+        navigate('/request-verify-account')
+      }
     },
   })
 }

client/src/hooks/auth/use-register.ts

@@ -1,4 +1,5 @@
 import { auth } from '@/apis/auth'
+import { ROUTES } from '@/constants'
 import { TRegister } from '@/lib/schema/register'
 import { useMutation } from '@tanstack/react-query'
 import { useTranslation } from 'react-i18next'
@@ -12,9 +13,11 @@ export const useRegister = () => {
     mutationFn: (data: TRegister) => {
       return auth.register(data)
     },
-    onSuccess(data) {
+    onSuccess(data, variables) {
       toast.success(data.message)
-      navigate('/login')
+      navigate(
+        `${ROUTES.AUTH.REQUEST_VERIFY_ACCOUNT}?send=true&email=${variables.email}`,
+      )
     },
     onError(err: any) {
       toast.error(err?.response?.data?.message || t('api_error'))