Merge pull request #92 from bipproduction/amalia/5-agustus-24

Amalia/5 agustus 24

.env

@@ -5,3 +5,4 @@
 # See the documentation for all the connection string options: https://pris.ly/d/connection-strings
 
 DATABASE_URL="postgresql://bip:Production_123d@localhost:5433/sistem_desa_mandiri?schema=public"
+URL="http://localhost:3000"

prisma/schema.prisma

@@ -257,7 +257,7 @@ model DivisionProject {
   idDivision String
   title      String
   desc       String   @db.Text
-  status     Int      @default(0)
+  status     Int      @default(0) // 0 = pending, 1 = ongoing, 2 = done, 3 = cancelled
   isActive   Boolean  @default(true)
   createdAt  DateTime @default(now())
   updatedAt  DateTime @updatedAt

src/app/(application)/division/[id]/page.tsx

@@ -1,9 +1,9 @@
 import { ViewDetailDivision } from '@/module/division_new';
 import React from 'react';
 
-function Page() {
+function Page({ params }: { params: { id: string } }) {
   return (
-    <ViewDetailDivision />
+    <ViewDetailDivision id={params.id}/>
   );
 }
 

src/module/_global/bin/api_address.ts

@@ -38,4 +38,7 @@ export const API_ADDRESS = {
 
    // Division
    "apiGetAllDivision": "/api/division/get?path=get-all-division",
+   "apiGetOneDivision": "/api/division/get?path=get-one-division",
+   "apiGetOneDetailDivision": "/api/division/get?path=get-one-detail-division",
+   "apiCreateDivision": "/api/division/post?path=create-division",
 }

src/module/division_new/api/api_index.ts

@@ -1,5 +1,6 @@
 import getAllDivision from "./get/getAllDivision";
 import getOneDivision from "./get/getOneDivision";
+import getOneDetailDivision from "./get/getOneDetailDivision";
 import createDivision from "./post/createDivision";
 import deleteDivision from "./post/deleteDivision";
 import updateDivision from "./post/updateDivision";
@@ -30,4 +31,9 @@ export const API_INDEX_DIVISION = [
     method: "GET",
     bin: getOneDivision,
   },
+  {
+    path: "get-one-detail-division",
+    method: "GET",
+    bin: getOneDetailDivision,
+  },
 ];

src/module/division_new/api/get/getOneDetailDivision.ts

@@ -0,0 +1,87 @@
+import { prisma } from '@/module/_global';
+import { NextRequest } from "next/server";
+
+export default async function getOneDetailDivision(req: NextRequest) {
+   try {
+      const searchParams = req.nextUrl.searchParams
+      const id = searchParams.get('divisionId');
+
+      console.log('aaaaa',id)
+      const division = await prisma.division.findUnique({
+         where: {
+            id: String(id),
+         },
+         select: {
+            id: true,
+            name: true,
+         },
+      });
+
+      const member = await prisma.divisionMember.findMany({
+         where: {
+            idDivision: String(id),
+         },
+         select: {
+            idUser: true,
+            isLeader: true
+         }
+      })
+
+      const tugas = await prisma.divisionProject.count({
+         where: {
+            idDivision: String(id),
+            status: {
+               lte: 1
+            },
+            isActive: true
+         }
+      })
+
+      const dokumen = await prisma.divisionDocumentFolderFile.count({
+         where: {
+            idDivision: String(id),
+            isActive: true,
+            category: "FILE"
+         }
+      })
+
+      const diskusi = await prisma.divisionDisscussion.count({
+         where: {
+            idDivision: String(id),
+            isActive: true,
+            status: 1
+         }
+      })
+
+      const kalender = await prisma.divisionCalendar.count({
+         where: {
+            idDivision: String(id),
+            isActive: true,
+            dateStart: {
+               lte: new Date()
+            }
+         }
+      })
+
+      const allData = {
+         // division: division,
+         division:{name:id},
+         jumlah:{
+            tugas: 1,
+            dokumen: dokumen,
+            diskusi: diskusi,
+            kalender: kalender
+         },
+         member: member,
+      }
+
+      return Response.json(allData);
+   } catch (error) {
+      console.error(error);
+      return Response.json(
+         { message: "Internal Server Error", success: false },
+         { status: 500 }
+      );
+   }
+
+}

src/module/division_new/api/post/createDivision.ts

@@ -1,26 +1,40 @@
 import { prisma } from "@/module/_global";
+import { funGetUserByCookies } from "@/module/auth";
+import _ from "lodash";
+import { revalidatePath } from "next/cache";
 
 export default async function createDivision(req: Request) {
    try {
-      const data = await req.json();
+      const sent = await req.json();
-      const insert = await prisma.division.create({
+      const user = await funGetUserByCookies();
+
+      const insertDivision = await prisma.division.create({
          data: {
-            name: data.name,
+            name: sent.data.name,
-            idVillage: data.idVillage,
+            idVillage: String(user.idVillage),
-            idGroup: data.idGroup,
+            idGroup: sent.data.idGroup,
-            desc: data.desc,
+            desc: sent.data.desc,
-            createdBy: data.createdBy
+            createdBy: String(user.id)
          },
          select: {
             id: true
          }
       })
 
+      const dataMember = sent.member.map((v: any) => ({
+         ..._.omit(v, ["isActive", "nik", "name", "phone", "email", "gender", "group", "position"]),
+         idUser: v.id,
+         idDivision: insertDivision.id,
+         isAdmin: sent.admin.some((i: any) => i == v.id)
+      }))
+
       const insertMember = await prisma.divisionMember.createMany({
-         data: data.member
+         data: dataMember
       })
 
-      return Response.json(insert, { status: 201 });
+      revalidatePath("/division");
+
+      return Response.json({ success: true, message: "Sukses menambahkan data divisi" }, { status: 201 });
 
    } catch (error) {
       console.error(error);

src/module/division_new/components/create_admin_division.tsx

@@ -3,7 +3,7 @@ import NavbarAdminDivision from './ui/navbar_admin_division';
 
 export default function CreateAdminDivision({ data }: { data: any }) {
   return (
-    <NavbarAdminDivision />
+    <NavbarAdminDivision data={data} onSuccess={() => { }} />
   );
 }
 

src/module/division_new/components/create_division.tsx

@@ -24,6 +24,7 @@ import { funGetUserByCookies } from "@/module/auth";
 import CreateAdminDivision from "./create_admin_division";
 import CreateUsers from "./create_users";
 import NavbarCreateUsers from "./ui/navbar_create_users";
+import NavbarAdminDivision from "./ui/navbar_admin_division";
 
 
 export default function CreateDivision() {
@@ -74,12 +75,30 @@ export default function CreateDivision() {
     }
 
 
+    function onChooseGroup(val: any) {
+        member.set([])
+        setBody({ ...body, idGroup: val })
+    }
+
+
 
     useShallowEffect(() => {
         loadData();
     }, []);
 
-    if (isChooseAdmin) return <CreateAdminDivision data={body} />
+    if (isChooseAdmin) return <NavbarAdminDivision data={body} onSuccess={(val) => {
+        if (val) {
+            member.set([])
+            setBody({
+                ...body,
+                idGroup: "",
+                name: "",
+                desc: "",
+            })
+        }
+
+        setChooseAdmin(false)
+    }} />
 
     if (isChooseAnggota) return <NavbarCreateUsers grup={body.idGroup} onClose={() => { setChooseAnggota(false) }} />
 
@@ -101,8 +120,10 @@ export default function CreateDivision() {
                                     label: pro.name
                                 }))}
                                 onChange={(val) => {
-                                    setBody({ ...body, idGroup: val })
+                                    onChooseGroup(val)
                                 }}
+
+                                value={body.idGroup}
                             />
                         )
                     }
@@ -112,9 +133,10 @@ export default function CreateDivision() {
                         size="md"
                         required
                         radius={40}
+                        value={body.name}
                         onChange={(val) => { setBody({ ...body, name: val.target.value }) }}
                     />
-                    <Textarea size="md" placeholder="Deskripsi" label="Deskripsi" radius={10} onChange={(val) => { setBody({ ...body, desc: val }) }} />
+                    <Textarea size="md" placeholder="Deskripsi" label="Deskripsi" value={body.desc} radius={10} onChange={(val) => { setBody({ ...body, desc: val.currentTarget.value }) }} />
                     <Box onClick={() => { onToChooseAnggota() }}>
                         <Group
                             justify="space-between"
@@ -124,7 +146,7 @@ export default function CreateDivision() {
                                 borderRadius: 10,
                             }}
                         >
-                            <Text>Tambah Anggota</Text>
+                            <Text>Pilih Anggota</Text>
                             <IoIosArrowDropright size={25} />
                         </Group>
                     </Box>

src/module/division_new/components/detail_division/detail_division.tsx

@@ -9,18 +9,19 @@ import NavbarDetailDivision from '../ui/navbar_detail_division';
 
 export default function DetailDivision() {
   return (
-    <Box>
+    <></>
-      <NavbarDetailDivision />
+    // <Box>
-      <Box p={20}>
+    //   <NavbarDetailDivision />
-        <Stack>
+    //   <Box p={20}>
-          <CarouselDivision />
+    //     <Stack>
-          <FeatureDetailDivision />
+    //       <CarouselDivision />
-          <ListTaskOnDetailDivision />
+    //       <FeatureDetailDivision />
-          <ListDocumentOnDetailDivision />
+    //       <ListTaskOnDetailDivision />
-          <ListDiscussionOnDetailDivision />
+    //       <ListDocumentOnDetailDivision />
-        </Stack>
+    //       <ListDiscussionOnDetailDivision />
-      </Box>
+    //     </Stack>
-    </Box>
+    //   </Box>
+    // </Box>
   );
 }
 

src/module/division_new/components/detail_division/feature_detail_division.tsx

@@ -11,7 +11,7 @@ import { IoCalendarOutline } from "react-icons/io5";
 import { LuFileSignature } from "react-icons/lu";
 import { useRouter } from 'next/navigation';
 
-export default function FeatureDetailDivision() {
+export default function FeatureDetailDivision({ id }: { id: string }) {
   const router = useRouter()
   return (
     <Box pt={10}>
@@ -21,29 +21,29 @@ export default function FeatureDetailDivision() {
         style={{
           alignItems: "center",
           alignContent: "center"
-      }}
+        }}
       >
         <Box bg={'white'} style={{
           border: `1px solid ${WARNA.bgHijauMuda}`,
           borderRadius: 10,
           padding: 10
-        }} onClick={() => router.push('/task')}>
+        }} onClick={() => router.push(id + '/task')}>
           <Grid justify='center' align='center'>
             <Grid.Col span={"auto"}>
-                <ActionIcon variant="filled"
+              <ActionIcon variant="filled"
-                  size={"xl"}
+                size={"xl"}
-                  aria-label="Gradient action icon"
+                aria-label="Gradient action icon"
-                  radius={100}
+                radius={100}
-                  color={WARNA.bgHijauMuda}
+                color={WARNA.bgHijauMuda}
-                >
+              >
-                  <LuClipboardEdit size={25} color={WARNA.biruTua} />
+                <LuClipboardEdit size={25} color={WARNA.biruTua} />
-                </ActionIcon>
+              </ActionIcon>
             </Grid.Col>
-            <Grid.Col span={{base: 7, md: 9}}>
+            <Grid.Col span={{ base: 7, md: 9 }}>
               <Text fz={15} c={WARNA.biruTua} fw={"bold"}>Tugas</Text>
               <Group justify='space-between' align='center'>
                 <Text fz={10} c={"gray"}>23 Tugas</Text>
-                  <IoIosArrowRoundForward size={20} color='gray' />
+                <IoIosArrowRoundForward size={20} color='gray' />
               </Group>
             </Grid.Col>
           </Grid>
@@ -52,23 +52,23 @@ export default function FeatureDetailDivision() {
           border: `1px solid ${WARNA.bgHijauMuda}`,
           borderRadius: 10,
           padding: 10
-        }} onClick={() => router.push('/document')}>
+        }} onClick={() => router.push(id + '/document')}>
           <Grid justify='center' align='center'>
             <Grid.Col span={"auto"}>
