style(web): format invitation flows

This commit is contained in:
dadachann
2026-07-26 14:01:20 +08:00
parent e90a1546de
commit d71bd571b1
2 changed files with 69 additions and 56 deletions
+12 -5
View File
@@ -92,7 +92,8 @@ export default function AcceptInvitationPage() {
const [errorMessage, setErrorMessage] = useState(''); const [errorMessage, setErrorMessage] = useState('');
const [password, setPassword] = useState(''); const [password, setPassword] = useState('');
const [confirmPassword, setConfirmPassword] = useState(''); const [confirmPassword, setConfirmPassword] = useState('');
const [passwordRegistrationEnabled, setPasswordRegistrationEnabled] = useState(false); const [passwordRegistrationEnabled, setPasswordRegistrationEnabled] =
useState(false);
useEffect(() => { useEffect(() => {
const handleHashChange = () => setInvitationHash(window.location.hash); const handleHashChange = () => setInvitationHash(window.location.hash);
@@ -109,9 +110,12 @@ export default function AcceptInvitationPage() {
'error', 'error',
); );
setToken(invitationToken); setToken(invitationToken);
backendClient.getAccountInfo().then((info) => { backendClient
setPasswordRegistrationEnabled(info.password_login_enabled !== false); .getAccountInfo()
}).catch(() => setPasswordRegistrationEnabled(false)); .then((info) => {
setPasswordRegistrationEnabled(info.password_login_enabled !== false);
})
.catch(() => setPasswordRegistrationEnabled(false));
if (!invitationToken) { if (!invitationToken) {
setErrorMessage(t('workspace.invitationMissing')); setErrorMessage(t('workspace.invitationMissing'));
setStatus('error'); setStatus('error');
@@ -398,7 +402,10 @@ export default function AcceptInvitationPage() {
</Button> </Button>
</> </>
) : ( ) : (
<Button className="w-full" onClick={() => navigate('/login?invitation=1&auto=space')}> <Button
className="w-full"
onClick={() => navigate('/login?invitation=1&auto=space')}
>
{t('common.loginWithSpace')} {t('common.loginWithSpace')}
</Button> </Button>
)} )}
+57 -51
View File
@@ -44,7 +44,8 @@ export default function Register() {
const navigate = useNavigate(); const navigate = useNavigate();
const { t } = useTranslation(); const { t } = useTranslation();
const [spaceLoading, setSpaceLoading] = useState(false); const [spaceLoading, setSpaceLoading] = useState(false);
const [passwordRegistrationEnabled, setPasswordRegistrationEnabled] = useState(true); const [passwordRegistrationEnabled, setPasswordRegistrationEnabled] =
useState(true);
const form = useForm<z.infer<ReturnType<typeof formSchema>>>({ const form = useForm<z.infer<ReturnType<typeof formSchema>>>({
resolver: zodResolver(formSchema(t)), resolver: zodResolver(formSchema(t)),
@@ -58,7 +59,9 @@ export default function Register() {
getIsInitialized(); getIsInitialized();
httpClient httpClient
.getAccountInfo() .getAccountInfo()
.then((info) => setPasswordRegistrationEnabled(info.password_login_enabled !== false)) .then((info) =>
setPasswordRegistrationEnabled(info.password_login_enabled !== false),
)
.catch(() => setPasswordRegistrationEnabled(true)); .catch(() => setPasswordRegistrationEnabled(true));
}, []); }, []);
@@ -179,57 +182,60 @@ export default function Register() {
{/* Local Account Registration */} {/* Local Account Registration */}
<Form {...form}> <Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6"> <form
<FormField onSubmit={form.handleSubmit(onSubmit)}
control={form.control} className="space-y-6"
name="email" >
render={({ field }) => ( <FormField
<FormItem> control={form.control}
<FormLabel>{t('common.email')}</FormLabel> name="email"
<FormControl> render={({ field }) => (
<div className="relative"> <FormItem>
<Mail className="absolute left-3 top-3 h-4 w-4 text-gray-400" /> <FormLabel>{t('common.email')}</FormLabel>
<Input <FormControl>
placeholder={t('common.enterEmail')} <div className="relative">
className="pl-10" <Mail className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
{...field} <Input
/> placeholder={t('common.enterEmail')}
</div> className="pl-10"
</FormControl> {...field}
<FormMessage /> />
</FormItem> </div>
)} </FormControl>
/> <FormMessage />
</FormItem>
)}
/>
<FormField <FormField
control={form.control} control={form.control}
name="password" name="password"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>{t('common.password')}</FormLabel> <FormLabel>{t('common.password')}</FormLabel>
<FormControl> <FormControl>
<div className="relative"> <div className="relative">
<Lock className="absolute left-3 top-3 h-4 w-4 text-gray-400" /> <Lock className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
<Input <Input
type="password" type="password"
placeholder={t('common.enterPassword')} placeholder={t('common.enterPassword')}
className="pl-10" className="pl-10"
{...field} {...field}
/> />
</div> </div>
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
/> />
<Button <Button
type="submit" type="submit"
variant="outline" variant="outline"
className="w-full cursor-pointer" className="w-full cursor-pointer"
> >
{t('register.registerWithPassword')} {t('register.registerWithPassword')}
</Button> </Button>
</form> </form>
</Form> </Form>
</> </>