upd: redesign

Deskripsi:
- fitur ganti mode tema
- penerapan tema pada semua fitur

NO Issues

components/selectForm.tsx

@@ -1,4 +1,5 @@
 import Styles from "@/constants/Styles";
+import { useTheme } from "@/providers/ThemeProvider";
 import { Feather } from "@expo/vector-icons";
 import { Pressable, View } from "react-native";
 import Text from "./Text";
@@ -15,10 +16,11 @@ type Props = {
    errorText?: string;
    required?: boolean;
    round?: boolean
-   bg?: 'white' | 'transparent'
+   bg?: string
 };
 
-export default function SelectForm({ label, value, placeholder, onPress, info, error, errorText, required, itemLeft, round, bg }: Props) {
+export default function SelectForm({ label, value, placeholder, onPress, info, error, errorText, required, round, bg }: Props) {
+   const { colors } = useTheme();
    return (
       <View style={[Styles.mb10]}>
          {
@@ -30,19 +32,27 @@ export default function SelectForm({ label, value, placeholder, onPress, info, e
             )
          }
          <Pressable onPress={onPress}>
-            <View style={[Styles.inputRoundForm, Styles.inputRoundFormRight, error && { borderColor: "red" }, round && Styles.round30, Styles.pv10, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}>
-               <Feather name="chevron-right" size={20} color="grey" />
+            <View style={[
+               Styles.inputRoundForm,
+               Styles.inputRoundFormRight,
+               error && { borderColor: "red" },
+               round && Styles.round30,
+               Styles.pv10,
+               { backgroundColor: bg ? bg : 'transparent', borderColor: colors.icon }
+            ]}>
+               <Feather name="chevron-right" size={20} color={colors.icon} />
                {
                   value ? (
-                     <Text numberOfLines={1} ellipsizeMode='tail' style={[Styles.cBlack, Styles.w90]}>{value}</Text>
+                     <Text numberOfLines={1} ellipsizeMode='tail' style={[Styles.w90]}>{value}</Text>
                   ) : (
-                     <Text numberOfLines={1} ellipsizeMode='tail' style={[Styles.cGray, Styles.w90]}>{placeholder}</Text>
+                     <Text numberOfLines={1} ellipsizeMode='tail' style={[{ color: colors.icon }, Styles.w90]}>{placeholder}</Text>
                   )
                }
             </View>
-         </Pressable>
-         {error && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cError]}>{errorText}</Text>)}
-         {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cGray]}>{info}</Text>)}
-      </View>
+         </Pressable >
+         {error && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cError]}>{errorText}</Text>)
+         }
+         {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05, { color: colors.icon }]}>{info}</Text>)}
+      </View >
    )
 }