upd: diskusi divisi

Deskripsi:
- list diskusi
- search diskusi
- detail diskusi
- kirim komentar
- edit diskusi
- status diskusi
- arsip diskusi
- tambah diskusi
- role akses user diskusi

No Issues

app/(application)/division/[id]/(fitur-division)/discussion/[detail]/edit.tsx

@@ -2,40 +2,92 @@ import ButtonBackHeader from "@/components/buttonBackHeader";
 import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import { InputForm } from "@/components/inputForm";
 import Styles from "@/constants/Styles";
-import { router, Stack } from "expo-router";
+import { apiEditDiscussion, apiGetDiscussionOne } from "@/lib/api";
+import { setUpdateDiscussion } from "@/lib/discussionUpdate";
+import { useAuthSession } from "@/providers/AuthProvider";
+import { router, Stack, useLocalSearchParams } from "expo-router";
+import { useEffect, useState } from "react";
 import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
+import { useDispatch, useSelector } from "react-redux";
 
 export default function DiscussionDivisionEdit() {
+   const { id, detail } = useLocalSearchParams<{ id: string; detail: string }>();
+   const { token, decryptToken } = useAuthSession();
+   const [data, setData] = useState("");
+   const update = useSelector((state: any) => state.discussionUpdate);
+   const dispatch = useDispatch();
+
+   async function handleLoad() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiGetDiscussionOne({
+            id: detail,
+            user: hasil,
+            cat: "data",
+         });
+         setData(response.data.desc);
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   useEffect(() => {
+      handleLoad();
+   }, []);
+
+   async function handleUpdate() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiEditDiscussion({
+            data: { user: hasil, desc: data },
+            id: detail,
+         });
+         if (response.success) {
+            ToastAndroid.show("Berhasil mengubah data", ToastAndroid.SHORT);
+            dispatch(setUpdateDiscussion({ ...update, data: !update.data }));
+            router.back();
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
    return (
       <SafeAreaView>
          <Stack.Screen
             options={{
-               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Edit Diskusi',
-               headerTitleAlign: 'center',
-               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
-                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                  router.back()
-               }} />
+               headerLeft: () => (
+                  <ButtonBackHeader
+                     onPress={() => {
+                        router.back();
+                     }}
+                  />
+               ),
+               headerTitle: "Edit Diskusi",
+               headerTitleAlign: "center",
+               headerRight: () => (
+                  <ButtonSaveHeader
+                     disable={data == ""}
+                     category="update"
+                     onPress={() => {
+                        handleUpdate();
+                     }}
+                  />
+               ),
             }}
          />
          <ScrollView>
             <View style={[Styles.p15]}>
-               <InputForm label="Diskusi" type="default" placeholder="Hal yang didiskusikan" required />
-               {/* <ButtonForm
-                  text="SIMPAN"
-                  onPress={() => {
-                     AlertKonfirmasi({
-                        title: 'Konfirmasi',
-                        desc: 'Apakah anda yakin ingin mengubah data?',
-                        onPress: () => {
-                           ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                           router.back()
-                        }
-                     })
-                  }} /> */}
+               <InputForm
+                  label="Diskusi"
+                  type="default"
+                  placeholder="Hal yang didiskusikan"
+                  required
+                  value={data}
+                  onChange={setData}
+               />
             </View>
          </ScrollView>
       </SafeAreaView>
-   )
-}
+   );
+}

app/(application)/division/[id]/(fitur-division)/discussion/[detail]/index.tsx

@@ -1,152 +1,278 @@
 import BorderBottomItem from "@/components/borderBottomItem";
 import ButtonBackHeader from "@/components/buttonBackHeader";
 import HeaderRightDiscussionDetail from "@/components/discussion/headerDiscussionDetail";
+import ImageUser from "@/components/imageNew";
 import { InputForm } from "@/components/inputForm";
 import LabelStatus from "@/components/labelStatus";
 import Styles from "@/constants/Styles";
+import {
+   apiGetDiscussionOne,
+   apiGetDivisionOneFeature,
+   apiSendDiscussionCommentar,
+} from "@/lib/api";
+import { useAuthSession } from "@/providers/AuthProvider";
 import { Ionicons, MaterialIcons } from "@expo/vector-icons";
 import { router, Stack, useLocalSearchParams } from "expo-router";
