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

upd : home page

Browse Source 
Deskripsi:
- load refresh pada halaman home

No Issues
This commit is contained in:
amaliadwiy
2025-09-09 11:49:13 +08:00
parent a15724756e
commit 060f96e7b2
8 changed files with 89 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
app/(application)/home.tsx
View File

@@ -13,8 +13,8 @@ import { apiGetProfile } from "@/lib/api";
import { setEntities } from "@/lib/entitiesSlice";
import { useAuthSession } from "@/providers/AuthProvider";
import { Stack } from "expo-router";
import { useEffect } from "react";
import { Platform, SafeAreaView, ScrollView, View } from "react-native";
import { useEffect, useState } from "react";
import { Platform, RefreshControl, SafeAreaView, ScrollView, View } from "react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { useDispatch, useSelector } from "react-redux";
@@ -24,6 +24,7 @@ export default function Home() {
const dispatch = useDispatch()
const { token, decryptToken, signOut } = useAuthSession()
const insets = useSafeAreaInsets()
const [refreshing, setRefreshing] = useState(false)
useEffect(() => {
handleUserLogin()
@@ -38,6 +39,14 @@ export default function Home() {
});
}
const handleRefresh = async () => {
setRefreshing(true)
// await handleLoad('data')
// await handleLoad('progress')
await new Promise(resolve => setTimeout(resolve, 2000));
setRefreshing(false)
};
return (
<SafeAreaView>
<Stack.Screen
@@ -52,16 +61,24 @@ export default function Home() {
),
}}
/>
<ScrollView>
<CaraouselHome />
<ScrollView
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
showsVerticalScrollIndicator={false}
>
<CaraouselHome refreshing={refreshing}/>
<View style={[Styles.ph15, Styles.mb100]}>
<FiturHome />
<ProjectHome />
<DivisionHome />
<ChartProgresHome />
<ChartDokumenHome />
<EventHome />
<DisccussionHome />
<ProjectHome refreshing={refreshing}/>
<DivisionHome refreshing={refreshing}/>
<ChartProgresHome refreshing={refreshing}/>
<ChartDokumenHome refreshing={refreshing}/>
<EventHome refreshing={refreshing}/>
<DisccussionHome refreshing={refreshing}/>
</View>
</ScrollView>
</SafeAreaView>

7
components/home/carouselHome.tsx
View File

