src/pages/Login.tsx

@@ -1,6 +1,7 @@
 import { useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
 import { requestOtp } from "../services/authApi";
+import { toPersianDigits } from "../utils/formatNumber";
 import { toE164 } from "../utils/phone";
 
 function CheckIcon() {
@@ -55,10 +56,11 @@ export default function Login() {
 
       <input
         type="text"
+        dir="ltr"
         inputMode="numeric"
         value={phone}
         onChange={(e) => {
-          setPhone(e.target.value);
+          setPhone(toPersianDigits(e.target.value));
           setError("");
         }}
         placeholder="مثال: ۰۹۱۲۳۴۵۶۷۸۹"

src/pages/LoginOtp.tsx

@@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react'
 import { useLocation, useNavigate } from 'react-router-dom'
 import { requestOtp, verifyOtp } from '../services/authApi'
 import { storeAuthTokens } from '../utils/authToken'
-import { toEnglishDigits } from '../utils/formatNumber'
+import { toEnglishDigits, toPersianDigits } from '../utils/formatNumber'
 import { toE164 } from '../utils/phone'
 import { getUserRole } from '../utils/role'
 
@@ -22,11 +22,6 @@ function EditIcon({ className = '' }: { className?: string }) {
   )
 }
 
-function toPersianDigits(value: string) {
-  const persianDigits = '۰۱۲۳۴۵۶۷۸۹'
-  return value.replace(/[0-9]/g, (digit) => persianDigits[Number(digit)])
-}
-
 function formatCountdown(seconds: number) {
   const mm = String(Math.floor(seconds / 60)).padStart(2, '0')
   const ss = String(seconds % 60).padStart(2, '0')

src/utils/formatNumber.ts

@@ -6,3 +6,8 @@ export function toEnglishDigits(value: string): string {
   const persianDigits = '۰۱۲۳۴۵۶۷۸۹'
   return value.replace(/[۰-۹]/g, (digit) => String(persianDigits.indexOf(digit)))
 }
+
+export function toPersianDigits(value: string): string {
+  const persianDigits = '۰۱۲۳۴۵۶۷۸۹'
+  return value.replace(/[0-9]/g, (digit) => persianDigits[Number(digit)])
+}