-import { Image, ScrollView, Text, View } from "react-native";
+import { useEffect, useState } from "react";
+import { Pressable, ScrollView, Text, View } from "react-native";
+import { useSelector } from "react-redux";
+
+type Props = {
+   id: string;
+   title: string;
+   desc: string;
+   status: number;
+   createdAt: string;
+   createdBy: string;
+   username: string;
+   user_img: string;
+   isCreator: boolean;
+   isActive: boolean;
+};
+
+type PropsComment = {
+   id: string;
+   comment: string;
+   createdAt: string;
+   username: string;
+   img: string;
+};
 
 export default function DiscussionDetail() {
-   const { id, detail } = useLocalSearchParams();
+   const { id, detail } = useLocalSearchParams<{ id: string; detail: string }>();
+   const [data, setData] = useState<Props>();
+   const [dataComment, setDataComment] = useState<PropsComment[]>([]);
+   const { token, decryptToken } = useAuthSession();
+   const [komentar, setKomentar] = useState("");
+   const [loadingSend, setLoadingSend] = useState(false);
+   const update = useSelector((state: any) => state.discussionUpdate);
+   const entityUser = useSelector((state: any) => state.user);
+   const [isMemberDivision, setIsMemberDivision] = useState(false);
+   const [isAdminDivision, setIsAdminDivision] = useState(false);
+   const [isCreator, setIsCreator] = useState(false);
+
+   async function handleLoad() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiGetDiscussionOne({
+            id: detail,
+            user: hasil,
+            cat: "data",
+         });
+         setData(response.data);
+         setIsCreator(response.data.createdBy == hasil);
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   async function handleLoadComment() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiGetDiscussionOne({
+            id: detail,
+            user: hasil,
+            cat: "comment",
+         });
+         setDataComment(response.data);
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   async function handleCheckMember() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiGetDivisionOneFeature({
+            id,
+            user: hasil,
+            cat: "check-member",
+         });
+
+         const response2 = await apiGetDivisionOneFeature({
+            id,
+            user: hasil,
+            cat: "check-admin",
+         });
+         setIsMemberDivision(response.data);
+         setIsAdminDivision(response2.data);
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   useEffect(() => {
+      handleLoad();
+   }, [update.data]);
+
+   useEffect(() => {
+      handleLoadComment();
+      handleCheckMember();
+   }, []);
+
+   async function handleKomentar() {
+      try {
+         setLoadingSend(true);
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiSendDiscussionCommentar({
+            id: detail,
+            data: { comment: komentar, user: hasil },
+         });
+         if (response.success) {
+            setKomentar("");
+            handleLoadComment();
+         }
+      } catch (error) {
+         console.error(error);
+      } finally {
+         setLoadingSend(false);
+      }
+   }
 
    return (
       <>
          <Stack.Screen
             options={{
-               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Diskusi',
-               headerTitleAlign: 'center',
-               headerRight: () => <HeaderRightDiscussionDetail id={detail} />,
+               headerLeft: () => (
+                  <ButtonBackHeader
+                     onPress={() => {
+                        router.back();
+                     }}
+                  />
+               ),
+               headerTitle: "Diskusi",
+               headerTitleAlign: "center",
+               headerRight: () =>
+                  (entityUser.role != "user" && entityUser.role != "coadmin") || isAdminDivision || isCreator ?
+                     <HeaderRightDiscussionDetail
+                        id={detail}
+                        status={data?.status}
+                        isActive={data?.isActive}
+                     /> : (<></>)
+               ,
             }}
          />
          <View style={{ flex: 1 }}>
             <ScrollView>
                <View style={[Styles.p15, Styles.mb100]}>
                   <BorderBottomItem
+                     descEllipsize={false}
+                     width={60}
                      borderType="bottom"
                      icon={
-                        <Image
-                           source={require("../../../../../../../assets/images/user.jpeg")}
-                           style={[Styles.userProfileSmall]}
+                        <ImageUser
+                           src={`https://wibu-storage.wibudev.com/api/files/${data?.user_img}`}
+                           size="sm"
                         />
                      }
-                     title="Amalia Dwi"
+                     title={data?.username}
                      subtitle={
-                        <LabelStatus category='success' text='BUKA' size="small" />
+                        data?.isActive ? (
+                           data?.status == 1 ? (
+                              <LabelStatus category="success" text="BUKA" size="small" />
+                           ) : (
+                              <LabelStatus category="error" text="TUTUP" size="small" />
+                           )
+                        ) : (
+                           <LabelStatus category="secondary" text="ARSIP" size="small" />
+                        )
                      }
-                     rightTopInfo="3 Jan 2025"
-                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
+                     rightTopInfo={data?.createdAt}
+                     desc={data?.desc}
                      leftBottomInfo={
                         <View style={[Styles.rowItemsCenter]}>
-                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
-                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>15 Komentar</Text>
+                           <Ionicons
+                              name="chatbox-ellipses-outline"
+                              size={18}
+                              color="grey"
+                              style={Styles.mr05}
+                           />
+                           <Text
+                              style={[Styles.textInformation, Styles.cGray, Styles.mb05]}
+                           >
+                              {dataComment.length} Komentar
+                           </Text>
                         </View>
                      }
                   />
                   <View style={[Styles.p15]}>
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="sangat berdampak dari berbagai sisi"
-                     />
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="semua menjadi terbatas.."
-                     />
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="semua menjadi terbatas.."
-                     />
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="semua menjadi terbatas.."
-                     />
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="semua menjadi terbatas.."
-                     />
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="semua menjadi terbatas.."
-                     />
-
-                     <BorderBottomItem
-                        borderType="bottom"
-                        icon={
-                           <Image
-                              source={require("../../../../../../../assets/images/user.jpeg")}
-                              style={[Styles.userProfileExtraSmall]}
-                           />
-                        }
-                        title="Amalia Dwi"
-                        rightTopInfo="3 Jan 2025"
-                        desc="semua menjadi terbatas.."
-                     />
-
+                     {dataComment.map((item, index) => (
+                        <BorderBottomItem
+                           key={index}
+                           width={55}
+                           borderType="bottom"
+                           icon={
+                              <ImageUser
+                                 src={`https://wibu-storage.wibudev.com/api/files/${item.img}`}
+                                 size="xs"
+                              />
+                           }
+                           title={item.username}
+                           rightTopInfo={item.createdAt}
+                           desc={item.comment}
+                           descEllipsize={false}
+                        />
+                     ))}
                   </View>
                </View>
             </ScrollView>
-            <View style={[Styles.ph15, Styles.absolute0, { backgroundColor: '#f4f4f4' }]}>
+            <View
+               style={[
+                  Styles.ph15,
+                  Styles.absolute0,
+                  { backgroundColor: "#f4f4f4" },
+               ]}
+            >
                <InputForm
+                  disable={
+                     data?.status == 2 ||
+                     data?.isActive == false ||
+                     ((entityUser.role == "user" || entityUser.role == "coadmin") &&
+                        !isMemberDivision)
+                  }
                   bg="white"
                   type="default"
                   round
                   placeholder="Kirim Komentar"
+                  onChange={setKomentar}
+                  value={komentar}
                   itemRight={
-                     <MaterialIcons name="send" size={25} color={'#384288'} />
+                     <Pressable
+                        onPress={() => {
+                           komentar != "" &&
+                              !loadingSend &&
+                              data?.status != 2 &&
+                              data?.isActive &&
+                              (((entityUser.role == "user" ||
+                                 entityUser.role == "coadmin") &&
+                                 isMemberDivision) ||
+                                 entityUser.role == "admin" ||
+                                 entityUser.role == "superadmin" ||
+                                 entityUser.role == "developer" ||
+                                 entityUser.role == "cosupadmin") &&
+                              handleKomentar();
+                        }}
+                     >
+                        <MaterialIcons
+                           name="send"
+                           size={25}
+                           style={
+                              komentar == "" ||
+                                 loadingSend ||
+                                 data?.status == 2 ||
+                                 data?.isActive == false ||
+                                 ((entityUser.role == "user" ||
+                                    entityUser.role == "coadmin") &&
+                                    !isMemberDivision)
+                                 ? Styles.cGray
+                                 : Styles.cDefault
+                           }
+                        />
+                     </Pressable>
                   }
                />
             </View>
          </View>
       </>
-   )
-}
+   );
+}