-                <ActionIcon variant="filled"
+              <ActionIcon variant="filled"
-                  size={"xl"}
+                size={"xl"}
-                  aria-label="Gradient action icon"
+                aria-label="Gradient action icon"
-                  radius={100}
+                radius={100}
-                  color={WARNA.bgHijauMuda}
+                color={WARNA.bgHijauMuda}
-                >
+              >
-                  <BsFileEarmarkText size={25} color={WARNA.biruTua} />
+                <BsFileEarmarkText size={25} color={WARNA.biruTua} />
-                </ActionIcon>
+              </ActionIcon>
             </Grid.Col>
-            <Grid.Col span={{base: 7, md: 9}}>
+            <Grid.Col span={{ base: 7, md: 9 }}>
               <Text fz={15} c={WARNA.biruTua} fw={"bold"}>Dokumen</Text>
               <Group justify='space-between' align='center'>
                 <Text fz={10} c={"gray"}>23 Tugas</Text>
-                  <IoIosArrowRoundForward size={20} color='gray' />
+                <IoIosArrowRoundForward size={20} color='gray' />
               </Group>
             </Grid.Col>
           </Grid>
@@ -77,23 +77,23 @@ export default function FeatureDetailDivision() {
           border: `1px solid ${WARNA.bgHijauMuda}`,
           borderRadius: 10,
           padding: 10
-        }} onClick={() => router.push('/discussion')}>
+        }} onClick={() => router.push(id + '/discussion')}>
           <Grid justify='center' align='center'>
             <Grid.Col span={"auto"}>
