Fix pages that use PhoneInput
This commit is contained in:
parent
7f7edf9162
commit
11a0329924
3 changed files with 4 additions and 7 deletions
|
@ -27,7 +27,7 @@ const CountryCodeDropdown: React.FC<ICountryCodeDropdown> = ({ countryCode, onCh
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DropdownMenu items={menu}>
|
<DropdownMenu items={menu}>
|
||||||
<button className='px-4 items-center'>
|
<button type='button' className='px-4 items-center'>
|
||||||
<HStack space={1} alignItems='center'>
|
<HStack space={1} alignItems='center'>
|
||||||
<div>+{countryCode}</div>
|
<div>+{countryCode}</div>
|
||||||
<Icon className='w-4 h-4 stroke-primary-600' src={require('@tabler/icons/chevron-down.svg')} />
|
<Icon className='w-4 h-4 stroke-primary-600' src={require('@tabler/icons/chevron-down.svg')} />
|
||||||
|
|
|
@ -7,7 +7,6 @@ import { closeModal } from 'soapbox/actions/modals';
|
||||||
import snackbar from 'soapbox/actions/snackbar';
|
import snackbar from 'soapbox/actions/snackbar';
|
||||||
import { reConfirmPhoneVerification, reRequestPhoneVerification } from 'soapbox/actions/verification';
|
import { reConfirmPhoneVerification, reRequestPhoneVerification } from 'soapbox/actions/verification';
|
||||||
import { FormGroup, PhoneInput, Modal, Stack, Text } from 'soapbox/components/ui';
|
import { FormGroup, PhoneInput, Modal, Stack, Text } from 'soapbox/components/ui';
|
||||||
import { validPhoneNumberRegex } from 'soapbox/features/verification/steps/sms-verification';
|
|
||||||
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
|
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
|
||||||
import { getAccessToken } from 'soapbox/utils/auth';
|
import { getAccessToken } from 'soapbox/utils/auth';
|
||||||
|
|
||||||
|
@ -35,7 +34,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
|
||||||
const [verificationCode, setVerificationCode] = useState('');
|
const [verificationCode, setVerificationCode] = useState('');
|
||||||
const [requestedAnother, setAlreadyRequestedAnother] = useState(false);
|
const [requestedAnother, setAlreadyRequestedAnother] = useState(false);
|
||||||
|
|
||||||
const isValid = phone ? validPhoneNumberRegex.test(phone) : false;
|
const isValid = !!phone;
|
||||||
|
|
||||||
const onChange = useCallback((phone?: string) => {
|
const onChange = useCallback((phone?: string) => {
|
||||||
setPhone(phone);
|
setPhone(phone);
|
||||||
|
|
|
@ -14,8 +14,6 @@ const Statuses = {
|
||||||
FAIL: 'FAIL',
|
FAIL: 'FAIL',
|
||||||
};
|
};
|
||||||
|
|
||||||
const validPhoneNumberRegex = /^\+1\s\(\d{3}\)\s\d{3}-\d{4}/;
|
|
||||||
|
|
||||||
const SmsVerification = () => {
|
const SmsVerification = () => {
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
|
@ -27,7 +25,7 @@ const SmsVerification = () => {
|
||||||
const [verificationCode, setVerificationCode] = React.useState('');
|
const [verificationCode, setVerificationCode] = React.useState('');
|
||||||
const [requestedAnother, setAlreadyRequestedAnother] = React.useState(false);
|
const [requestedAnother, setAlreadyRequestedAnother] = React.useState(false);
|
||||||
|
|
||||||
const isValid = phone ? validPhoneNumberRegex.test(phone) : false;
|
const isValid = !!phone;
|
||||||
|
|
||||||
const onChange = React.useCallback((phone?: string) => {
|
const onChange = React.useCallback((phone?: string) => {
|
||||||
setPhone(phone);
|
setPhone(phone);
|
||||||
|
@ -160,4 +158,4 @@ const SmsVerification = () => {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export { SmsVerification as default, validPhoneNumberRegex };
|
export { SmsVerification as default };
|
||||||
|
|
Loading…
Reference in a new issue