| | |
| | | 'use client' |
| | | import React, { type Reducer, useEffect, useReducer } from 'react' |
| | | import React, { useEffect, useReducer } from 'react' |
| | | import { useTranslation } from 'react-i18next' |
| | | import Link from 'next/link' |
| | | import useSWR from 'swr' |
| | |
| | | timezone: string |
| | | } |
| | | |
| | | type IAction = |
| | | | { type: 'failed', payload: null } |
| | | | { type: 'invitation_code', value: string } |
| | | | { type: 'interface_language', value: string } |
| | | | { type: 'timezone', value: string } |
| | | | { type: 'formState', value: 'processing' } |
| | | |
| | | const reducer: Reducer<IState, IAction> = (state: IState, action: IAction) => { |
| | | const reducer = (state: IState, action: any) => { |
| | | switch (action.type) { |
| | | case 'invitation_code': |
| | | return { ...state, invitation_code: action.value } |
| | |
| | | |
| | | return ( |
| | | <> |
| | | <div className="mx-auto w-full"> |
| | | <div className="w-full mx-auto"> |
| | | <h2 className="title-4xl-semi-bold text-text-secondary">{t('login.oneMoreStep')}</h2> |
| | | <p className='body-md-regular mt-1 text-text-tertiary'>{t('login.createSample')}</p> |
| | | <p className='mt-1 body-md-regular text-text-tertiary'>{t('login.createSample')}</p> |
| | | </div> |
| | | |
| | | <div className="mx-auto mt-6 w-full"> |
| | | <div className="relative"> |
| | | <div className="w-full mx-auto mt-6"> |
| | | <div className="bg-white"> |
| | | <div className="mb-5"> |
| | | <label className="system-md-semibold my-2 flex items-center justify-between text-text-secondary"> |
| | | <label className="my-2 flex items-center justify-between system-md-semibold text-text-secondary"> |
| | | {t('login.invitationCode')} |
| | | <Tooltip |
| | | popupContent={ |
| | | <div className='w-[256px] text-xs font-medium'> |
| | | <div className='font-medium'>{t('login.sendUsMail')}</div> |
| | | <div className='cursor-pointer text-xs font-medium text-text-accent-secondary'> |
| | | <div className='text-xs font-medium cursor-pointer text-text-accent-secondary'> |
| | | <a href="mailto:request-invitation@langgenius.ai">request-invitation@langgenius.ai</a> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | </div> |
| | | <div className='mb-5'> |
| | | <label htmlFor="name" className="system-md-semibold my-2 text-text-secondary"> |
| | | <label htmlFor="name" className="my-2 system-md-semibold text-text-secondary"> |
| | | {t('login.interfaceLanguage')} |
| | | </label> |
| | | <div className="mt-1"> |
| | |
| | | defaultValue={LanguagesSupported[0]} |
| | | items={languages.filter(item => item.supported)} |
| | | onSelect={(item) => { |
| | | dispatch({ type: 'interface_language', value: item.value as typeof LanguagesSupported[number] }) |
| | | dispatch({ type: 'interface_language', value: item.value }) |
| | | }} |
| | | /> |
| | | </div> |
| | |
| | | defaultValue={state.timezone} |
| | | items={timezones} |
| | | onSelect={(item) => { |
| | | dispatch({ type: 'timezone', value: item.value as typeof state.timezone }) |
| | | dispatch({ type: 'timezone', value: item.value }) |
| | | }} |
| | | /> |
| | | </div> |
| | |
| | | {t('login.go')} |
| | | </Button> |
| | | </div> |
| | | <div className="system-xs-regular mt-2 block w-full text-text-tertiary"> |
| | | <div className="block w-full mt-2 system-xs-regular text-text-tertiary"> |
| | | {t('login.license.tip')} |
| | | |
| | | <Link |
| | | className='system-xs-medium text-text-accent-secondary' |
| | | target='_blank' rel='noopener noreferrer' |
| | | href={'https://docs.dify.ai/en/policies/agreement/README'} |
| | | href={'https://docs.dify.ai/user-agreement/open-source'} |
| | | >{t('login.license.link')}</Link> |
| | | </div> |
| | | </div> |