upd: position

Deskripsi:
- update load list data position
- update filter page
- update select form
- tambah data position

No Issues

app/(application)/position/index.tsx

@@ -8,15 +8,49 @@ import InputSearch from "@/components/inputSearch";
 import MenuItemRow from "@/components/menuItemRow";
 import { ColorsStatus } from "@/constants/ColorsStatus";
 import Styles from "@/constants/Styles";
+import { apiGetPosition } from "@/lib/api";
+import { useAuthSession } from "@/providers/AuthProvider";
 import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
 import { router, useLocalSearchParams } from "expo-router";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
+import { useDispatch, useSelector } from "react-redux";
+
+type Props = {
+   name: string;
+   idGroup: string;
+   group: string;
+   id: string;
+   isActive: boolean
+}
 
 export default function Index() {
-   const { active } = useLocalSearchParams<{ active?: string }>()
+   const { token, decryptToken } = useAuthSession()
+   const entityUser = useSelector((state: any) => state.user)
+   const { active, group } = useLocalSearchParams<{ active?: string, group?: string }>()
    const [isModal, setModal] = useState(false)
    const [isVisibleEdit, setVisibleEdit] = useState(false)
+   const [data, setData] = useState<Props[]>([])
+   const [search, setSearch] = useState('')
+   const [nameGroup, setNameGroup] = useState('')
+
+   const dispatch = useDispatch()
+   const update = useSelector((state: any) => state.positionUpdate)
+
+   async function handleLoad() {
+      try {
+         const hasil = await decryptToken(String(token?.current))
+         const response = await apiGetPosition({ user: hasil, active: String(active), search: search, group: String(group) })
+         setData(response.data)
+         setNameGroup(response.filter.name)
+      } catch (error) {
+         console.error(error)
+      }
+   }
+
+   useEffect(() => {
+      handleLoad()
+   }, [active, search, group, update])
 
    function handleEdit() {
       setVisibleEdit(false)
@@ -44,77 +78,35 @@ export default function Index() {
                      icon={<AntDesign name="closecircleo" color={active == "false" ? 'white' : 'black'} size={20} />}
                      n={2} />
                </View>
-               <InputSearch />
-               <View style={[Styles.mv05]}>
-                  <Text>Filter : Dinas</Text>
-               </View>
+               <InputSearch onChange={setSearch} />
+               {
+                  (entityUser.role == "supadmin" || entityUser.role == "developer") &&
+                  <View style={[Styles.mv05]}>
+                     <Text>Filter : {nameGroup}</Text>
+                  </View>
+               }
                <View>
-                  <BorderBottomItem
-                     onPress={() => { setModal(true) }}
-                     borderType="all"
-                     icon={
-                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
-                           <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
-                        </View>
-                     }
-                     title="Anggota"
-                     subtitle="Dinas"
-                  />
-                  <BorderBottomItem
-                     onPress={() => { setModal(true) }}
-                     borderType="all"
-                     icon={
-                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
-                           <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
-                        </View>
-                     }
-                     title="Bendahara"
-                     subtitle="Dinas"
-                  />
-                  <BorderBottomItem
-                     onPress={() => { setModal(true) }}
-                     borderType="all"
-                     icon={
-                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
-                           <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
-                        </View>
-                     }
-                     title="Ketua"
-                     subtitle="Dinas"
-                  />
-                  <BorderBottomItem
-                     onPress={() => { setModal(true) }}
-                     borderType="all"
-                     icon={
-                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
-                           <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
-                        </View>
-                     }
-                     title="Sekretaris"
-                     subtitle="Dinas"
-                  />
-                  <BorderBottomItem
-                     onPress={() => { setModal(true) }}
-                     borderType="all"
-                     icon={
-                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
-                           <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
-                        </View>
-                     }
-                     title="Kepala TU"
-                     subtitle="Dinas"
-                  />
-                  <BorderBottomItem
-                     onPress={() => { setModal(true) }}
-                     borderType="all"
-                     icon={
-                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
-                           <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
-                        </View>
-                     }
-                     title="Wakil Kepala TU"
-                     subtitle="Dinas"
-                  />
+                  {
+                     data.length > 0 ?
+                        data.map((item, index) => {
+                           return (
+                              <BorderBottomItem
+                                 key={index}
+                                 onPress={() => { setModal(true) }}
+                                 borderType="all"
+                                 icon={
+                                    <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
+                                       <MaterialCommunityIcons name="account-tie" size={25} color={'#384288'} />
+                                    </View>
+                                 }
+                                 title={item.name}
+                                 subtitle={item.group}
+                              />
+                           )
+                        })
+                        :
+                        <Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada data</Text>
+                  }
                </View>
             </View>
          </ScrollView>