From a98645c2215a2986a8f5289c15310531e32522b6 Mon Sep 17 00:00:00 2001
From: Martina <martinalong10@gmail.com>
Date: Wed, 23 Jun 2021 15:23:54 -0700
Subject: [PATCH] edits to working and word breaks in confirmation modal

---
 components/core/Auth/Signup.js        | 23 ++++++++++++-----------
 components/core/Auth/TwitterSignup.js | 23 ++++++++++++-----------
 components/core/ConfirmationModal.js  |  3 ++-
 3 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/components/core/Auth/Signup.js b/components/core/Auth/Signup.js
index f3178a75..078af6f7 100644
--- a/components/core/Auth/Signup.js
+++ b/components/core/Auth/Signup.js
@@ -24,7 +24,7 @@ const useSignup = () => {
 };
 
 const useCheckUser = () => {
-  const MESSAGE = "The username is taken.";
+  const MESSAGE = "That username is taken";
 
   const usernamesAllowed = React.useRef([]);
   const usernamesTaken = React.useRef([]);
@@ -48,7 +48,7 @@ const useCheckUser = () => {
       username,
     });
     if (response.data) {
-      errors.username = "The username is taken.";
+      errors.username = "That username is taken";
       usernamesTaken.current.push(username);
       return;
     }
@@ -56,16 +56,17 @@ const useCheckUser = () => {
   };
 };
 
-const createValidations =
-  (validateUsername) =>
-  async ({ username, password, acceptTerms }, errors) => {
-    await validateUsername({ username }, errors);
+const createValidations = (validateUsername) => async (
+  { username, password, acceptTerms },
+  errors
+) => {
+  await validateUsername({ username }, errors);
 
-    if (!Validations.password(password)) errors.password = "Incorrect password";
+  if (!Validations.password(password)) errors.password = "Incorrect password";
 
-    if (!acceptTerms) errors.acceptTerms = "Must accept terms and conditions";
-    return errors;
-  };
+  if (!acceptTerms) errors.acceptTerms = "Must accept terms and conditions";
+  return errors;
+};
 
 export default function Signup({ verifyEmail, createUser, resendEmailVerification }) {
   const [passwordValidations, setPasswordValidations] = React.useState(
@@ -103,7 +104,7 @@ export default function Signup({ verifyEmail, createUser, resendEmailVerificatio
             placeholder="Username"
             name="username"
             type="text"
-            success="The username is available."
+            success="That username is available"
             icon={
               isValidating
                 ? () => (
diff --git a/components/core/Auth/TwitterSignup.js b/components/core/Auth/TwitterSignup.js
index abc39854..ebcd8779 100644
--- a/components/core/Auth/TwitterSignup.js
+++ b/components/core/Auth/TwitterSignup.js
@@ -32,7 +32,7 @@ const useTwitterSignup = () => {
 };
 
 const useCheckUser = () => {
-  const MESSAGE = "The username is taken.";
+  const MESSAGE = "That username is taken";
 
   const usernamesAllowed = React.useRef([]);
   const usernamesTaken = React.useRef([]);
@@ -56,7 +56,7 @@ const useCheckUser = () => {
       username,
     });
     if (response.data) {
-      errors.username = "The username is taken.";
+      errors.username = "That username is taken";
       usernamesTaken.current.push(username);
       return;
     }
@@ -64,17 +64,18 @@ const useCheckUser = () => {
   };
 };
 
-const createValidations =
-  (validateUsername) =>
-  async ({ username, email, acceptTerms }, errors) => {
-    await validateUsername({ username }, errors);
+const createValidations = (validateUsername) => async (
+  { username, email, acceptTerms },
+  errors
+) => {
+  await validateUsername({ username }, errors);
 
-    if (!Validations.email(email)) errors.email = "Invalid email";
+  if (!Validations.email(email)) errors.email = "Invalid email";
 
-    if (!acceptTerms) errors.acceptTerms = "Must accept terms and conditions";
+  if (!acceptTerms) errors.acceptTerms = "Must accept terms and conditions";
 
-    return errors;
-  };
+  return errors;
+};
 
 const MotionLayout = ({ children, ...props }) => (
   <motion.div layout {...props}>
@@ -131,7 +132,7 @@ export default function TwitterSignup({
           placeholder="Username"
           name="username"
           type="text"
-          success="The username is available."
+          success="That username is available"
           icon={
             isValidating
               ? () => (
diff --git a/components/core/ConfirmationModal.js b/components/core/ConfirmationModal.js
index fba8bf9b..1e0eb8e1 100644
--- a/components/core/ConfirmationModal.js
+++ b/components/core/ConfirmationModal.js
@@ -39,7 +39,8 @@ const STYLES_HEADER = css`
   color: ${Constants.system.black};
   font-size: ${Constants.typescale.lvl1};
   font-family: ${Constants.font.semiBold};
-  word-break: break-all;
+  word-break: break-word;
+  white-space: pre-line;
 `;
 
 const STYLES_SUB_HEADER = css`