upd: redesign aplikasi

Deskripsi: - update home, profile dll - blm selesai NO Issues
2026-02-10 17:32:56 +08:00
parent d3802ca26c
commit 064a8ccaad
29 changed files with 368 additions and 132 deletions
--- a/components/home/carouselHome2.tsx
+++ b/components/home/carouselHome2.tsx
@@ -0,0 +1,143 @@
+import { ConstEnv } from "@/constants/ConstEnv";
+import Styles from "@/constants/Styles";
+import { apiGetBanner, apiGetProfile } from "@/lib/api";
+import { setEntities } from "@/lib/bannerSlice";
+import { setEntityUser } from "@/lib/userSlice";
+import { useAuthSession } from "@/providers/AuthProvider";
+import { useTheme } from "@/providers/ThemeProvider";
+import { AntDesign, Feather, FontAwesome5, Ionicons, MaterialCommunityIcons, MaterialIcons, } from "@expo/vector-icons";
+import { router } from "expo-router";
+import React, { useEffect } from "react";
+import { Dimensions, Image, View } from "react-native";
+import { useSharedValue } from "react-native-reanimated";
+import Carousel, { ICarouselInstance } from "react-native-reanimated-carousel";
+import { useDispatch, useSelector } from "react-redux";
+import { ButtonFiturMenu } from "../buttonFiturMenu";
+import Text from "../Text";
+
+export default function CaraouselHome2({ refreshing }: { refreshing: boolean }) {
+   const { decryptToken, token } = useAuthSession()
+   const { colors } = useTheme();
+   const ref = React.useRef<ICarouselInstance>(null);
+   const width = Dimensions.get("window").width;
+   const progress = useSharedValue<number>(0);
+   const dispatch = useDispatch()
+   const entities = useSelector((state: any) => state.banner)
+   const entityUser = useSelector((state: any) => state.user)
+
+   async function handleBannerView() {
+      const hasil = await decryptToken(String(token?.current))
+      apiGetBanner({ user: hasil }).then((data) => {
+         if (data.data.length > 0) {
+            dispatch(setEntities(data.data))
+         } else {
+            dispatch(setEntities([]))
+         }
+      })
+   }
+
+   async function handleUser() {
+      const hasil = await decryptToken(String(token?.current))
+      const response = await apiGetProfile({ id: hasil })
+      dispatch(setEntityUser({ role: response.data.idUserRole, admin: false }))
+   }
+
+   useEffect(() => {
+      if (refreshing)
+         handleBannerView()
+   }, [refreshing]);
+
+   useEffect(() => {
+      handleBannerView()
+   }, [dispatch]);
+
+   useEffect(() => {
+      handleUser()
+   }, []);
+
+   return (
+      <View
+         style={[
+            Styles.mv15,
+            Styles.p15,
+            Styles.round05,
+            { backgroundColor: colors.card },
+            Styles.wrapHomeCarousel
+         ]}
+      >
+         {/* WRAPPER CAROUSEL */}
+         <View
+            style={{
+               justifyContent: 'center',  // ⬅️ vertical center
+               alignItems: 'center',
+            }}
+         >
+            {entities.length > 0 ? (
+               <Carousel
+                  ref={ref}
+                  width={width - 30} // ⬅️ biar ga nabrak padding hijau
+                  height={width / 2.6}
+                  data={entities}
+                  loop
+                  autoPlay
+                  autoPlayInterval={5000}
+                  onProgressChange={progress}
+                  renderItem={({ index }) => (
+                     <Image
+                        source={{ uri: `${ConstEnv.url_storage}/files/${entities[index].image}` }}
+                        style={[
+                           Styles.caraoselContent,
+                           Styles.round05,
+                           {
+                              backgroundColor: colors.primary
+                           },
+                        ]}
+                        resizeMode="cover"
+                     />
+                  )}
+               />
+            ) : (
+               <View
+                  style={[
+                     Styles.caraoselContent,
+                     {
+                        height: width / 2.5,
+                        backgroundColor: colors.primary,
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                     },
+                  ]}
+               >
+                  <Text style={[Styles.textDefault, Styles.cWhite]}>BANNER</Text>
+               </View>
+            )}
+         </View>
+
+         {/* FITUR */}
+         <View style={[Styles.mt15]}>
+            <View style={Styles.rowSpaceBetween}>
+               <ButtonFiturMenu
+                  icon={<Feather name="users" size={30} color={colors.icon} />}
+                  text="Divisi"
+                  onPress={() => router.push('/division?active=true')}
+               />
+               <ButtonFiturMenu
+                  icon={<Feather name="bar-chart" size={30} color={colors.icon} />}
+                  text="Kegiatan"
+                  onPress={() => router.push('/project?status=0')}
+               />
+               <ButtonFiturMenu
+                  icon={<Ionicons name="megaphone-outline" size={30} color={colors.icon} />}
+                  text="Pengumuman"
+                  onPress={() => router.push('/announcement')}
+               />
+               <ButtonFiturMenu
+                  icon={<Ionicons name="grid-outline" size={30} color={colors.icon} />}
+                  text="Semua"
+                  onPress={() => router.push('/feature')}
+               />
+            </View>
+         </View>
+      </View>
+   )
+}