From 11a03299244c016252056da9615c2e199b88b239 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Wed, 13 Jul 2022 19:08:19 -0500
Subject: [PATCH] Fix pages that use PhoneInput

---
 .../components/ui/phone-input/country-code-dropdown.tsx     | 2 +-
 .../features/ui/components/modals/verify-sms-modal.tsx      | 3 +--
 .../features/verification/steps/sms-verification.tsx        | 6 ++----
 3 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx b/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx
index f15302fa6..fc7b944d6 100644
--- a/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx
+++ b/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx
@@ -27,7 +27,7 @@ const CountryCodeDropdown: React.FC<ICountryCodeDropdown> = ({ countryCode, onCh
 
   return (
     <DropdownMenu items={menu}>
-      <button className='px-4 items-center'>
+      <button type='button' className='px-4 items-center'>
         <HStack space={1} alignItems='center'>
           <div>+{countryCode}</div>
           <Icon className='w-4 h-4 stroke-primary-600' src={require('@tabler/icons/chevron-down.svg')} />
diff --git a/app/soapbox/features/ui/components/modals/verify-sms-modal.tsx b/app/soapbox/features/ui/components/modals/verify-sms-modal.tsx
index 5b9d1deea..ccc9d7221 100644
--- a/app/soapbox/features/ui/components/modals/verify-sms-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/verify-sms-modal.tsx
@@ -7,7 +7,6 @@ import { closeModal } from 'soapbox/actions/modals';
 import snackbar from 'soapbox/actions/snackbar';
 import { reConfirmPhoneVerification, reRequestPhoneVerification } from 'soapbox/actions/verification';
 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 { getAccessToken } from 'soapbox/utils/auth';
 
@@ -35,7 +34,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
   const [verificationCode, setVerificationCode] = useState('');
   const [requestedAnother, setAlreadyRequestedAnother] = useState(false);
 
-  const isValid = phone ? validPhoneNumberRegex.test(phone) : false;
+  const isValid = !!phone;
 
   const onChange = useCallback((phone?: string) => {
     setPhone(phone);
diff --git a/app/soapbox/features/verification/steps/sms-verification.tsx b/app/soapbox/features/verification/steps/sms-verification.tsx
index 066d4332a..0388964c3 100644
--- a/app/soapbox/features/verification/steps/sms-verification.tsx
+++ b/app/soapbox/features/verification/steps/sms-verification.tsx
@@ -14,8 +14,6 @@ const Statuses = {
   FAIL: 'FAIL',
 };
 
-const validPhoneNumberRegex = /^\+1\s\(\d{3}\)\s\d{3}-\d{4}/;
-
 const SmsVerification = () => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
@@ -27,7 +25,7 @@ const SmsVerification = () => {
   const [verificationCode, setVerificationCode] = React.useState('');
   const [requestedAnother, setAlreadyRequestedAnother] = React.useState(false);
 
-  const isValid = phone ? validPhoneNumberRegex.test(phone) : false;
+  const isValid = !!phone;
 
   const onChange = React.useCallback((phone?: string) => {
     setPhone(phone);
@@ -160,4 +158,4 @@ const SmsVerification = () => {
   );
 };
 
-export { SmsVerification as default, validPhoneNumberRegex };
+export { SmsVerification as default };