feat : update announcement

api.http

@@ -175,17 +175,13 @@ Content-Type: application/json
    
     "title": "cobaannouncement1 dsdsd",
     "desc": "coba announcement sdsdsd",
-    "idVillage": "121212",
-    "createBy": "111",
+    "idVillage": "desa1",
+    "createBy": "superAdminLukman",
     "groups": [
     {
-      "idGroup": "1",
+      "idGroup": "group1",
       "idDivision": "1"
     },
-    {
-      "idGroup": "1",
-      "idDivision": "2"
-    }
   ]
 }
 
@@ -196,7 +192,7 @@ GET http://localhost:3000/api/announcement/get?path=get-all-announcement HTTP/1.
 GET http://localhost:3000/api/announcement/get?path=get-all-announcement&divisionI=1 HTTP/1.1
 
 ###
-GET http://localhost:3000/api/announcement/get?path=get-one-announcement&announcementId=clz6kqzvt000eb3mle1nyz6fd HTTP/1.1
+GET http://localhost:3000/api/announcement/get?path=get-one-announcement&announcementId=1 HTTP/1.1
 
 ###
 POST http://localhost:3000/api/announcement/post?path=update-announcement HTTP/1.1

src/module/announcement/api/get/getOneAnnouncement.ts

@@ -1,4 +1,5 @@
 import { prisma } from "@/module/_global";
+import _ from "lodash";
 import { NextRequest } from "next/server";
 
 export async function getOneAnnouncement(req: NextRequest) {
@@ -23,10 +24,20 @@ export async function getOneAnnouncement(req: NextRequest) {
         idAnnouncement: true,
         idGroup: true,
         idDivision: true,
+        Group: {
+          select: {
+            name: true,
+          },
+        },
       },
     });
 
