fix(i18n): localize PeerMultiSelect and add route keys

- Add useTranslations to PeerMultiSelect (assigningGroups, assignGroups)
- Add accessControlGroups, autoApply keys for RouteTable

src/i18n/messages/en.ts

@@ -297,6 +297,9 @@ searchCountry: "Search country...",
     tabNetworkRoutes: "Network Routes",
     tabAccessiblePeers: "Accessible Peers",
     tabRemoteJobs: "Remote Jobs",
+    assigningGroups: "Assigning groups...",
+    groupsSuccessfullyAssigned: "Groups successfully assigned",
+    assignGroups: "Assign Groups",
     peerSaved: "Peer was successfully saved",
     peerSaving: "Saving the peer...",
     remoteAccess: "Remote Access",

src/i18n/messages/zh.ts

@@ -298,6 +298,9 @@ export default {
     tabNetworkRoutes: "网络路由",
     tabAccessiblePeers: "可访问节点",
     tabRemoteJobs: "远程任务",
+    assigningGroups: "正在分配组...",
+    groupsSuccessfullyAssigned: "组分配成功",
+    assignGroups: "分配组",
     peerSaved: "节点已成功保存",
     peerSaving: "正在保存节点...",
     remoteAccess: "远程访问",

src/modules/peers/PeerMultiSelect.tsx

@@ -1,3 +1,4 @@
+import { useTranslations } from "next-intl";
 import Button from "@components/Button";
 import FancyToggleSwitch from "@components/FancyToggleSwitch";
 import FullTooltip from "@components/FullTooltip";
@@ -42,6 +43,7 @@ type Props = {
   onCanceled?: () => void;
 };
 export const PeerMultiSelect = ({ selectedPeers = {}, onCanceled }: Props) => {
+  const t = useTranslations("peers");
   return (
     <AnimatePresence>
       {Object.keys(selectedPeers).length > 0 && (
@@ -377,13 +379,13 @@ const PeerGroupMassAssignmentContent = ({
                       {isLoading && (
                         <>
                           <Loader2 size={14} className={"animate-spin"} />
-                          <span>Assigning groups...</span>
+                          <span>{t("assigningGroups")}</span>
                         </>
                       )}
                       {!isLoading && isSuccess && (
                         <>
                           <CheckCircle size={14} className={"text-green-400"} />
-                          <span>Groups successfully assigned</span>
+                          <span>{t("groupsSuccessfullyAssigned")}</span>
                         </>
                       )}
                     </motion.span>
@@ -391,7 +393,7 @@ const PeerGroupMassAssignmentContent = ({
                 )}
               </AnimatePresence>
               <div>
-                <Label>Assign Groups</Label>
+                <Label>{t("assignGroups")}</Label>
                 <HelpText>
                   Assign the following groups to the selected peers. Previously
                   assigned groups will be kept unless you choose to overwrite
@@ -458,7 +460,7 @@ const PeerGroupMassAssignmentContent = ({
                     <>
                       <FullTooltip
                         content={
-                          <span className={"text-xs"}>Assign Groups</span>
+                          <span className={"text-xs"}>{t("assignGroups")}</span>
                         }
                       >
                         <Button