Change i18n package to paraglideJs

also refactor auth provider

src/components/form/settings-form.tsx

@@ -1,33 +1,24 @@
+import { m } from '@/paraglide/messages';
 import { settingQueries } from '@/service/queries';
 import { updateSettings } from '@/service/setting.api';
 import { settingSchema, SettingsInput } from '@/service/setting.schema';
 import { GearIcon } from '@phosphor-icons/react';
 import { useForm } from '@tanstack/react-form';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { useTranslation } from 'react-i18next';
 import { toast } from 'sonner';
 import { Button } from '../ui/button';
 import { Card, CardContent, CardHeader, CardTitle } from '../ui/card';
 import { Field, FieldError, FieldGroup, FieldLabel } from '../ui/field';
 import { Input } from '../ui/input';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '../ui/select';
 import { Textarea } from '../ui/textarea';
 
 const defaultValues: SettingsInput = {
-  site_language: '',
   site_name: '',
   site_description: '',
   site_keywords: '',
 };
 
 const SettingsForm = () => {
-  const { t } = useTranslation();
   const queryClient = useQueryClient();
 
   const { data: settings } = useQuery(settingQueries.list());
@@ -35,8 +26,11 @@ const SettingsForm = () => {
   const updateMutation = useMutation({
     mutationFn: updateSettings,
     onSuccess: () => {
+      // setLocale(variables.data.site_language as Locale);
       queryClient.invalidateQueries({ queryKey: settingQueries.all });
-      toast.success(t('settings.messages.update_success'));
+      toast.success(m.settings_messages_update_success(), {
+        richColors: true,
+      });
     },
   });
 
@@ -46,7 +40,6 @@ const SettingsForm = () => {
       site_name: settings?.site_name?.value || '',
       site_description: settings?.site_description?.value || '',
       site_keywords: settings?.site_keywords?.value || '',
-      site_language: settings?.site_language?.value || '',
     },
     validators: {
       onSubmit: settingSchema,
@@ -62,7 +55,7 @@ const SettingsForm = () => {
       <CardHeader>
         <CardTitle className="text-xl flex items-center gap-2">
           <GearIcon size={20} />
-          {t('settings.ui.title')}
+          {m.settings_ui_title()}
         </CardTitle>
       </CardHeader>
       <CardContent>
@@ -83,7 +76,7 @@ const SettingsForm = () => {
                 return (
                   <Field data-invalid={isInvalid} className="col-span-2">
                     <FieldLabel htmlFor={field.name}>
-                      {t('settings.form.name')}
+                      {m.settings_form_name()}
                     </FieldLabel>
                     <Input
                       id={field.name}
@@ -108,7 +101,7 @@ const SettingsForm = () => {
                 return (
                   <Field data-invalid={isInvalid} className="col-span-2">
                     <FieldLabel htmlFor={field.name}>
-                      {t('settings.form.description')}
+                      {m.settings_form_description()}
                     </FieldLabel>
                     <Textarea
                       id={field.name}
@@ -134,7 +127,7 @@ const SettingsForm = () => {
                 return (
                   <Field data-invalid={isInvalid} className="col-span-2">
                     <FieldLabel htmlFor={field.name}>
-                      {t('settings.form.keywords')}
+                      {m.settings_form_keywords()}
                     </FieldLabel>
                     <Textarea
                       id={field.name}
@@ -152,7 +145,7 @@ const SettingsForm = () => {
                 );
               }}
             />
-            <form.Field
+            {/* <form.Field
               name="site_language"
               children={(field) => {
                 const isInvalid =
@@ -160,7 +153,7 @@ const SettingsForm = () => {
                 return (
                   <Field data-invalid={isInvalid} className="col-span-2">
                     <FieldLabel htmlFor={field.name}>
-                      {t('settings.form.language')}
+                      {m.settings_form_language()}
                     </FieldLabel>
                     <Select
                       name={field.name}
@@ -182,9 +175,9 @@ const SettingsForm = () => {
                   </Field>
                 );
               }}
-            />
+            /> */}
             <Field>
-              <Button type="submit">{t('ui.update_btn')}</Button>
+              <Button type="submit">{m.ui_update_btn()}</Button>
             </Field>
           </FieldGroup>
         </form>