-    return Response.json({ announcement, announcementMember });
+    const allAnnouncementMember = announcementMember.map((v: any) => ({
+      ..._.omit(v, ["Group"]),
+      group: v.Group.name,
+    }))
+
+    return Response.json({ announcement, allAnnouncementMember });
   } catch (error) {
     console.error(error);
     return Response.json(

src/module/announcement/component/create_announcement.tsx

@@ -1,10 +1,11 @@
 'use client'
 import { WARNA } from "@/module/_global";
 import LayoutModal from "@/module/_global/layout/layout_modal";
-import { Box, Button, Stack, Textarea, TextInput } from "@mantine/core";
+import { Box, Button, Group, Stack, Text, Textarea, TextInput } from "@mantine/core";
 import { useState } from "react";
 import toast from "react-hot-toast";
 import { HiOutlineChevronRight } from "react-icons/hi2";
+import { IoIosArrowForward } from "react-icons/io";
 
 export default function CreateAnnouncement() {
    const [isOpen, setOpen] = useState(false)
@@ -19,14 +20,10 @@ export default function CreateAnnouncement() {
    return (
       <Box>
          <Stack
-            align="center"
-            justify="center"
-            gap="xs"
-            pt={30}
-            px={20}
+            p={20}
          >
             <TextInput
-               size="md" type="text" radius={30} placeholder="Judul Pengumuman" withAsterisk label="Judul" w={"100%"}
+               size="md" type="text" radius={10} placeholder="Judul Pengumuman" withAsterisk label="Judul" w={"100%"}
                styles={{
                   input: {
                      color: WARNA.biruTua,
@@ -37,7 +34,7 @@ export default function CreateAnnouncement() {
             />
             <Textarea
                size="md"
-               radius={20}
+               radius={10}
                w={"100%"}
                label="Pengumuman"
                withAsterisk
@@ -50,10 +47,18 @@ export default function CreateAnnouncement() {
                   },
                }}
             />
-
-            <Button rightSection={<HiOutlineChevronRight size={14} />} variant="default" fullWidth radius={30} size="md" mt={10}>
-               Pilih Anggota
-            </Button>
+            <Box pt={10}>
+               <Group justify="space-between" style={{
+                  border: `1px solid ${WARNA.biruTua}`,
+                  padding: 10,
+                  borderRadius: 10
+               }}>
+                  <Text size="sm">
+                     Tambah Anggota
+                  </Text>
+                  <IoIosArrowForward />
+               </Group>
+            </Box>
          </Stack>
          <Box mt={30} mx={20}>
             <Button

src/module/announcement/component/detail_announcement.tsx

@@ -1,37 +1,80 @@
-import { Box, Group, Stack, Text } from "@mantine/core";
+"use client"
+import { API_ADDRESS } from "@/module/_global";
+import { Box, Flex, Grid, Group, Spoiler, Stack, Text } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { useState } from "react";
 import { BsCardText } from "react-icons/bs";
 import { TfiAnnouncement } from "react-icons/tfi";
 
-export default function DetailAnnouncement() {
+export interface RootAll {
+   announcement: Announcement
+   allAnnouncementMember: AllAnnouncementMember[]
+}
+
+export interface Announcement {
+   id: string
+   title: string
+   desc: string
+}
+
+export interface AllAnnouncementMember {
+   idAnnouncement: string
+   idGroup: string
+   idDivision: string
+   group: string
+}
+
+
+export default function DetailAnnouncement({ id }: { id: string }) {
+   const [isData, setIsData] = useState<RootAll>()
+
+   async function fetchOneAnnouncement() {
+      try {
+         const res = await fetch(`${API_ADDRESS.apiGetOneAnnouncement}&announcementId=${id}`)
+         const data = await res.json()
+         setIsData(data)
+      } catch (error) {
+         console.error(error)
+         throw new Error("Error")
+      }
+   }
+
+   useShallowEffect(() => {
+      fetchOneAnnouncement()
+   }, [])
+
    return (
       <Box py={30} px={20}>
          <Box p={20} style={{ borderRadius: 10, border: '1px solid #E5E5E5' }} bg={'white'} >
             <Stack>
                <Group>
                   <TfiAnnouncement size={25} />
-                  <Text fw={'bold'}>Pengumuman Dinas</Text>
-               </Group>
-               <Group>
-                  <BsCardText size={25} />
-                  <Text>Pengumuman agar menggunakan</Text>
+                  <Text fw={'bold'}>{isData?.announcement.title}</Text>
                </Group>
+               <Grid gutter={'md'}>
+                  <Grid.Col span={1}>
+                     <BsCardText size={25} />
+                  </Grid.Col>
+                  <Grid.Col span={11}>
+                     <Spoiler maxHeight={100} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
+                        <Text>{isData?.announcement.desc}</Text>
+                     </Spoiler>
+                  </Grid.Col>
+               </Grid>
             </Stack>
          </Box>
          <Box my={15} p={20} style={{ borderRadius: 10, border: '1px solid #E5E5E5' }} bg={'white'} >
-            <Stack>
-               <Text fw={'bold'}>Anggota</Text>
-               <Group>
-                  <Text>LPD</Text>
-               </Group>
-               <Group>
-                  <Text>PKK</Text>
-               </Group>
-               <Group>
-                  <Text>Karang Taruna</Text>
-               </Group>
-            </Stack>
+            {isData?.allAnnouncementMember.map((v, i) => {
+               return (
+                  <Stack key={i}>
+                     <Text fw={'bold'}>Anggota</Text>
+                     <Flex direction={"column"} gap={10}>
+                        <Text>{v.group}</Text>
+                     </Flex>
+                  </Stack>
+               )
+            })}
          </Box>
       </Box>
-
    )
 }

src/module/announcement/view/view_detail_anouncement.tsx

@@ -6,7 +6,7 @@ export default function ViewDetailAnnouncement({ data }: { data: string }) {
    return (
       <Box>
          <NavbarDetailAnnouncement />
-         <DetailAnnouncement />
+         <DetailAnnouncement id={data} />
       </Box>
    )
 }

src/module/position/api/get/getAllPosition.ts

@@ -12,7 +12,6 @@ export async function getAllPosition(req: NextRequest) {
     const active = searchParams.get('active');
     const name = searchParams.get('name')
     const user = await funGetUserByCookies()
-    console.log(groupID)
 
     if (groupID == "null") {
       grupFix = user.idGroup