fix: farsi digits and autofoucs in digits input
This commit is contained in:
@@ -8,6 +8,7 @@ import React, {
|
|||||||
} from 'react';
|
} from 'react';
|
||||||
import { TextField, Stack } from '@mui/material';
|
import { TextField, Stack } from '@mui/material';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
import { replacePersianWithRealNumbers } from '@/utils/replacePersianWithRealNumbers';
|
||||||
|
|
||||||
interface DigitInputProps {
|
interface DigitInputProps {
|
||||||
error: boolean;
|
error: boolean;
|
||||||
@@ -34,6 +35,8 @@ const DigitInput: React.FC<DigitInputProps> = ({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleChange = (value: string, index: number) => {
|
const handleChange = (value: string, index: number) => {
|
||||||
|
value = replacePersianWithRealNumbers(value);
|
||||||
|
|
||||||
if (!/^\d$/.test(value) && value !== '') return;
|
if (!/^\d$/.test(value) && value !== '') return;
|
||||||
|
|
||||||
const newCode = [...code];
|
const newCode = [...code];
|
||||||
@@ -91,6 +94,7 @@ const DigitInput: React.FC<DigitInputProps> = ({
|
|||||||
color={success ? 'success' : 'primary'}
|
color={success ? 'success' : 'primary'}
|
||||||
key={index}
|
key={index}
|
||||||
inputRef={(el) => (inputRefs.current[index] = el)}
|
inputRef={(el) => (inputRefs.current[index] = el)}
|
||||||
|
autoFocus={index === 0}
|
||||||
value={digit}
|
value={digit}
|
||||||
onChange={(e) => handleChange(e.target.value, index)}
|
onChange={(e) => handleChange(e.target.value, index)}
|
||||||
onKeyDown={(e) => e.key === 'Backspace' && handleBackspace(e, index)}
|
onKeyDown={(e) => e.key === 'Backspace' && handleBackspace(e, index)}
|
||||||
|
|||||||
@@ -67,9 +67,6 @@ export function LoginRegisterForm({
|
|||||||
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
let newValue = event.target.value;
|
let newValue = event.target.value;
|
||||||
newValue = replacePersianWithRealNumbers(newValue);
|
newValue = replacePersianWithRealNumbers(newValue);
|
||||||
if (newValue.startsWith('09')) {
|
|
||||||
newValue = newValue.substring(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
setLoginRegisterValue(newValue);
|
setLoginRegisterValue(newValue);
|
||||||
|
|
||||||
@@ -112,10 +109,20 @@ export function LoginRegisterForm({
|
|||||||
|
|
||||||
const handleSubmit = async () => {
|
const handleSubmit = async () => {
|
||||||
if (validateInput(loginRegisterValue, authType, false)) {
|
if (validateInput(loginRegisterValue, authType, false)) {
|
||||||
|
let newValue = loginRegisterValue;
|
||||||
|
|
||||||
|
if (
|
||||||
|
authType === 'phone' &&
|
||||||
|
countryCode === '+98' &&
|
||||||
|
newValue.startsWith('09')
|
||||||
|
) {
|
||||||
|
newValue = newValue.substring(1);
|
||||||
|
setLoginRegisterValue(newValue);
|
||||||
|
}
|
||||||
|
|
||||||
const res = await execUserStatus({
|
const res = await execUserStatus({
|
||||||
phoneNumber:
|
phoneNumber: authType === 'phone' ? countryCode + newValue : undefined,
|
||||||
authType === 'phone' ? countryCode + loginRegisterValue : undefined,
|
email: authType === 'email' ? newValue : undefined,
|
||||||
email: authType === 'email' ? loginRegisterValue : undefined,
|
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!res) {
|
if (!res) {
|
||||||
@@ -123,7 +130,7 @@ export function LoginRegisterForm({
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
onLoginRegisterSubmit(loginRegisterValue, res.userStatus);
|
onLoginRegisterSubmit(newValue, res.userStatus);
|
||||||
} else {
|
} else {
|
||||||
toast({ message: res.message, severity: 'error' });
|
toast({ message: res.message, severity: 'error' });
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user