style: format

ui/src/pages/setting/Account.tsx

@@ -1,23 +1,16 @@
+import { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+import { z } from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+
 import { Button } from "@/components/ui/button";
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from "@/components/ui/form";
+import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { useToast } from "@/components/ui/use-toast";
 import { getErrMessage } from "@/lib/error";
 import { getPb } from "@/repository/api";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { useNavigate } from "react-router-dom";
-import { useTranslation } from "react-i18next";
-
-import { z } from "zod";
 
 const formSchema = z.object({
   email: z.string().email("settings.account.email.errmsg.invalid"),
@@ -65,10 +58,7 @@ const Account = () => {
     <>
       <div className="w-full md:max-w-[35em]">
         <Form {...form}>
-          <form
-            onSubmit={form.handleSubmit(onSubmit)}
-            className="space-y-8 dark:text-stone-200"
-          >
+          <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8 dark:text-stone-200">
             <FormField
               control={form.control}
               name="email"

ui/src/pages/setting/Notify.tsx

@@ -1,15 +1,11 @@
+import { useTranslation } from "react-i18next";
+
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion";
 import DingTalk from "@/components/notify/DingTalk";
 import NotifyTemplate from "@/components/notify/NotifyTemplate";
 import Telegram from "@/components/notify/Telegram";
 import Webhook from "@/components/notify/Webhook";
-import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionTrigger,
-} from "@/components/ui/accordion";
 import { NotifyProvider } from "@/providers/notify";
-import { useTranslation } from "react-i18next";
 
 const Notify = () => {
   const { t } = useTranslation();
@@ -20,9 +16,7 @@ const Notify = () => {
         <div className="border rounded-sm p-5 shadow-lg">
           <Accordion type={"multiple"} className="dark:text-stone-200">
             <AccordionItem value="item-1" className="dark:border-stone-200">
-              <AccordionTrigger>
-                {t("settings.notification.template.label")}
-              </AccordionTrigger>
+              <AccordionTrigger>{t("settings.notification.template.label")}</AccordionTrigger>
               <AccordionContent>
                 <NotifyTemplate />
               </AccordionContent>

ui/src/pages/setting/Password.tsx

@@ -1,22 +1,15 @@
+import { useForm } from "react-hook-form";
+import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import { z } from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+
 import { Button } from "@/components/ui/button";
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from "@/components/ui/form";
+import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { useToast } from "@/components/ui/use-toast";
 import { getErrMessage } from "@/lib/error";
 import { getPb } from "@/repository/api";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useForm } from "react-hook-form";
-import { useNavigate } from "react-router-dom";
-import { useTranslation } from "react-i18next";
-
-import { z } from "zod";
 
 const formSchema = z
   .object({
@@ -51,10 +44,7 @@ const Password = () => {
 
   const onSubmit = async (values: z.infer<typeof formSchema>) => {
     try {
-      await getPb().admins.authWithPassword(
-        getPb().authStore.model?.email,
-        values.oldPassword
-      );
+      await getPb().admins.authWithPassword(getPb().authStore.model?.email, values.oldPassword);
     } catch (e) {
       const message = getErrMessage(e);
       form.setError("oldPassword", { message });
@@ -88,26 +78,15 @@ const Password = () => {
     <>
       <div className="w-full md:max-w-[35em]">
         <Form {...form}>
-          <form
-            onSubmit={form.handleSubmit(onSubmit)}
-            className="space-y-8 dark:text-stone-200"
-          >
+          <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8 dark:text-stone-200">
             <FormField
               control={form.control}
               name="oldPassword"
               render={({ field }) => (
                 <FormItem>
-                  <FormLabel>
-                    {t("settings.password.current_password.label")}
-                  </FormLabel>
+                  <FormLabel>{t("settings.password.current_password.label")}</FormLabel>
                   <FormControl>
-                    <Input
-                      placeholder={t(
-                        "settings.password.current_password.placeholder"
-                      )}
-                      {...field}
-                      type="password"
-                    />
+                    <Input placeholder={t("settings.password.current_password.placeholder")} {...field} type="password" />
                   </FormControl>
 
                   <FormMessage />
@@ -120,17 +99,9 @@ const Password = () => {
               name="newPassword"
               render={({ field }) => (
                 <FormItem>
-                  <FormLabel>
-                    {t("settings.password.new_password.label")}
-                  </FormLabel>
+                  <FormLabel>{t("settings.password.new_password.label")}</FormLabel>
                   <FormControl>
-                    <Input
-                      placeholder={t(
-                        "settings.password.new_password.placeholder"
-                      )}
-                      {...field}
-                      type="password"
-                    />
+                    <Input placeholder={t("settings.password.new_password.placeholder")} {...field} type="password" />
                   </FormControl>
 
                   <FormMessage />
@@ -143,17 +114,9 @@ const Password = () => {
               name="confirmPassword"
               render={({ field }) => (
                 <FormItem>
-                  <FormLabel>
-                    {t("settings.password.confirm_password.label")}
-                  </FormLabel>
+                  <FormLabel>{t("settings.password.confirm_password.label")}</FormLabel>
                   <FormControl>
-                    <Input
-                      placeholder={t(
-                        "settings.password.confirm_password.placeholder"
-                      )}
-                      {...field}
-                      type="password"
-                    />
+                    <Input placeholder={t("settings.password.confirm_password.placeholder")} {...field} type="password" />
                   </FormControl>
 
                   <FormMessage />

ui/src/pages/setting/SSLProvider.tsx

@@ -1,34 +1,19 @@
-import { Button } from "@/components/ui/button";
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from "@/components/ui/form";
-import { Input } from "@/components/ui/input";
-
-import { Label } from "@/components/ui/label";
-import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
-import { useToast } from "@/components/ui/use-toast";
-
-import {
-  SSLProvider as SSLProviderType,
-  SSLProviderSetting,
-  Setting,
-} from "@/domain/settings";
-import { getErrMessage } from "@/lib/error";
-import { cn } from "@/lib/utils";
-
-import { getSetting, update } from "@/repository/settings";
-import { zodResolver } from "@hookform/resolvers/zod";
-
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-
 import { z } from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+
+import { Button } from "@/components/ui/button";
+import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import { useToast } from "@/components/ui/use-toast";
+import { getErrMessage } from "@/lib/error";
+import { cn } from "@/lib/utils";
+import { SSLProvider as SSLProviderType, SSLProviderSetting, Setting } from "@/domain/settings";
+import { getSetting, update } from "@/repository/settings";
 
 const SSLProvider = () => {
   const { t } = useTranslation();
@@ -64,10 +49,7 @@ const SSLProvider = () => {
 
         form.setValue("provider", content.provider);
         form.setValue("eabKid", content.config[content.provider].eabKid);
-        form.setValue(
-          "eabHmacKey",
-          content.config[content.provider].eabHmacKey
-        );
+        form.setValue("eabHmacKey", content.config[content.provider].eabHmacKey);
         setProvider(content.provider);
       } else {
         form.setValue("provider", "letsencrypt");
@@ -137,10 +119,7 @@ const SSLProvider = () => {
     <>
       <div className="w-full md:max-w-[35em]">
         <Form {...form}>
-          <form
-            onSubmit={form.handleSubmit(onSubmit)}
-            className="space-y-8 dark:text-stone-200"
-          >
+          <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8 dark:text-stone-200">
             <FormField
               control={form.control}
               name="provider"
@@ -160,16 +139,8 @@ const SSLProvider = () => {
                       <div className="flex items-center space-x-2">
                         <RadioGroupItem value="letsencrypt" id="letsencrypt" />
                         <Label htmlFor="letsencrypt">
-                          <div
-                            className={cn(
-                              "flex items-center space-x-2 border p-2 rounded cursor-pointer",
-                              getOptionCls("letsencrypt")
-                            )}
-                          >
-                            <img
-                              src={"/imgs/providers/letsencrypt.svg"}
-                              className="h-6"
-                            />
+                          <div className={cn("flex items-center space-x-2 border p-2 rounded cursor-pointer", getOptionCls("letsencrypt"))}>
+                            <img src={"/imgs/providers/letsencrypt.svg"} className="h-6" />
                             <div>{"Let's Encrypt"}</div>
                           </div>
                         </Label>
@@ -177,16 +148,8 @@ const SSLProvider = () => {
                       <div className="flex items-center space-x-2">
                         <RadioGroupItem value="zerossl" id="zerossl" />
                         <Label htmlFor="zerossl">
-                          <div
-                            className={cn(
-                              "flex items-center space-x-2 border p-2 rounded cursor-pointer",
-                              getOptionCls("zerossl")
-                            )}
-                          >
-                            <img
-                              src={"/imgs/providers/zerossl.svg"}
-                              className="h-6"
-                            />
+                          <div className={cn("flex items-center space-x-2 border p-2 rounded cursor-pointer", getOptionCls("zerossl"))}>
+                            <img src={"/imgs/providers/zerossl.svg"} className="h-6" />
                             <div>{"ZeroSSL"}</div>
                           </div>
                         </Label>
@@ -201,11 +164,7 @@ const SSLProvider = () => {
                       <FormItem hidden={provider !== "zerossl"}>
                         <FormLabel>EAB_KID</FormLabel>
                         <FormControl>
-                          <Input
-                            placeholder={t("settings.ca.eab_kid.errmsg.empty")}
-                            {...field}
-                            type="text"
-                          />
+                          <Input placeholder={t("settings.ca.eab_kid.errmsg.empty")} {...field} type="text" />
                         </FormControl>
 
                         <FormMessage />
@@ -220,13 +179,7 @@ const SSLProvider = () => {
                       <FormItem hidden={provider !== "zerossl"}>
                         <FormLabel>EAB_HMAC_KEY</FormLabel>
                         <FormControl>
-                          <Input
-                            placeholder={t(
-                              "settings.ca.eab_hmac_key.errmsg.empty"
-                            )}
-                            {...field}
-                            type="text"
-                          />
+                          <Input placeholder={t("settings.ca.eab_hmac_key.errmsg.empty")} {...field} type="text" />
                         </FormControl>
 
                         <FormMessage />