-                <ActionIcon variant="filled"
+              <ActionIcon variant="filled"
-                  size={"xl"}
+                size={"xl"}
-                  aria-label="Gradient action icon"
+                aria-label="Gradient action icon"
-                  radius={100}
+                radius={100}
-                  color={WARNA.bgHijauMuda}
+                color={WARNA.bgHijauMuda}
-                >
+              >
-                  <GoCommentDiscussion size={25} color={WARNA.biruTua} />
+                <GoCommentDiscussion size={25} color={WARNA.biruTua} />
-                </ActionIcon>
+              </ActionIcon>
             </Grid.Col>
-            <Grid.Col span={{base: 7, md: 9}}>
+            <Grid.Col span={{ base: 7, md: 9 }}>
               <Text fz={15} c={WARNA.biruTua} fw={"bold"}>Diskusi</Text>
               <Group justify='space-between' align='center'>
                 <Text fz={10} c={"gray"}>23 Tugas</Text>
-                  <IoIosArrowRoundForward size={20} color='gray' />
+                <IoIosArrowRoundForward size={20} color='gray' />
               </Group>
             </Grid.Col>
           </Grid>
@@ -102,23 +102,23 @@ export default function FeatureDetailDivision() {
           border: `1px solid ${WARNA.bgHijauMuda}`,
           borderRadius: 10,
           padding: 10
-        }} onClick={() => router.push('/calender')}>
+        }} onClick={() => router.push(id + '/calender')}>
           <Grid justify='center' align='center'>
             <Grid.Col span={"auto"}>
