[feat] starting toggle

package.json

@@ -35,6 +35,7 @@
     "expo-router": "^2.0.0",
     "expo-status-bar": "~1.6.0",
     "linking": "^0.1.0-beta.5",
+    "moment-timezone": "^0.5.45",
     "react": "18.2.0",
     "react-dom": "^18.2.0",
     "react-native": "^0.72.10",

src/Components/ToggleOptionsButton/ToggleOptionsButton.tsx

@@ -0,0 +1,15 @@
+import { Link } from 'expo-router';
+import React, { useState, ChangeEvent } from 'react';
+import { Text, TouchableOpacity, View } from 'react-native';
+
+import styles from './styles';
+
+function ToggleOptionsButton() {
+  return (
+    <View style={styles.toggleButtonContainer}>
+      <View style={styles.toggleItem} />
+    </View>
+  );
+}
+
+export default ToggleOptionsButton;

src/Components/ToggleOptionsButton/styles.ts

@@ -0,0 +1,29 @@
+import { StyleSheet } from 'react-native';
+
+import { colors } from '../../styles/colors';
+
+export default StyleSheet.create({
+  toggleButtonContainer: {
+    width: '100%',
+    height: 43,
+    backgroundColor: colors.midGrey,
+    borderRadius: 20,
+    justifyContent: 'center',
+    alignItems: 'flex-start',
+    padding: 2,
+  },
+  toggleItem: {
+    width: ' 50%',
+    height: 35,
+    borderRadius: 20,
+    backgroundColor: 'white',
+  },
+  arrow: {
+    marginLeft: 120,
+    marginTop: 5,
+  },
+  arrowWhite: {
+    marginLeft: 132,
+    marginTop: 5,
+  },
+});

src/app/(BottomTabNavigation)/AllCases/CaseScreen/[caseUid].tsx

@@ -9,6 +9,7 @@ import EducationalBar from '../../../../Components/EducationalBar/EducationalBar
 import EligibilityCard from '../../../../Components/EligibilityCard/EligibilityCard';
 import FormsCard from '../../../../Components/FormsCard/FormsCard';
 import StatusUpdatesBar from '../../../../Components/StatusUpdatesBar/StatusUpdatesBar';
+import ToggleOptionsButton from '../../../../Components/ToggleOptionsButton/ToggleOptionsButton';
 import { getCaseStatus, getCaseById } from '../../../../supabase/queries/cases';
 import { Case, Eligibility } from '../../../../types/types';
 
@@ -61,6 +62,7 @@ function CaseScreen() {
             caseUid={caseData.id}
             status={caseData.caseStatus}
           />
+          <ToggleOptionsButton />
 
           {status === Eligibility.ELIGIBLE && (
             <EligibilityCard caseData={caseData} status={status} />