wibu/mobile-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: list data

Browse Source 
Deskripsi:
- perbaikan list data pada jabatan dan group menggunakan virtualized

No Issues
This commit is contained in:
amaliadwiy
2025-08-11 10:43:50 +08:00
parent fce5465d4b
commit f929791075
2 changed files with 113 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
app/(application)/group/index.tsx
View File

@@ -15,7 +15,7 @@ import { setUpdateGroup } from "@/lib/groupSlice";
import { useAuthSession } from "@/providers/AuthProvider";
import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
import { useEffect, useState } from "react";
import { RefreshControl, SafeAreaView, ScrollView, View } from "react-native";
import { RefreshControl, View, VirtualizedList } from "react-native";
import Toast from "react-native-toast-message";
import { useDispatch, useSelector } from "react-redux";
@@ -116,9 +116,17 @@ export default function Index() {
}
const getItem = (_data: unknown, index: number): Props => ({
id: data[index].id,
name: data[index].name,
isActive: data[index].isActive,
});
return (
<SafeAreaView>
<View style={[Styles.p15]}>
<View style={[Styles.p15, { flex: 1 }]}>
<View>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={status == "false" ? "false" : "true"}
@@ -136,18 +144,9 @@ export default function Index() {
n={2} />
</View>
<InputSearch onChange={setSearch} />
<ScrollView
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
style={[Styles.h100]}
>
<View>
</View>
<View style={{ flex: 2 }}>
{
loading ?
arrSkeleton.map((item, index) => {
return (
@@ -156,7 +155,11 @@ export default function Index() {
})
:
data.length > 0 ?
data.map((item, index) => {
<VirtualizedList
data={data}
getItemCount={() => data.length}
getItem={getItem}
renderItem={({ item, index }: { item: Props, index: number }) => {
return (
<BorderBottomItem
key={index}
@@ -175,13 +178,20 @@ export default function Index() {
title={item.name}
/>
)
})
}}
keyExtractor={(item, index) => String(index)}
showsVerticalScrollIndicator={false}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
/>
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada data</Text>
}
</View>
</ScrollView>
</View>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={() => setModal(false)} title={titleChoose}>
<View style={Styles.rowItemsCenter}>
@@ -228,8 +238,7 @@ export default function Index() {
</View>
</View>
</DrawerBottom>
</View >
</SafeAreaView>
)
}

49
app/(application)/position/index.tsx
View File

@@ -16,7 +16,7 @@ import { useAuthSession } from "@/providers/AuthProvider";
import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
import { useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { RefreshControl, SafeAreaView, ScrollView, View } from "react-native";
import { RefreshControl, View, VirtualizedList } from "react-native";
import Toast from "react-native-toast-message";
import { useDispatch, useSelector } from "react-redux";
@@ -129,9 +129,18 @@ export default function Index() {
setRefreshing(false)
};
const getItem = (_data: unknown, index: number): Props => ({
id: data[index].id,
name: data[index].name,
idGroup: data[index].idGroup,
group: data[index].group,
isActive: data[index].isActive,
});
return (
<SafeAreaView>
<View style={[Styles.p15]}>
<View style={[Styles.p15, { flex: 1 }]}>
<View>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={status == "false" ? "false" : "true"}
@@ -155,15 +164,8 @@ export default function Index() {
<Text>Filter : {nameGroup}</Text>
</View>
}
<ScrollView
style={[Styles.h100]}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}>
<View>
</View>
<View style={[{ flex: 2 }]}>
{
loading ?
arrSkeleton.map((item, index) => {
@@ -173,7 +175,11 @@ export default function Index() {
})
:
data.length > 0 ?
data.map((item, index) => {
<VirtualizedList
data={data}
getItemCount={() => data.length}
getItem={getItem}
renderItem={({ item, index }: { item: Props, index: number }) => {
return (
<BorderBottomItem
key={index}
@@ -188,14 +194,20 @@ export default function Index() {
subtitle={item.group}
/>
)
})
}}
keyExtractor={(item, index) => String(index)}
showsVerticalScrollIndicator={false}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
/>
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada data</Text>
}
</View>
</ScrollView>
</View>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={() => setModal(false)} title={chooseData.name}>
<View style={Styles.rowItemsCenter}>
<MenuItemRow
@@ -243,7 +255,6 @@ export default function Index() {
</View>
</View>
</DrawerBottom>
</SafeAreaView>
</View>
)
}