gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/auth/login/form.tsx · v0.6.2
Source
1 4466347 Mrdn 2y ago
2 4466347 Mrdn 2y ago import { fetch } from "@marzneshin/utils"
3 4466347 Mrdn 2y ago import { LoginSchema, useAuth } from "@marzneshin/features/auth";
4 4466347 Mrdn 2y ago import { useNavigate } from "@tanstack/react-router";
5 4466347 Mrdn 2y ago import { useState } from "react";
6 4466347 Mrdn 2y ago import { FieldValues, useForm } from "react-hook-form";
7 4466347 Mrdn 2y ago import { zodResolver } from '@hookform/resolvers/zod';
8 4466347 Mrdn 2y ago import { Button, Form, FormControl, FormField, FormItem, FormLabel, FormMessage, Input } from "@marzneshin/components";
9 4466347 Mrdn 2y ago import { useTranslation } from "react-i18next";
10 4466347 Mrdn 2y ago import { FormError } from "./form-error";
11 4466347 Mrdn 2y ago
12 4466347 Mrdn 2y ago export const LoginForm = () => {
13 9ddfbc8 Mardin 2y ago const { setAuthToken, setSudo } = useAuth();
14 4466347 Mrdn 2y ago const form = useForm({
15 4466347 Mrdn 2y ago resolver: zodResolver(LoginSchema),
16 4466347 Mrdn 2y ago defaultValues: {
17 4466347 Mrdn 2y ago username: '',
18 4466347 Mrdn 2y ago password: '',
19 4466347 Mrdn 2y ago }
20 4466347 Mrdn 2y ago })
21 4466347 Mrdn 2y ago const navigate = useNavigate({ from: '/login' });
22 4466347 Mrdn 2y ago const [error, setError] = useState<string>('');
23 4466347 Mrdn 2y ago const { t } = useTranslation();
24 4466347 Mrdn 2y ago
25 9ddfbc8 Mardin 2y ago const submit = async (values: FieldValues) => {
26 4466347 Mrdn 2y ago setError('');
27 4466347 Mrdn 2y ago const formData = new FormData();
28 4466347 Mrdn 2y ago formData.append('username', values.username);
29 4466347 Mrdn 2y ago formData.append('password', values.password);
30 4466347 Mrdn 2y ago formData.append('grant_type', 'password');
31 9ddfbc8 Mardin 2y ago
32 9ddfbc8 Mardin 2y ago try {
33 9ddfbc8 Mardin 2y ago const { access_token, is_sudo } = await fetch('/admins/token', { method: 'post', body: formData });
34 9ddfbc8 Mardin 2y ago setAuthToken(access_token);
35 9ddfbc8 Mardin 2y ago setSudo(is_sudo);
36 9ddfbc8 Mardin 2y ago navigate({ to: '/' });
37 9ddfbc8 Mardin 2y ago } catch (err: any) {
38 9ddfbc8 Mardin 2y ago setError(err.response._data?.detail || 'An error occurred');
39 9ddfbc8 Mardin 2y ago }
40 4466347 Mrdn 2y ago };
41 4466347 Mrdn 2y ago
42 4466347 Mrdn 2y ago return (
43 4466347 Mrdn 2y ago <Form {...form}>
44 4466347 Mrdn 2y ago <form onSubmit={form.handleSubmit(submit)}>
45 4466347 Mrdn 2y ago <FormField
46 4466347 Mrdn 2y ago control={form.control}
47 4466347 Mrdn 2y ago name="username"
48 4466347 Mrdn 2y ago render={({ field }) => (
49 4466347 Mrdn 2y ago <FormItem>
50 4466347 Mrdn 2y ago <FormLabel className="font-semibold text-primary">{t('username')}</FormLabel>
51 4466347 Mrdn 2y ago <FormControl>
52 25f60ca Mrdn 2y ago <Input type="text" {...field} />
53 4466347 Mrdn 2y ago </FormControl>
54 4466347 Mrdn 2y ago <FormMessage />
55 4466347 Mrdn 2y ago </FormItem>
56 4466347 Mrdn 2y ago )}
57 4466347 Mrdn 2y ago />
58 4466347 Mrdn 2y ago <FormField
59 4466347 Mrdn 2y ago control={form.control}
60 4466347 Mrdn 2y ago name="password"
61 4466347 Mrdn 2y ago render={({ field }) => (
62 4466347 Mrdn 2y ago <FormItem>
63 4466347 Mrdn 2y ago <FormLabel className="font-semibold text-primary">{t('password')}</FormLabel>
64 4466347 Mrdn 2y ago <FormControl>
65 25f60ca Mrdn 2y ago <Input type="password" {...field} />
66 4466347 Mrdn 2y ago </FormControl>
67 4466347 Mrdn 2y ago <FormMessage />
68 4466347 Mrdn 2y ago </FormItem>
69 4466347 Mrdn 2y ago )}
70 4466347 Mrdn 2y ago />
71 4466347 Mrdn 2y ago <Button className="mt-3 w-full" type="submit">{t('login')}</Button>
72 4466347 Mrdn 2y ago {error && <FormError className="mt-2" title='Submission failed' desc={error} />}
73 4466347 Mrdn 2y ago </form>
74 4466347 Mrdn 2y ago </Form>
75 4466347 Mrdn 2y ago )
76 4466347 Mrdn 2y ago }