feat: implement MobileInput component for standardized mobile number input and update related forms to use it

assets/admin/pages/MySecretariesPage.tsx

@@ -21,7 +21,8 @@ import { ActiveBadge } from "../components/ui/StatusBadge";
 import { useSubscription } from "../hooks/useSubscription";
 import type { ApiResponse } from "../lib/api";
 import { api } from "../lib/api";
-import { formatDate, maskMobile } from "../lib/utils";
+import { formatDate, maskMobile, iranMobileSchema } from "../lib/utils";
+import MobileInput from "../components/ui/MobileInput";
 import { useAuthStore } from "../stores/authStore";
 import type { Secretary, SecretaryPermissions } from "../types";
 
@@ -244,7 +245,7 @@ function PermissionsMatrix({
 
 const createSchema = z.object({
     name: z.string().min(2, "نام الزامی است"),
-    mobile_number: z.string().regex(/^09[0-9]{9}$/, "شماره موبایل معتبر نیست"),
+    mobile_number: iranMobileSchema,
 });
 type CreateForm = z.infer<typeof createSchema>;
 
@@ -694,28 +695,10 @@ export default function MySecretariesPage() {
                     </div>
                     <div className="field" style={{ marginTop: 16 }}>
                         <label>شماره موبایل *</label>
-                        <input
+                        <MobileInput
                             {...createForm.register("mobile_number")}
-                            placeholder="09123456789"
-                            dir="ltr"
-                            inputMode="numeric"
-                            maxLength={11}
                             autoComplete="off"
-                            onChange={(e) => {
-                                const digits = e.target.value.replace(
-                                    /\D/g,
-                                    "",
-                                );
-                                createForm.setValue("mobile_number", digits, {
-                                    shouldValidate:
-                                        createForm.formState.isSubmitted,
-                                });
-                            }}
-                            style={
-                                createForm.formState.errors.mobile_number
-                                    ? { borderColor: "var(--danger)" }
-                                    : undefined
-                            }
+                            hasError={!!createForm.formState.errors.mobile_number}
                         />
                         {createForm.formState.errors.mobile_number && (
                             <span className="field-error">