Fixed bug that did not allow phone numbers to be correctly validated

CHANGELOG.md

@@ -1,6 +1,7 @@
 # 0.6.2-alpha
 
 - Fixed bug that didnt allow scroll position to be at top of screen after navigating to a different location.
+- Fixed bug that did not allow phone number to be correctly validated
 
 # 0.6.1-alpha
 

src/components/Contact/ContactForm/ValidatedContactForm/ValidatedContactForm.js

@@ -5,10 +5,21 @@ import { useSelector } from 'react-redux'
 import * as Yup from 'yup'
 import { ContactForm } from '../ContactForm'
 
+Yup.addMethod(Yup.string, 'phone', function () {
+  return this.test({
+    name: 'phone',
+    message: 'phone must be a valid phone number',
+    test: (phone = '') => {
+      const phoneNumberRegex = /^(\+?\d{0,4})?\s?-?\s?(\(?\d{3}\)?)\s?-?\s?(\(?\d{3}\)?)\s?-?\s?(\(?\d{4}\)?)?$/
+      return phone === '' || phoneNumberRegex.test(phone)
+    }
+  })
+})
+
 const contactSchema = Yup.object().shape({
   name: Yup.string().required(),
   email: Yup.string().email().required(),
-  phone: Yup.string(),
+  phone: Yup.string().phone(),
   reason: Yup.string().required(),
   message: Yup.string().min(100).max(2000).required()
 })