-                <ActionIcon variant="filled"
+              <ActionIcon variant="filled"
-                  size={"xl"}
+                size={"xl"}
-                  aria-label="Gradient action icon"
+                aria-label="Gradient action icon"
-                  radius={100}
+                radius={100}
-                  color={WARNA.bgHijauMuda}
+                color={WARNA.bgHijauMuda}
-                >
+              >
-                  <IoCalendarOutline size={25} color={WARNA.biruTua} />
+                <IoCalendarOutline size={25} color={WARNA.biruTua} />
-                </ActionIcon>
+              </ActionIcon>
             </Grid.Col>
-            <Grid.Col span={{base: 7, md: 9}}>
+            <Grid.Col span={{ base: 7, md: 9 }}>
               <Text fz={15} c={WARNA.biruTua} fw={"bold"}>Kalender</Text>
               <Group justify='space-between' align='center'>
                 <Text fz={10} c={"gray"}>23 Tugas</Text>
-                  <IoIosArrowRoundForward size={20} color='gray' />
+                <IoIosArrowRoundForward size={20} color='gray' />
               </Group>
             </Grid.Col>
           </Grid>

src/module/division_new/components/ui/navbar_admin_division.tsx

@@ -1,48 +1,54 @@
 "use client"
-import { LayoutNavbarNew, WARNA } from '@/module/_global';
+import { API_ADDRESS, LayoutNavbarNew, WARNA } from '@/module/_global';
+import { useHookstate } from '@hookstate/core';
 import { Avatar, Box, Button, Checkbox, Divider, Flex, Group, Stack, Text, TextInput } from '@mantine/core';
 import { useRouter } from 'next/navigation';
-import React from 'react';
+import React, { useState } from 'react';
 import { HiMagnifyingGlass } from 'react-icons/hi2';
+import { globalMemberDivision } from '../../lib/val_division';
+import toast from 'react-hot-toast';
 
