upd: redesign

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

NO Issues

app/(application)/group/index.tsx

@@ -13,6 +13,7 @@ import Styles from "@/constants/Styles";
 import { apiDeleteGroup, apiEditGroup, apiGetGroup } from "@/lib/api";
 import { setUpdateGroup } from "@/lib/groupSlice";
 import { useAuthSession } from "@/providers/AuthProvider";
+import { useTheme } from "@/providers/ThemeProvider";
 import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
 import { useEffect, useState } from "react";
 import { RefreshControl, View, VirtualizedList } from "react-native";
@@ -27,6 +28,7 @@ type Props = {
 
 export default function Index() {
    const { token, decryptToken } = useAuthSession()
+   const { colors } = useTheme();
    const [isModal, setModal] = useState(false)
    const [isVisibleEdit, setVisibleEdit] = useState(false)
    const [data, setData] = useState<Props[]>([])
@@ -127,9 +129,9 @@ export default function Index() {
 
 
    return (
-      <View style={[Styles.p15, { flex: 1 }]}>
+      <View style={[Styles.p15, { flex: 1, backgroundColor: colors.background }]}>
          <View style={[Styles.mb10]}>
-            <View style={[Styles.wrapBtnTab]}>
+            <View style={[Styles.wrapBtnTab, { backgroundColor: colors.card }]}>
                <ButtonTab
                   active={status == "false" ? "false" : "true"}
                   value="true"
@@ -187,6 +189,7 @@ export default function Index() {
                            <RefreshControl
                               refreshing={refreshing}
                               onRefresh={handleRefresh}
+                              tintColor={colors.primary}
                            />
                         }
                      />
@@ -198,7 +201,7 @@ export default function Index() {
          <DrawerBottom animation="slide" isVisible={isModal} setVisible={() => setModal(false)} title={titleChoose}>
             <View style={Styles.rowItemsCenter}>
                <MenuItemRow
-                  icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color="black" size={25} />}
+                  icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color={colors.text} size={25} />}
                   title={activeChoose ? "Non Aktifkan" : "Aktifkan"}
                   onPress={() => {
                      setModal(false)
@@ -210,7 +213,7 @@ export default function Index() {
                   }}
                />
                <MenuItemRow
-                  icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
+                  icon={<MaterialCommunityIcons name="pencil-outline" color={colors.text} size={25} />}
                   title="Edit"
                   onPress={() => {
                      setModal(false)
@@ -232,6 +235,7 @@ export default function Index() {
                      label="Lembaga Desa"
                      value={titleChoose}
                      error={error.title}
+                     bg={colors.card}
                      errorText="Lembaga Desa tidak boleh kosong & minimal 3 karakter"
                      onChange={(val) => { validationForm(val, 'title') }} />
                </View>