app/(application)/division/[id]/(fitur-division)/discussion/create.tsx

@@ -2,10 +2,38 @@ import ButtonBackHeader from "@/components/buttonBackHeader"
 import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
-import { router, Stack } from "expo-router"
+import { apiCreateDiscussion } from "@/lib/api"
+import { setUpdateDiscussion } from "@/lib/discussionUpdate"
+import { useAuthSession } from "@/providers/AuthProvider"
+import { router, Stack, useLocalSearchParams } from "expo-router"
+import { useState } from "react"
 import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"
+import { useDispatch, useSelector } from "react-redux"
 
 export default function CreateDiscussionDivision() {
+   const { id } = useLocalSearchParams<{ id: string }>()
+   const [desc, setDesc] = useState('')
+   const { token, decryptToken } = useAuthSession()
+   const update = useSelector((state: any) => state.discussionUpdate)
+   const dispatch = useDispatch();
+
+   async function handleCreate() {
+      try {
+         const hasil = await decryptToken(String(token?.current))
+         const response = await apiCreateDiscussion({ data: { user: hasil, desc, idDivision: id } })
+         if (response.success) {
+            ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
+            dispatch(setUpdateDiscussion({ ...update, data: !update.data }));
+            router.back()
+         } else {
+            ToastAndroid.show(response.message, ToastAndroid.SHORT)
+         }
+      } catch (error) {
+         console.error(error)
+         ToastAndroid.show('Terjadi kesalahan', ToastAndroid.SHORT)
+      }
+   }
+
    return (
       <SafeAreaView>
          <Stack.Screen
@@ -13,15 +41,17 @@ export default function CreateDiscussionDivision() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Diskusi',
                headerTitleAlign: 'center',
-               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
-                  ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
-                  router.push('./')
-               }} />
+               headerRight: () => <ButtonSaveHeader
+                  disable={desc == ""}
+                  category="create"
+                  onPress={() => {
+                     handleCreate()
+                  }} />
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
-               <InputForm label="Diskusi" type="default" placeholder="Hal yang didiskusikan" required />
+               <InputForm label="Diskusi" type="default" placeholder="Hal yang didiskusikan" required onChange={setDesc} />
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/division/[id]/(fitur-division)/discussion/index.tsx