@@ -11,7 +11,7 @@ import Carousel, { ICarouselInstance } from "react-native-reanimated-carousel";
import { useDispatch, useSelector } from "react-redux";
import Text from "../Text";
export default function CaraouselHome() {
export default function CaraouselHome({ refreshing }: { refreshing: boolean }) {
const { decryptToken, token } = useAuthSession()
const ref = React.useRef<ICarouselInstance>(null);
const width = Dimensions.get("window").width;
@@ -37,6 +37,11 @@ export default function CaraouselHome() {
dispatch(setEntityUser({ role: response.data.idUserRole, admin: false }))
}
useEffect(() => {
if (refreshing)
handleBannerView()
}, [refreshing]);
useEffect(() => {
handleBannerView()
}, [dispatch]);

13
components/home/chartDokumenHome.tsx
View File

@@ -13,7 +13,7 @@ type Props = {
frontColor: string;
}[]
export default function ChartDokumenHome() {
export default function ChartDokumenHome({ refreshing }: { refreshing: boolean }) {
const [loading, setLoading] = useState(true)
const { decryptToken, token } = useAuthSession()
const [data, setData] = useState<Props>([])
@@ -25,9 +25,9 @@ export default function ChartDokumenHome() {
const width = Dimensions.get("window").width;
async function handleData() {
async function handleData(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "dokumen", user: hasil })
const maxValue = response.data.reduce((max: number, obj: { value: number; }) => Math.max(max, obj.value), -Infinity);
@@ -47,7 +47,12 @@ export default function ChartDokumenHome() {
}
useEffect(() => {
handleData()
if (refreshing)
handleData(false)
}, [refreshing]);
useEffect(() => {
handleData(true)
}, []);
return (

13
components/home/chartProgresHome.tsx
View File

@@ -13,14 +13,14 @@ type Props = {
color: string;
}[]
export default function ChartProgresHome() {
export default function ChartProgresHome({ refreshing }: { refreshing: boolean }) {
const { decryptToken, token } = useAuthSession()
const [data, setData] = useState<Props>([])
const [loading, setLoading] = useState(true)
async function handleData() {
async function handleData(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "progress", user: hasil })
const convertedArray = response.data.map((item: { color: any; text: any; value: any; }) => ({
@@ -37,7 +37,12 @@ export default function ChartProgresHome() {
}
useEffect(() => {
handleData()
if (refreshing)
handleData(false)
}, [refreshing]);
useEffect(() => {
handleData(true)
}, []);
return (

13
components/home/discussionHome.tsx
View File

@@ -17,15 +17,15 @@ type Props = {
user: string
}
export default function DisccussionHome() {
export default function DisccussionHome({ refreshing }: { refreshing: boolean }) {
const { decryptToken, token } = useAuthSession()
const [data, setData] = useState<Props[]>([])
const [loading, setLoading] = useState(true)
async function handleData() {
async function handleData(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "discussion", user: hasil })
setData(response.data)
@@ -37,7 +37,12 @@ export default function DisccussionHome() {
}
useEffect(() => {
handleData()
if (refreshing)
handleData(false)
}, [refreshing]);
useEffect(() => {
handleData(true)
}, []);
return (

15
components/home/divisionHome.tsx
View File

@@ -15,7 +15,7 @@ type Props = {
jumlah: number
}
export default function DivisionHome() {
export default function DivisionHome({ refreshing }: { refreshing: boolean }) {
const { decryptToken, token } = useAuthSession()
const ref = React.useRef<ICarouselInstance>(null)
const width = Dimensions.get("window").width
@@ -23,9 +23,9 @@ export default function DivisionHome() {
const [loading, setLoading] = useState(true)
const arrSkeleton = Array.from({ length: 2 }, (_, index) => index)
async function handleData() {
async function handleData(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "division", user: hasil })
setData(response.data)
@@ -37,14 +37,19 @@ export default function DivisionHome() {
}
useEffect(() => {
handleData()
if (refreshing)
handleData(false)
}, [refreshing]);
useEffect(() => {
handleData(true)
}, []);
return (
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Divisi Teraktif</Text>
<Text style={[Styles.textDefaultSemiBold, Styles.mb10]}>Divisi Teraktif</Text>
{
loading ?
arrSkeleton.map((item, index) => (

13
components/home/eventHome.tsx
View File

@@ -22,14 +22,14 @@ type Props = {
user_name: string
}
export default function EventHome() {
export default function EventHome({ refreshing }: { refreshing: boolean }) {
const { decryptToken, token } = useAuthSession()
const [data, setData] = useState<Props[]>([])
const [loading, setLoading] = useState(true)
async function handleData() {
async function handleData(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "event", user: hasil })
setData(response.data)
@@ -41,7 +41,12 @@ export default function EventHome() {
}
useEffect(() => {
handleData()
if (refreshing)
handleData(false)
}, [refreshing]);
useEffect(() => {
handleData(true)
}, []);
return (

15
components/home/projectHome.tsx
View File

@@ -20,16 +20,16 @@ type Props = {
createdAt: string
}
export default function ProjectHome() {
export default function ProjectHome({ refreshing }: { refreshing: boolean }) {
const { decryptToken, token } = useAuthSession()
const ref = React.useRef<ICarouselInstance>(null);
const width = Dimensions.get("window").width;
const [data, setData] = useState<Props[]>([])
const [loading, setLoading] = useState(true)
async function handleData() {
async function handleData(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "kegiatan", user: hasil })
setData(response.data)
@@ -41,12 +41,17 @@ export default function ProjectHome() {
}
useEffect(() => {
handleData()
if (refreshing)
handleData(false)
}, [refreshing]);
useEffect(() => {
handleData(true)
}, []);
return (
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Kegiatan Terupdate</Text>
<Text style={[Styles.textDefaultSemiBold, Styles.mb10]}>Kegiatan Terupdate</Text>
{
loading ? (<Skeleton width={100} height={150} borderRadius={10} widthType="percent" />)
: