[refactor] moving stuff around.

calblueprint · Apr 24, 2024 · 9388b68 · 9388b68
1 parent c77299e
commit 9388b68
Show file tree

Hide file tree

Showing 10 changed files with 55 additions and 37 deletions.
diff --git a/src/app/(Authentication)/styles.ts → ...ts/InputScreenStyles/InputScreenStyles.ts b/src/app/(Authentication)/styles.ts → ...ts/InputScreenStyles/InputScreenStyles.ts
@@ -28,6 +28,12 @@ export const ErrorMessageContainer = styled.View({
   paddingTop: 10,
 });
 
+export const GroupButtonContent = styled.View({
+  flexDirection: 'row',
+  alignItems: 'center',
+  columnGap: 15,
+});
+
 export const TitleText = styled.Text({
   color: colors.black,
   fontSize: 24,

diff --git a/src/app/(Authentication)/Login/Email/index.tsx b/src/app/(Authentication)/Login/Email/index.tsx
@@ -19,7 +19,7 @@ import {
   InstructionContainer,
   InstructionText,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function LoginScreen() {
   const [email, setEmail] = useState<string>('');

diff --git a/src/app/(Authentication)/Login/Password/index.tsx b/src/app/(Authentication)/Login/Password/index.tsx
@@ -19,7 +19,7 @@ import {
   InstructionContainer,
   InstructionText,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function LoginScreen() {
   const { email } = useLocalSearchParams() as unknown as { email: string };

diff --git a/src/app/(Authentication)/OTPFlow/OTPEmailInput/index.tsx b/src/app/(Authentication)/OTPFlow/OTPEmailInput/index.tsx
@@ -18,7 +18,7 @@ import {
   InputBoxContainer,
   InstructionContainer,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function OTPEmailInput() {
   const [email, setEmail] = useState<string>('');

diff --git a/src/app/(Authentication)/OTPFlow/OTPNewPassword/index.tsx b/src/app/(Authentication)/OTPFlow/OTPNewPassword/index.tsx
@@ -17,7 +17,7 @@ import {
   InputBoxContainer,
   InstructionContainer,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function OTPNewPassword() {
   const [password, setPassword] = useState<string>('');

diff --git a/src/app/(Authentication)/OTPFlow/OTPVerify/index.tsx b/src/app/(Authentication)/OTPFlow/OTPVerify/index.tsx
@@ -21,7 +21,7 @@ import {
   InstructionContainer,
   InstructionText,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function OTPFlow() {
   const { changePassword } = useLocalSearchParams() as unknown as {

diff --git a/src/app/(Authentication)/SignUp/Address/index.tsx b/src/app/(Authentication)/SignUp/Address/index.tsx
@@ -16,7 +16,7 @@ import {
   InputBoxContainer,
   InstructionContainer,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function SignUpScreen() {
   const { name } = useLocalSearchParams() as unknown as { name: string };

diff --git a/src/app/(Authentication)/SignUp/Email/index.tsx b/src/app/(Authentication)/SignUp/Email/index.tsx
@@ -18,7 +18,7 @@ import {
   InputBoxContainer,
   InstructionContainer,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function SignUpScreen() {
   const [name, setName] = useState<string>('');

diff --git a/src/app/(Authentication)/SignUp/Password/index.tsx b/src/app/(Authentication)/SignUp/Password/index.tsx
@@ -17,7 +17,7 @@ import {
   InputBoxContainer,
   InstructionContainer,
   TitleText,
-} from '../../styles';
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 
 export default function SignUpScreen() {
   const { name } = useLocalSearchParams() as unknown as { name: string };

diff --git a/src/app/(BottomTabNavigation)/Profile/EditName/index.tsx b/src/app/(BottomTabNavigation)/Profile/EditName/index.tsx
@@ -5,30 +5,50 @@ import { Text, View, TouchableOpacity } from 'react-native';
 import styles from './styles';
 import BackButton from '../../../../../assets/back-button.svg';
 import Submit from '../../../../../assets/submit.svg';
-import { ButtonBlack } from '../../../../Components/AuthButton/AuthButton';
+import {
+  ButtonBlack,
+  ButtonTextWhite,
+} from '../../../../Components/AuthButton/AuthButton';
 import AuthInput from '../../../../Components/AuthInput/AuthInput';
+import {
+  ErrorMessageContainer,
+  GroupButtonContent,
+  InputBoxContainer,
+  InstructionContainer,
+  TitleText,
+} from '../../../../Components/InputScreenStyles/InputScreenStyles';
 import { useSession } from '../../../../context/AuthContext';
+import { ContentContainer, SafeArea } from '../../../../styles/global';
 
 function EditNameScreen() {
   const { updateUser, session } = useSession();
   const [fullName, setFullName] = useState<string>('');
 
+  function updateName() {
+    updateUser({
+      data: {
+        fullName,
+      },
+    });
+    router.back();
+  }
+
   useEffect(() => {
     setFullName(session?.user?.user_metadata.fullName);
   }, []);
 
   return (
-    <View style={styles.container}>
-      <View style={styles.contentContainer}>
-        <TouchableOpacity
-          style={styles.backButton}
-          onPress={() => router.push('/Profile/')}
-        >
+    <SafeArea>
+      <ContentContainer>
+        <TouchableOpacity onPress={() => router.back()}>
           <BackButton />
         </TouchableOpacity>
-        <Text style={styles.instructionText}>Edit account details</Text>
 
-        <View style={styles.inputBox}>
+        <InstructionContainer>
+          <TitleText>Edit account details</TitleText>
+        </InstructionContainer>
+
+        <InputBoxContainer>
           <AuthInput
             input={fullName}
             onChangeInput={setFullName}
@@ -38,30 +58,22 @@ function EditNameScreen() {
             keyboard="default"
             autoCapitalization
           />
-        </View>
+        </InputBoxContainer>
+
+        <ErrorMessageContainer />
+
         <ButtonBlack
-          style={styles.submitButton}
           disabled={!fullName || fullName.trim() === ''}
-          onPress={() => {
-            if (fullName) {
-              updateUser({
-                data: {
-                  fullName,
-                },
-              });
-              router.push('/Profile/');
-            } else {
-              //ask josh about what should appear in invalid name event
-            }
-          }}
+          onPress={updateName}
+          style={{ justifyContent: 'center' }}
         >
-          <Text style={styles.submitText}>
-            Submit
-            <Submit style={styles.submitIcon} />
-          </Text>
+          <GroupButtonContent>
+            <ButtonTextWhite>Submit</ButtonTextWhite>
+            <Submit />
+          </GroupButtonContent>
         </ButtonBlack>
-      </View>
-    </View>
+      </ContentContainer>
+    </SafeArea>
   );
 }
 export default EditNameScreen;