fix: fix some page name error

web/src/components/overlay/CreateUserDialog.tsx

@@ -51,9 +51,12 @@ export default function CreateUserDialog({
     .object({
       user: z
         .string()
-        .min(1, t("users.dialog.form.usernameIsRequired", {
-          ns: "views/settings",
-        }))
+        .min(
+          1,
+          t("users.dialog.form.usernameIsRequired", {
+            ns: "views/settings",
+          }),
+        )
         .regex(/^[A-Za-z0-9._]+$/, {
           message: t("users.dialog.createUser.usernameOnlyInclude", {
             ns: "views/settings",
@@ -135,13 +138,13 @@ export default function CreateUserDialog({
               render={({ field }) => (
                 <FormItem>
                   <FormLabel className="text-sm font-medium">
-                    <Trans ns="views/settings">
-                      users.dialog.form.user
-                    </Trans>
+                    <Trans ns="views/settings">users.dialog.form.user</Trans>
                   </FormLabel>
                   <FormControl>
                     <Input
-                      placeholder={t("users.dialog.form.user.placeholder", { ns: "views/settings" })}
+                      placeholder={t("users.dialog.form.user.placeholder", {
+                        ns: "views/settings",
+                      })}
                       className="h-10"
                       {...field}
                     />
@@ -167,7 +170,9 @@ export default function CreateUserDialog({
                   </FormLabel>
                   <FormControl>
                     <Input
-                      placeholder={t("users.dialog.form.password.placeholder", { ns: "views/settings" })}
+                      placeholder={t("users.dialog.form.password.placeholder", {
+                        ns: "views/settings",
+                      })}
                       type="password"
                       className="h-10"
                       {...field}
@@ -189,7 +194,10 @@ export default function CreateUserDialog({
                   </FormLabel>
                   <FormControl>
                     <Input
-                      placeholder={t("users.dialog.form.password.confirm.placeholder", { ns: "views/settings" })}
+                      placeholder={t(
+                        "users.dialog.form.password.confirm.placeholder",
+                        { ns: "views/settings" },
+                      )}
                       type="password"
                       className="h-10"
                       {...field}
@@ -211,7 +219,7 @@ export default function CreateUserDialog({
                           <LuX className="size-3.5 text-red-500" />
                           <span className="text-red-600">
                             <Trans ns="views/settings">
-                            users.dialog.form.password.notMatch
+                              users.dialog.form.password.notMatch
                             </Trans>
                           </span>
                         </>

web/src/components/overlay/RoleChangeDialog.tsx

@@ -45,7 +45,9 @@ export default function RoleChangeDialog({
             <Trans ns="views/settings">users.dialog.changeRole.title</Trans>
           </DialogTitle>
           <DialogDescription>
-            <Trans ns="views/settings" values={{username}}>users.dialog.changeRole.desc</Trans>
+            <Trans ns="views/settings" values={{ username }}>
+              users.dialog.changeRole.desc
+            </Trans>
           </DialogDescription>
         </DialogHeader>
 
@@ -67,13 +69,17 @@ export default function RoleChangeDialog({
               <SelectItem value="admin" className="flex items-center gap-2">
                 <div className="flex items-center gap-2">
                   <LuShield className="size-4 text-primary" />
-                  <span><Trans>role.admin</Trans></span>
+                  <span>
+                    <Trans>role.admin</Trans>
+                  </span>
                 </div>
               </SelectItem>
               <SelectItem value="viewer" className="flex items-center gap-2">
                 <div className="flex items-center gap-2">
                   <LuUser className="size-4 text-primary" />
-                  <span><Trans>role.viewer</Trans></span>
+                  <span>
+                    <Trans>role.viewer</Trans>
+                  </span>
                 </div>
               </SelectItem>
             </SelectContent>

web/src/components/overlay/SetPasswordDialog.tsx

@@ -79,10 +79,21 @@ export default function SetPasswordDialog({
 
   const getStrengthLabel = () => {
     if (!password) return "";
-    if (passwordStrength <= 1) return t("users.dialog.form.password.strength.weak", { ns: "views/settings" });
-    if (passwordStrength === 2) return t("users.dialog.form.password.strength.medium", { ns: "views/settings" });
-    if (passwordStrength === 3) return t("users.dialog.form.password.strength.strong", { ns: "views/settings" });
-    return t("users.dialog.form.password.strength.veryStrong", { ns: "views/settings" });
+    if (passwordStrength <= 1)
+      return t("users.dialog.form.password.strength.weak", {
+        ns: "views/settings",
+      });
+    if (passwordStrength === 2)
+      return t("users.dialog.form.password.strength.medium", {
+        ns: "views/settings",
+      });
+    if (passwordStrength === 3)
+      return t("users.dialog.form.password.strength.strong", {
+        ns: "views/settings",
+      });
+    return t("users.dialog.form.password.strength.veryStrong", {
+      ns: "views/settings",
+    });
   };
 
   const getStrengthColor = () => {
@@ -142,7 +153,9 @@ export default function SetPasswordDialog({
                   />
                 </div>
                 <p className="text-xs text-muted-foreground">
-                  <Trans ns="views/settings">users.dialog.form.password.strength</Trans>
+                  <Trans ns="views/settings">
+                    users.dialog.form.password.strength
+                  </Trans>
                   <span className="font-medium">{getStrengthLabel()}</span>
                 </p>
               </div>
@@ -164,7 +177,10 @@ export default function SetPasswordDialog({
                 setConfirmPassword(event.target.value);
                 setError(null);
               }}
-              placeholder={t("users.dialog.form.newPassword.confirm.placeholder", { ns: "views/settings"})}
+              placeholder={t(
+                "users.dialog.form.newPassword.confirm.placeholder",
+                { ns: "views/settings" },
+              )}
             />
 
             {/* Password match indicator */}

web/src/pages/Settings.tsx

@@ -70,7 +70,7 @@ export default function Settings() {
 
   const isAdmin = useIsAdmin();
 
-  const allowedViewsForViewer: SettingsType[] = ["UI settings", "debug"];
+  const allowedViewsForViewer: SettingsType[] = ["uiSettings", "debug"];
   const visibleSettingsViews = !isAdmin
     ? allowedViewsForViewer
     : allSettingsViews;
@@ -164,7 +164,7 @@ export default function Settings() {
     if (allSettingsViews.includes(page as SettingsType)) {
       // Restrict viewer to UI settings
       if (!isAdmin && !["UI settings", "debug"].includes(page)) {
-        setPage("UI settings");
+        setPage("uiSettings");
       } else {
         setPage(page as SettingsType);
       }
@@ -200,7 +200,7 @@ export default function Settings() {
                 if (value) {
                   // Restrict viewer navigation
                   if (!isAdmin && !["UI settings", "debug"].includes(value)) {
-                    setPageToggle("UI settings");
+                    setPageToggle("uiSettings");
                   } else {
                     setPageToggle(value);
                   }

web/src/views/settings/AuthenticationView.tsx

@@ -224,7 +224,9 @@ export default function AuthenticationView() {
                     <TableHead className="w-[250px]">
                       <Trans ns="views/settings">users.table.username</Trans>
                     </TableHead>
-                    <TableHead><Trans ns="views/settings">users.table.role</Trans></TableHead>
+                    <TableHead>
+                      <Trans ns="views/settings">users.table.role</Trans>
+                    </TableHead>
                     <TableHead className="text-right">
                       <Trans ns="views/settings">users.table.actions</Trans>
                     </TableHead>