-const dataUser = [
+export default function NavbarAdminDivision({ data, onSuccess }: { data: any, onSuccess: (val: any) => void }) {
-  {
-    id: 1,
-    img: "https://i.pravatar.cc/1000?img=3",
-    name: "Doni Setiawan",
-  },
-  {
-    id: 2,
-    img: "https://i.pravatar.cc/1000?img=10",
-    name: "Ilham Udin",
-  },
-  {
-    id: 3,
-    img: "https://i.pravatar.cc/1000?img=11",
-    name: "Didin Anang",
-  },
-  {
-    id: 4,
-    img: "https://i.pravatar.cc/1000?img=21",
-    name: "Angga Saputra",
-  },
-  {
-    id: 5,
-    img: "https://i.pravatar.cc/1000?img=32",
-    name: "Marcel Widianto",
-  },
-  {
-    id: 6,
-    img: "https://i.pravatar.cc/1000?img=37",
-    name: "Bagas Nusantara",
-  },
-];
-
-export default function NavbarAdminDivision() {
   const router = useRouter()
+  const member = useHookstate(globalMemberDivision)
+  const [value, setValue] = useState<string[]>([]);
+
+  async function onSubmit() {
+    if (value.length === 0) {
+      return toast.error("Error! Silahkan pilih admin divisi")
+    }
+
+    try {
+      const res = await fetch(API_ADDRESS.apiCreateDivision, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+          data: data,
+          member: member.get(),
+          admin: value
+        })
+      })
+
+      const errorData = await res.json();
+
+      if (res.status == 201) {
+        toast.success('Sukses! data tersimpan')
+        onSuccess(true)
+      } else {
+        toast.error(errorData.message);
+        onSuccess(false)
+      }
+    } catch (error) {
+      toast.error('Error')
+      onSuccess(false)
+    }
+  }
+
   return (
     <Box>
-      <LayoutNavbarNew back="/division/create" title="Pilih Anggota" menu />
+      <LayoutNavbarNew title="Pilih Admin Divisi" menu />
       <Box p={20}>
         <TextInput
           styles={{
@@ -58,27 +64,33 @@ export default function NavbarAdminDivision() {
           placeholder="Pencarian"
         />
         <Box pt={20}>
-          {dataUser.map((v, i) => {
+          <Checkbox.Group value={value} onChange={setValue}>
-            return (
+            {
-              <Box key={i}>
+              (member.length === 0) ? (
-                <Flex
+                <Text c="dimmed" ta={"center"} fs={"italic"}>Belum ada anggota</Text>
-                  justify={"space-between"}
+              ) : member.get().map((v: any, i: any) => {
-                  align={"center"}
+                return (
-                >
+                  <Box key={i}>
-                  <Group>
+                    <Flex
-                    <Avatar src={v.img} alt="it's me" size="lg" />
+                      justify={"space-between"}
-                    <Box>
+                      align={"center"}
-                      <Text c={WARNA.biruTua} fw={"bold"}>
+                    >
-                        {v.name}
+                      <Group>
-                      </Text>
+                        <Avatar src={v.img} alt="it's me" size="lg" />
-                    </Box>
+                        <Box>
-                  </Group>
+                          <Text c={WARNA.biruTua} fw={"bold"}>
-                  <Checkbox />
+                            {v.name}
-                </Flex>
+                          </Text>
-                <Divider my={20} />
+                        </Box>
-              </Box>
+                      </Group>
-            );
+                      <Checkbox value={v.id} />
-          })}
+                    </Flex>
+                    <Divider my={20} />
+                  </Box>
+                );
+              })
+            }
+          </Checkbox.Group>
         </Box>
         <Box mt="xl">
           <Button
@@ -87,7 +99,7 @@ export default function NavbarAdminDivision() {
             size="lg"
             radius={30}
             fullWidth
-            onClick={() => router.push("/division")}
+            onClick={() => { onSubmit() }}
           >
             Simpan
           </Button>

src/module/division_new/components/ui/navbar_create_users.tsx

@@ -9,6 +9,7 @@ import { HiMagnifyingGlass } from 'react-icons/hi2';
 import { globalMemberDivision } from '../../lib/val_division';
 import { TypeUser } from '@/module/user';
 import { funGetUserByCookies } from '@/module/auth';
+import toast from 'react-hot-toast';
 
 const dataUser = [
   {
@@ -46,22 +47,38 @@ const dataUser = [
 
 export default function NavbarCreateUsers({ grup, onClose }: { grup?: string, onClose: (val: any) => void }) {
   const router = useRouter()
-  const [selectedFiles, setSelectedFiles] = useState<Record<number, boolean>>({});
   const member = useHookstate(globalMemberDivision)
+  const [selectedFiles, setSelectedFiles] = useState<any>([]);
   const [dataMember, setDataMember] = useState<TypeUser>([])
 
   const handleFileClick = (index: number) => {
-    setSelectedFiles((prevSelectedFiles) => ({
+    if (selectedFiles.some((i: any) => i.id == dataMember[index].id)) {
-      ...prevSelectedFiles,
+      setSelectedFiles(selectedFiles.filter((i: any) => i.id != dataMember[index].id))
-      [index]: !prevSelectedFiles[index],
+    } else {
-    }));
+      setSelectedFiles([...selectedFiles, dataMember[index]])
+    }
   };
 
+
   async function loadData() {
     const loadMember = await fetch(API_ADDRESS.apiGetAllUser + '&active=true&groupID=' + grup);
     const user = await funGetUserByCookies();
     const hasil = await loadMember.json()
     setDataMember(hasil.filter((i: any) => i.id != user.id))
+
+    // cek data member sebelumnya
+    if (member.length > 0) {
+      setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
+    }
+  }
+
+
+  function onSubmit() {
+    if (selectedFiles.length == 0) {
+      return toast.error("Error! silahkan pilih anggota")
+    }
+    member.set(selectedFiles)
+    onClose(true)
   }
 
   useShallowEffect(() => {
@@ -93,7 +110,7 @@ export default function NavbarCreateUsers({ grup, onClose }: { grup?: string, on
               verticalSpacing={{ base: "md", sm: "xl" }}
             >
               {dataMember.map((v, index) => {
-                const isSelected = selectedFiles[index];
+                const isSelected = selectedFiles.some((i: any) => i.id == dataMember[index].id);
                 return (
                   <Box key={index} mb={10}>
                     <Box
@@ -125,7 +142,7 @@ export default function NavbarCreateUsers({ grup, onClose }: { grup?: string, on
             size="lg"
             radius={30}
             fullWidth
-            onClick={() => { onClose(true) }}
+            onClick={() => { onSubmit() }}
           >
             Simpan
           </Button>

src/module/division_new/components/ui/navbar_detail_division.tsx

@@ -5,11 +5,11 @@ import { useState } from "react";
 import { HiMenu } from "react-icons/hi";
 import DrawerDetailDivision from "./drawer_detail_division";
 
-export default function NavbarDetailDivision() {
+export default function NavbarDetailDivision({ title }: { title: string }) {
    const [openDrawer, setOpenDrawer] = useState(false)
    return (
       <>
-         <LayoutNavbarNew back="" title={"Divisi kemasyarakatan"} menu={
+         <LayoutNavbarNew back="" title={title} menu={
             <ActionIcon variant="light" onClick={() => (setOpenDrawer(true))} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
                <HiMenu size={20} color='white' />
             </ActionIcon>

src/module/division_new/view/view_detail_division.tsx

@@ -1,9 +1,39 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import DetailDivision from '../components/detail_division/detail_division';
+import { Box, Stack } from '@mantine/core';
+import CarouselDivision from '../components/detail_division/carousel_division';
+import FeatureDetailDivision from '../components/detail_division/feature_detail_division';
+import ListDiscussionOnDetailDivision from '../components/detail_division/list_discussion';
+import ListDocumentOnDetailDivision from '../components/detail_division/list_document';
+import ListTaskOnDetailDivision from '../components/detail_division/list_task';
+import NavbarDetailDivision from '../components/ui/navbar_detail_division';
+import { API_ADDRESS } from '@/module/_global';
+
+export default async function ViewDetailDivision({ id }: { id: string }) {
+
+  const res = await fetch(`${process.env.URL + API_ADDRESS.apiGetOneDetailDivision}&divisionId=${id}`);
+  console.log(process.env.URL + API_ADDRESS.apiGetOneDetailDivision+"&divisionId="+id)
+  const data = await res.json();
+
+  console.log('amalia', data);
 
-export default function ViewDetailDivision() {
   return (
-    <DetailDivision />
+    // <DetailDivision />
+    <Box>
+      <NavbarDetailDivision title={
+        // data?.division?.name
+        ""
+        } />
+      <Box p={20}>
+        <Stack>
+          <CarouselDivision />
+          <FeatureDetailDivision id={id}/>
+          <ListTaskOnDetailDivision />
+          <ListDocumentOnDetailDivision />
+          <ListDiscussionOnDetailDivision />
+        </Stack>
+      </Box>
+    </Box>
   );
 }