feat(i18n): add batch group switch text to English, Nepali, and Chinese locales

- Updated the English, Nepali, and Chinese locale files to include a new translation for "Toggle batch switch for {{group}}".
- Enhanced internationalization support for the admin interface by adding relevant strings for improved user experience.

src/modules/settings/currency-settings-panel.tsx

@@ -12,10 +12,9 @@ import {
   putAdminCurrency,
 } from "@/api/admin-currencies";
 import { AdminPageCard } from "@/components/admin/admin-page-card";
-import { AdminStatusBadge } from "@/components/admin/admin-status-badge";
 import { Button } from "@/components/ui/button";
 import { AdminTableExportButton } from "@/components/admin/admin-table-export-button";
-import { Checkbox } from "@/components/ui/checkbox";
+import { Switch } from "@/components/ui/switch";
 import {
   Dialog,
   DialogContent,
@@ -251,20 +250,22 @@ export function CurrencySettingsPanel() {
                     <TableCell>{row.name}</TableCell>
                     <TableCell>{row.decimal_places}</TableCell>
                     <TableCell>
-                      <AdminStatusBadge status={row.is_enabled ? "enabled" : "disabled"}>
-                        {row.is_enabled
-                          ? t("system.states.enabled", { ns: "config" })
-                          : t("system.states.disabled", { ns: "config" })}
-                      </AdminStatusBadge>
+                      <div className="flex justify-center">
+                        <Switch
+                          checked={row.is_enabled}
+                          disabled
+                          aria-label={t("currencies.form.enabled", { ns: "config", code: row.code })}
+                        />
+                      </div>
                     </TableCell>
                     <TableCell>
-                      <AdminStatusBadge
-                        status={row.is_enabled && row.is_bettable ? "enabled" : "disabled"}
-                      >
-                        {row.is_enabled && row.is_bettable
-                          ? t("system.states.enabled", { ns: "config" })
-                          : t("system.states.disabled", { ns: "config" })}
-                      </AdminStatusBadge>
+                      <div className="flex justify-center">
+                        <Switch
+                          checked={row.is_enabled && row.is_bettable}
+                          disabled
+                          aria-label={t("currencies.form.bettable", { ns: "config", code: row.code })}
+                        />
+                      </div>
                     </TableCell>
                     <TableCell className="text-center">
                       <div className="flex items-center justify-center gap-2">
@@ -337,10 +338,11 @@ export function CurrencySettingsPanel() {
                 <p className="text-sm font-medium">{t("currencies.form.enabled", { ns: "config" })}</p>
                 <p className="text-xs text-muted-foreground">{t("currencies.form.enabledHint", { ns: "config" })}</p>
               </div>
-              <Checkbox
+              <Switch
                 checked={form.is_enabled}
-                onCheckedChange={(checked) => updateForm("is_enabled", checked === true)}
+                onCheckedChange={(checked) => updateForm("is_enabled", checked)}
                 disabled={saving}
+                aria-label={t("currencies.form.enabled", { ns: "config" })}
               />
             </div>
 
@@ -349,10 +351,11 @@ export function CurrencySettingsPanel() {
                 <p className="text-sm font-medium">{t("currencies.form.bettable", { ns: "config" })}</p>
                 <p className="text-xs text-muted-foreground">{t("currencies.form.bettableHint", { ns: "config" })}</p>
               </div>
-              <Checkbox
+              <Switch
                 checked={form.is_enabled && form.is_bettable}
-                onCheckedChange={(checked) => updateForm("is_bettable", checked === true)}
+                onCheckedChange={(checked) => updateForm("is_bettable", checked)}
                 disabled={saving || !form.is_enabled}
+                aria-label={t("currencies.form.bettable", { ns: "config" })}
               />
             </div>
 

src/modules/settings/system-settings-screen.tsx

@@ -15,6 +15,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+import { Switch } from "@/components/ui/switch";
 import { Textarea } from "@/components/ui/textarea";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { LotteryApiBizError } from "@/types/api/errors";
@@ -49,45 +50,6 @@ interface RuntimeDraft {
   playRulesHtmlNe: string;
 }
 
-function BinaryChoice({
-  active,
-  disabled,
-  onChange,
-  leftLabel,
-  rightLabel,
-}: {
-  active: boolean;
-  disabled: boolean;
-  onChange: (value: boolean) => void;
-  leftLabel: string;
-  rightLabel: string;
-}) {
-  return (
-    <div className="inline-flex rounded-full border border-border/60 bg-background p-1">
-      <Button
-        type="button"
-        size="sm"
-        variant={!active ? "default" : "ghost"}
-        className={!active ? "h-8 rounded-full px-3" : "h-8 rounded-full px-3 text-muted-foreground"}
-        disabled={disabled}
-        onClick={() => onChange(false)}
-      >
-        {leftLabel}
-      </Button>
-      <Button
-        type="button"
-        size="sm"
-        variant={active ? "default" : "ghost"}
-        className={active ? "h-8 rounded-full px-3" : "h-8 rounded-full px-3 text-muted-foreground"}
-        disabled={disabled}
-        onClick={() => onChange(true)}
-      >
-        {rightLabel}
-      </Button>
-    </div>
-  );
-}
-
 function SaveActions({
   dirty,
   loading,
@@ -234,12 +196,11 @@ export function SystemSettingsScreen() {
         <div className="space-y-5">
           <div className="flex flex-wrap items-center justify-between gap-3">
             <Label className="text-sm font-medium">{t("system.fields.manualReview", { ns: "config" })}</Label>
-            <BinaryChoice
-              active={draft.requireManualReview}
+            <Switch
+              checked={draft.requireManualReview}
               disabled={loading || saving}
-              onChange={(value) => updateDraft("requireManualReview", value)}
-              leftLabel={t("system.states.disabled", { ns: "config" })}
-              rightLabel={t("system.states.enabled", { ns: "config" })}
+              aria-label={t("system.fields.manualReview", { ns: "config" })}
+              onCheckedChange={(value) => updateDraft("requireManualReview", value)}
             />
           </div>
 
@@ -247,12 +208,11 @@ export function SystemSettingsScreen() {
 
           <div className="flex flex-wrap items-center justify-between gap-3">
             <Label className="text-sm font-medium">{t("system.fields.autoSettlement", { ns: "config" })}</Label>
-            <BinaryChoice
-              active={draft.autoSettlement}
+            <Switch
+              checked={draft.autoSettlement}
               disabled={loading || saving}
-              onChange={(value) => updateDraft("autoSettlement", value)}
-              leftLabel={t("system.states.disabled", { ns: "config" })}
-              rightLabel={t("system.states.enabled", { ns: "config" })}
+              aria-label={t("system.fields.autoSettlement", { ns: "config" })}
+              onCheckedChange={(value) => updateDraft("autoSettlement", value)}
             />
           </div>
 
@@ -260,12 +220,11 @@ export function SystemSettingsScreen() {
 
           <div className="flex flex-wrap items-center justify-between gap-3">
             <Label className="text-sm font-medium">{t("system.fields.autoApprove", { ns: "config" })}</Label>
-            <BinaryChoice
-              active={draft.autoApprove}
+            <Switch
+              checked={draft.autoApprove}
               disabled={loading || saving}
-              onChange={(value) => updateDraft("autoApprove", value)}
-              leftLabel={t("system.states.disabled", { ns: "config" })}
-              rightLabel={t("system.states.enabled", { ns: "config" })}
+              aria-label={t("system.fields.autoApprove", { ns: "config" })}
+              onCheckedChange={(value) => updateDraft("autoApprove", value)}
             />
           </div>
 
@@ -273,12 +232,11 @@ export function SystemSettingsScreen() {
 
           <div className="flex flex-wrap items-center justify-between gap-3">
             <Label className="text-sm font-medium">{t("system.fields.autoPayout", { ns: "config" })}</Label>
-            <BinaryChoice
-              active={draft.autoPayout}
+            <Switch
+              checked={draft.autoPayout}
               disabled={loading || saving}
-              onChange={(value) => updateDraft("autoPayout", value)}
-              leftLabel={t("system.states.disabled", { ns: "config" })}
-              rightLabel={t("system.states.enabled", { ns: "config" })}
+              aria-label={t("system.fields.autoPayout", { ns: "config" })}
+              onCheckedChange={(value) => updateDraft("autoPayout", value)}
             />
           </div>