@@ -1,15 +1,52 @@
 import BorderBottomItem from "@/components/borderBottomItem";
 import ButtonTab from "@/components/buttonTab";
+import ImageUser from "@/components/imageNew";
 import InputSearch from "@/components/inputSearch";
 import LabelStatus from "@/components/labelStatus";
 import Styles from "@/constants/Styles";
+import { apiGetDiscussion, apiGetDivisionOneFeature } from "@/lib/api";
+import { useAuthSession } from "@/providers/AuthProvider";
 import { AntDesign, Feather, Ionicons } from "@expo/vector-icons";
 import { router, useLocalSearchParams } from "expo-router";
-import { Image, SafeAreaView, ScrollView, Text, View } from "react-native";
+import { useEffect, useState } from "react";
+import { SafeAreaView, ScrollView, Text, View } from "react-native";
+import { useSelector } from "react-redux";
+
+
+type Props = {
+   id: string,
+   title: string,
+   desc: string,
+   status: number,
+   user_name: string,
+   img: string,
+   total_komentar: number,
+   createdAt: string,
+   isActive: boolean
+}
 
 
 export default function DiscussionDivision() {
-   const { active } = useLocalSearchParams<{ active?: string }>()
+   const { id, active } = useLocalSearchParams<{ id: string, active?: string }>()
+   const [data, setData] = useState<Props[]>([])
+   const { token, decryptToken } = useAuthSession()
+   const [search, setSearch] = useState('')
+   const update = useSelector((state: any) => state.discussionUpdate);
+
+   async function handleLoad() {
+      try {
+         const hasil = await decryptToken(String(token?.current))
+         const response = await apiGetDiscussion({ user: hasil, search, division: id, active })
+         setData(response.data)
+      } catch (error) {
+         console.error(error)
+      }
+   }
+
+
+   useEffect(() => {
+      handleLoad()
+   }, [active, search, update.data])
 
    return (
       <SafeAreaView>
@@ -19,121 +56,49 @@ export default function DiscussionDivision() {
                   <ButtonTab
                      active={active == "false" ? "false" : "true"}
                      value="true"
-                     onPress={() => { router.push('./discussion?active=true') }}
+                     onPress={() => { router.replace('./discussion?active=true') }}
                      label="Aktif"
                      icon={<Feather name="check-circle" color={active == "false" ? 'black' : 'white'} size={20} />}
                      n={2} />
                   <ButtonTab
                      active={active == "false" ? "false" : "true"}
                      value="false"
-                     onPress={() => { router.push('./discussion?active=false') }}
+                     onPress={() => { router.replace('./discussion?active=false') }}
                      label="Arsip"
                      icon={<AntDesign name="closecircleo" color={active == "true" ? 'black' : 'white'} size={20} />}
                      n={2} />
                </View>
-               <InputSearch />
+               <InputSearch onChange={setSearch} />
                <View>
-                  <BorderBottomItem
-                     onPress={() => { router.push('./discussion/1') }}
-                     borderType="bottom"
-                     icon={
-                        <Image source={require("../../../../../../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />
-                     }
-                     title="Amalia Dwi"
-                     subtitle={
-                        <LabelStatus category='success' text='BUKA' size="small" />
-                     }
-                     rightTopInfo="3 Jan 2025"
-                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
-                     leftBottomInfo={
-                        <View style={[Styles.rowItemsCenter]}>
-                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
-                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>Diskusikan</Text>
-                        </View>
-                     }
-                     rightBottomInfo='15 Komentar'
-                  />
-                  <BorderBottomItem
-                     onPress={() => { router.push('./discussion/1') }}
-                     borderType="bottom"
-                     icon={
-                        <Image source={require("../../../../../../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />
-                     }
-                     title="Amalia Dwi"
-                     subtitle={
-                        <LabelStatus category='success' text='BUKA' size="small" />
-                     }
-                     rightTopInfo="3 Jan 2025"
-                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
-                     leftBottomInfo={
-                        <View style={[Styles.rowItemsCenter]}>
-                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
-                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>Diskusikan</Text>
-                        </View>
-                     }
-                     rightBottomInfo='15 Komentar'
-                  />
-                  <BorderBottomItem
-                     onPress={() => { router.push('./discussion/1') }}
-                     borderType="bottom"
-                     icon={
-                        <Image source={require("../../../../../../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />
-                     }
-                     title="Amalia Dwi"
-                     subtitle={
-                        <LabelStatus category='success' text='BUKA' size="small" />
-                     }
-                     rightTopInfo="3 Jan 2025"
-                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
-                     leftBottomInfo={
-                        <View style={[Styles.rowItemsCenter]}>
-                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
-                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>Diskusikan</Text>
-                        </View>
-                     }
-                     rightBottomInfo='15 Komentar'
-                  />
-                  <BorderBottomItem
-                     onPress={() => { router.push('./discussion/1') }}
-                     borderType="bottom"
-                     icon={
-                        <Image source={require("../../../../../../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />
-                     }
-                     title="Amalia Dwi"
-                     subtitle={
-                        <LabelStatus category='success' text='BUKA' size="small" />
-                     }
-                     rightTopInfo="3 Jan 2025"
-                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
-                     leftBottomInfo={
-                        <View style={[Styles.rowItemsCenter]}>
-                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
-                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>Diskusikan</Text>
-                        </View>
-                     }
-                     rightBottomInfo='15 Komentar'
-                  />
-                  <BorderBottomItem
-                     onPress={() => { router.push('./discussion/1') }}
-                     borderType="bottom"
-                     icon={
-                        <Image source={require("../../../../../../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />
-                     }
-                     title="Amalia Dwi"
-                     subtitle={
-                        <LabelStatus category='success' text='BUKA' size="small" />
-                     }
-                     rightTopInfo="3 Jan 2025"
-                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
-                     leftBottomInfo={
-                        <View style={[Styles.rowItemsCenter]}>
-                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
-                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>Diskusikan</Text>
-                        </View>
-                     }
-                     rightBottomInfo='15 Komentar'
-                  />
-
+                  {data.length > 0 ?
+                     data.map((item, index) => (
+                        <BorderBottomItem
+                           key={index}
+                           width={55}
+                           onPress={() => { router.push(`./discussion/${item.id}`) }}
+                           borderType="bottom"
+                           icon={
+                              <ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} size="sm" />
+                           }
+                           title={item.user_name}
+                           subtitle={
+                              active == "true" ? item.status == 1 ? <LabelStatus category='success' text='BUKA' size="small" /> : <LabelStatus category='error' text='TUTUP' size="small" /> : <></>
+                           }
+                           rightTopInfo={item.createdAt}
+                           desc={item.desc}
+                           leftBottomInfo={
+                              <View style={[Styles.rowItemsCenter]}>
+                                 <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
+                                 <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>Diskusikan</Text>
+                              </View>
+                           }
+                           rightBottomInfo={item.total_komentar + ' Komentar'}
+                        />
+                     ))
+                     :
+                     (
+                        <Text style={[Styles.textDefault, Styles.cGray, Styles.mv10, { textAlign: "center" }]}>Tidak ada diskusi</Text>
+                     )}
                </View>
             </View>
          </ScrollView>