upd:banner home

deskripsi:
- load banner di halaman home

- nb : blm selesai

No Issues

components/home/carouselHome.tsx

@@ -1,14 +1,26 @@
 import Styles from "@/constants/Styles";
+import { apiGetBanner } from "@/lib/api";
+import { setEntities } from "@/lib/bannerSlice";
+import { useAuthSession } from "@/providers/AuthProvider";
 import React from "react";
 import { Dimensions, Text, View } from "react-native";
 import { useSharedValue } from "react-native-reanimated";
 import Carousel, { ICarouselInstance } from "react-native-reanimated-carousel";
+import { useDispatch, useSelector } from "react-redux";
 
 export default function CaraouselHome() {
+   const { decryptToken, token } = useAuthSession()
    const ref = React.useRef<ICarouselInstance>(null);
    const width = Dimensions.get("window").width;
    const data = [...new Array(6).keys()];
    const progress = useSharedValue<number>(0);
+   const dispatch = useDispatch()
+   const entities = useSelector((state: any) => state.banner)
+
+   async function handleBannerView() {
+      const hasil = await decryptToken(String(token?.current))
+      apiGetBanner({ user: hasil }).then((data) => dispatch(setEntities(data.data)));
+   }
 
    return (
       <View style={[Styles.mv15]}>
@@ -16,12 +28,16 @@ export default function CaraouselHome() {
             ref={ref}
             width={width}
             height={width / 2.5}
-            data={data}
+            data={entities}
             loop={true}
             autoPlay={true}
             autoPlayInterval={5000}
             onProgressChange={progress}
             renderItem={({ index }) => (
+               // <Image
+               //    source={require("../../assets/images/user.jpg")}
+               //    style={[Styles.caraoselContent]}
+               // />
                <View style={Styles.caraoselContent} >
                   <Text style={{ textAlign: "center", color: "white", fontWeight: 'bold' }}>BANNER DARMASABA</Text>
                </View>

constants/Styles.ts

@@ -257,6 +257,7 @@ const Styles = StyleSheet.create({
       borderRadius: 15,
       backgroundColor: '#19345E',
       display: 'flex',
+      width: '92%'
    },
    wrapGridContent: {
       shadowColor: '#171717',

lib/api.ts

@@ -20,11 +20,16 @@ export const apiGetProfile = async ({ id }: { id: string }) => {
    return response.data;
 };
 
-export const apiGetSearch = async ({ text, user }: { text: string, user:string }) => {
+export const apiGetSearch = async ({ text, user }: { text: string, user: string }) => {
    const response = await api.get(`mobile/home/search?search=${text}&user=${user}`);
    return response.data;
 };
 
+export const apiGetBanner = async ({ user }: { user: string }) => {
+   const response = await api.get(`mobile/banner?user=${user}`);
+   return response.data;
+};
+
 
 // export const createEntity = async (newEntity: any) => {
 //    const response = await api.post('/entities', newEntity);

lib/bannerSlice.ts

@@ -0,0 +1,29 @@
+import { createSlice } from '@reduxjs/toolkit';
+
+const bannerSlice = createSlice({
+   name: 'banner',
+   initialState: [],
+   reducers: {
+      setEntities: (state, action) => {
+         return action.payload;
+      },
+
+      addEntity: (state: any, action: any) => {
+         state.push(action.payload); 
+      },
+      updateEntity: (state: any, action) => {
+         const { id, updatedEntity } = action.payload;
+         const index = state.findIndex((entity: any) => entity.id === id);
+         if (index !== -1) {
+            state[index] = updatedEntity;
+         }
+      },
+      // removeEntity: (state, action) => {
+      //    const idToRemove = action.payload;
+      //    return state.filter((entity: any) => entity.id !== idToRemove);
+      // },
+   },
+});
+
+export const { setEntities, addEntity, updateEntity } = bannerSlice.actions;
+export default bannerSlice.reducer;

lib/store.ts

@@ -1,11 +1,18 @@
-import { configureStore } from '@reduxjs/toolkit';
+import { combineReducers, combineSlices, configureStore } from '@reduxjs/toolkit';
+import bannerReducer from './bannerSlice';
 import entitiesReducer from './entitiesSlice';
 
+
+const reducer = combineSlices({
+   entitiesReducer,bannerReducer
+})
+
 const store = configureStore({
    reducer: {
       entities: entitiesReducer,
+      banner: bannerReducer,
+   }
       // Add other reducers as needed
-   },
 });
 
 export default store;