Merge pull request #358 from bipproduction/join

Join

src/app/(application)/project/[id]/layout.tsx

@@ -0,0 +1,11 @@
+import { WrapLayoutProject } from "@/module/project";
+
+export default async function Layout({ children }: { children: React.ReactNode }) {
+   return (
+      <>
+         <WrapLayoutProject>
+            {children}
+         </WrapLayoutProject>
+      </>
+   );
+}

src/app/api/version-app/route.ts

@@ -2,7 +2,7 @@ import { NextResponse } from "next/server";
 
 export async function GET(request: Request) {
    try {
-      return NextResponse.json({ success: true, version: "0.2.7", tahap: "beta" }, { status: 200 });
+      return NextResponse.json({ success: true, version: "0.2.8", tahap: "beta" }, { status: 200 });
    } catch (error) {
       console.error(error);
       return NextResponse.json({ success: false, version: "Gagal mendapatkan version, coba lagi nanti (error: 500)", reason: (error as Error).message, }, { status: 500 });

src/module/calender/ui/dawer_division_calender.tsx

@@ -1,4 +1,5 @@
-import { TEMA } from '@/module/_global';
+import { globalRole, TEMA } from '@/module/_global';
+import { globalIsMemberDivision } from '@/module/division_new';
 import { useHookstate } from '@hookstate/core';
 import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
 import { useParams } from 'next/navigation';
@@ -7,14 +8,16 @@ import { AiOutlineFileSearch } from 'react-icons/ai';
 import { IoAddCircle } from 'react-icons/io5';
 
 export default function DawerDivisionCalender() {
+  const roleLogin = useHookstate(globalRole)
+  const memberDivision = useHookstate(globalIsMemberDivision)
   const param = useParams<{ id: string }>()
   const tema = useHookstate(TEMA)
   return (
     <Box>
       <Stack pt={10}>
-        <SimpleGrid
+        <SimpleGrid cols={{ base: 2, sm: 3, lg: 3 }}>
-          cols={{ base: 2, sm: 3, lg: 3 }}
+          {
-        >
+            (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></> :
               <Flex onClick={() => window.location.href = `/division/${param.id}/calender/create`} justify={'center'} align={'center'} direction={'column'} >
                 <Box>
                   <IoAddCircle size={30} color={tema.get().utama} />
@@ -23,6 +26,7 @@ export default function DawerDivisionCalender() {
                   <Text ta={"center"} c={tema.get().utama}>Tambah Acara</Text>
                 </Box>
               </Flex>
+          }
           <Flex onClick={() => window.location.href = `/division/${param.id}/calender/history`} justify={'center'} align={'center'} direction={'column'} >
             <Box>
               <AiOutlineFileSearch size={30} color={tema.get().utama} />

src/module/calender/ui/detail_event_division.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { keyWibu, LayoutDrawer, LayoutNavbarNew, SkeletonList, TEMA } from '@/module/_global';
+import { globalRole, keyWibu, LayoutDrawer, LayoutNavbarNew, SkeletonList, TEMA } from '@/module/_global';
 import LayoutModal from '@/module/_global/layout/layout_modal';
 import { useHookstate } from '@hookstate/core';
 import { ActionIcon, Avatar, Box, Center, CopyButton, Divider, Flex, Grid, Group, SimpleGrid, Spoiler, Stack, Text, Tooltip } from '@mantine/core';
@@ -21,6 +21,7 @@ import { funDeleteMemberCalender, funGetOneCalender } from '../lib/api_calender'
 import { IDataDetailByIdCalender, IDataDetailByIdMember } from '../lib/type_calender';
 import DrawerDetailEvent from './drawer_detail_event';
 import SkeletonDetailEvent from './skeleton_detail_event';
+import { globalIsMemberDivision } from '@/module/division_new';
 
 export default function DetailEventDivision() {
   const param = useParams<{ id: string, detail: string }>()
@@ -34,6 +35,8 @@ export default function DetailEventDivision() {
   const router = useRouter()
   const [dataChoose, setDataChoose] = useState({ id: '', name: '' })
   const tema = useHookstate(TEMA)
+  const roleLogin = useHookstate(globalRole)
+  const memberDivision = useHookstate(globalIsMemberDivision)
   const isMobile2 = useMediaQuery("(max-width: 460px)");
   const isMobile = useMediaQuery('(max-width: 369px)');
   const [loadingDelete, setLoadingDelete] = useState(false)
@@ -105,7 +108,10 @@ export default function DetailEventDivision() {
   return (
     <Box>
       <LayoutNavbarNew back={`/division/${param.id}/calender/`} title="Detail Acara"
-        menu={<ActionIcon variant="light" onClick={() => setOpenDrawer(true)} bg={tema.get().bgIcon} size="lg" radius="lg" aria-label="Settings">
+        menu={
+          (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></>
+            :
+            <ActionIcon variant="light" onClick={() => setOpenDrawer(true)} bg={tema.get().bgIcon} size="lg" radius="lg" aria-label="Settings">
               <HiMenu size={20} color='white' />
             </ActionIcon>} />
       <Box p={20}>

src/module/discussion/ui/detail_discussion.tsx

@@ -1,6 +1,6 @@
 "use client"
 import { globalRole, keyWibu, LayoutDrawer, LayoutNavbarNew, TEMA } from "@/module/_global";
-import { globalIsAdminDivision } from "@/module/division_new";
+import { globalIsAdminDivision, globalIsMemberDivision } from "@/module/division_new";
 import { useHookstate } from "@hookstate/core";
 import { ActionIcon, Avatar, Badge, Box, Center, Divider, Flex, Grid, Group, rem, Skeleton, Spoiler, Text, TextInput } from "@mantine/core";
 import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
@@ -28,6 +28,7 @@ export default function DetailDiscussion({ id, idDivision }: { id: string, idDiv
    const [isCreator, setCreator] = useState(false)
    const [isUser, setUser] = useState('')
    const adminLogin = useHookstate(globalIsAdminDivision)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const tema = useHookstate(TEMA)
    const router = useRouter()
    const isMobile = useMediaQuery('(max-width: 369px)');
@@ -323,7 +324,7 @@ export default function DetailDiscussion({ id, idDivision }: { id: string, idDiv
                               }}
                               size="md"
                               placeholder="Kirim Komentar"
-                              disabled={isData?.status === 2}
+                              disabled={(isData?.status === 2 || (!memberDivision.get() && (roleLogin.get() == "user" || roleLogin.get() == "coadmin")))}
                               onChange={(e) => setIsComent(e.target.value)}
                               value={isComent}
                               maxLength={300}
@@ -334,7 +335,7 @@ export default function DetailDiscussion({ id, idDivision }: { id: string, idDiv
                            <Center>
                               <ActionIcon
                                  onClick={sendComent}
-                                 variant="subtle" aria-label="submit" disabled={isData?.status === 2}>
+                                 variant="subtle" aria-label="submit" disabled={(isData?.status === 2 || (!memberDivision.get() && (roleLogin.get() == "user" || roleLogin.get() == "coadmin")))}>
                                  <VscSend size={30} />
                               </ActionIcon>
                            </Center>

src/module/discussion/ui/drawer_detail_discussion.tsx

@@ -91,18 +91,9 @@ export default function DrawerDetailDiscussion({ onSuccess, id, status, idDivisi
          <Stack pt={10}>
             <SimpleGrid
                cols={{ base: 3, sm: 3, lg: 3 }}
-               spacing={{ base: 10, sm: 'xl' }}
+               spacing={{ base: 'xl', sm: 'xl' }}
-               verticalSpacing={{ base: 'md', sm: 'xl' }}
+               verticalSpacing={{ base: 'xl', sm: 'xl' }}
             >
-               <Flex onClick={() => setValModal(true)} justify={'center'} align={'center'} direction={'column'} >
-                  <Box>
-                     <BsTrash3 size={30} color={tema.get().utama} />
-                  </Box>
-                  <Box>
-                     <Text c={tema.get().utama}>Hapus</Text>
-                  </Box>
-               </Flex>
-
                <Flex onClick={() => window.location.href = `/division/${param.id}/discussion/update/${param.detail}`} justify={'center'} align={'center'} direction={'column'} >
                   <Box>
                      <FaPencil size={30} color={tema.get().utama} />
@@ -112,8 +103,7 @@ export default function DrawerDetailDiscussion({ onSuccess, id, status, idDivisi
                   </Box>
                </Flex>
 
-               <Flex onClick={() => setValModalStatus(true)}  >
+               <Flex justify={'center'} align={'center'} direction={'column'} onClick={() => setValModalStatus(true)}  >
-                  <Box>
                      {status === 1 ? (
                         <>
                            <Flex justify={'center'} align={'center'} direction={'column'}>
@@ -134,8 +124,17 @@ export default function DrawerDetailDiscussion({ onSuccess, id, status, idDivisi
                            </Flex>
                         </>
                      )}
+               </Flex>
+
+               <Flex onClick={() => setValModal(true)} justify={'center'} align={'center'} direction={'column'} >
+                  <Box>
+                     <BsTrash3 size={30} color={tema.get().utama} />
+                  </Box>
+                  <Box>
+                     <Text c={tema.get().utama}>Hapus</Text>
                   </Box>
                </Flex>
+
             </SimpleGrid>
          </Stack>
 

src/module/discussion/ui/navbar_list_discussion.tsx

@@ -1,20 +1,25 @@
 'use client'
-import { LayoutNavbarNew, LayoutDrawer, TEMA } from "@/module/_global";
+import { LayoutNavbarNew, LayoutDrawer, TEMA, globalRole } from "@/module/_global";
 import { ActionIcon } from "@mantine/core";
 import { HiMenu } from "react-icons/hi";
 import { useState } from "react";
 import DrawerListDiscussion from "./drawer_list_discussion";
 import { useParams } from "next/navigation";
 import { useHookstate } from "@hookstate/core";
+import { globalIsMemberDivision } from "@/module/division_new";
 
 export default function NavbarListDiscussion() {
    const [openDrawer, setOpenDrawer] = useState(false)
+   const roleLogin = useHookstate(globalRole)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const param = useParams<{ id: string }>()
    const tema = useHookstate(TEMA)
    return (
       <>
          <LayoutNavbarNew back={`/division/${param.id}`} title="Diskusi"
             menu={
+               (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></>
+                  :
                   <ActionIcon variant="light" onClick={() => setOpenDrawer(true)} bg={tema.get().bgIcon} size="lg" radius="lg" aria-label="Settings">
                      <HiMenu size={20} color='white' />
                   </ActionIcon>

src/module/division_new/index.ts

@@ -15,7 +15,7 @@ import EditDivision from './ui/edit_division';
 import CreateReport from './ui/create_report';
 import ReportDivisionId from './ui/report_division_id';
 import { funGetDivisionById, funGetListDivisionByIdDivision, funGetSearchMemberDivision } from './lib/api_division';
-import { globalIsAdminDivision } from './lib/val_division';
+import { globalIsAdminDivision, globalIsMemberDivision } from './lib/val_division';
 import WrapLayoutDivision from './ui/wrap_division';
 import TabListDivision from './ui/tab_list_division';
 import NavbarListDivision from './ui/navbar_list_division';
@@ -39,7 +39,7 @@ export { ReportDivisionId }
 export { funGetDivisionById }
 export { funGetListDivisionByIdDivision }
 export { funGetSearchMemberDivision }
-export { globalIsAdminDivision }
+export { globalIsAdminDivision, globalIsMemberDivision }
 export { WrapLayoutDivision }
 export { TabListDivision }
 export { NavbarListDivision }

src/module/division_new/lib/val_division.ts

@@ -3,3 +3,4 @@ import { IFormMemberDivision } from "./type_division";
 
 export const globalMemberDivision = hookstate<IFormMemberDivision[]>([]);
 export const globalIsAdminDivision = hookstate<boolean>(false)
+export const globalIsMemberDivision = hookstate<boolean>(false)

src/module/division_new/ui/wrap_division.tsx

@@ -1,20 +1,23 @@
 'use client'
 import { useHookstate } from "@hookstate/core";
 import { useShallowEffect } from "@mantine/hooks";
-import { globalIsAdminDivision } from "../lib/val_division";
+import { globalIsAdminDivision, globalIsMemberDivision } from "../lib/val_division";
 import { funGetDivisionById } from "../lib/api_division";
 import { useParams } from "next/navigation";
 import { funGetUserByCookies } from "@/module/auth";
 
 export default function WrapLayoutDivision({ children }: { children: React.ReactNode }) {
    const isAdmin = useHookstate(globalIsAdminDivision)
+   const isMember = useHookstate(globalIsMemberDivision)
    const param = useParams<{ id: string }>()
 
    const getData = async () => {
       const res = await funGetDivisionById(param.id);
       const login = await funGetUserByCookies()
       const cek = res.data.member.some((i: any) => i.idUser == login.id && i.isAdmin == true)
+      const cekMember = res.data.member.some((i: any) => i.idUser == login.id)
       isAdmin.set(cek)
+      isMember.set(cekMember)
    }
 
    useShallowEffect(() => {

src/module/document/ui/navbar_document_division.tsx

@@ -1,7 +1,7 @@
 "use client";
-import { keyWibu, LayoutDrawer, LayoutModalViewFile, LayoutNavbarNew, TEMA, } from "@/module/_global";
+import { globalRole, keyWibu, LayoutDrawer, LayoutModalViewFile, LayoutNavbarNew, TEMA, } from "@/module/_global";
 import LayoutModal from "@/module/_global/layout/layout_modal";
-import { funGetDivisionById } from "@/module/division_new";
+import { funGetDivisionById, globalIsMemberDivision } from "@/module/division_new";
 import { useHookstate } from "@hookstate/core";
 import { ActionIcon, Box, Breadcrumbs, Button, Checkbox, Divider, Flex, Grid, Group, Indicator, Menu, Modal, rem, SimpleGrid, Skeleton, Text, TextInput } from "@mantine/core";
 import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
@@ -27,6 +27,8 @@ import DrawerMore from "./drawer_more";
 import DrawerShareDocument from "./drawer_share_document";
 
 export default function NavbarDocumentDivision() {
+  const roleLogin = useHookstate(globalRole)
+  const memberDivision = useHookstate(globalIsMemberDivision)
   const router = useRouter();
   const param = useParams<{ id: string }>();
   const [isOpenModalView, setOpenModalView] = useState(false);
@@ -497,6 +499,8 @@ export default function NavbarDocumentDivision() {
         back={`/division/${param.id}/`}
         title={name}
         menu={
+          (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></>
+            :
             <ActionIcon
               onClick={() => setOpen(true)}
               variant="light"
@@ -777,6 +781,9 @@ export default function NavbarDocumentDivision() {
                                   <Text fz={10} pl={isMobile2 ? 30 : 25}>{v.updatedAt}</Text>
                                 </Box>
                               </Flex>
+                              {
+                                (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></>
+                                  :
                                   <Checkbox
                                     color={tema.get().utama}
                                     radius="lg"
@@ -784,6 +791,8 @@ export default function NavbarDocumentDivision() {
                                     checked={isSelected}
                                     onChange={() => handleCheckboxChange(i)}
                                   />
+                              }
+
                             </Group>
                           </Grid.Col>
                         </Grid>

src/module/project/index.ts

@@ -14,6 +14,7 @@ import CancelProject from "./ui/cancel_project";
 import AddMemberDetailProject from "./ui/add_member_detail_project";
 import CreateProject from "./ui/create_project";
 import AddFileDetailProject from "./ui/add_file_detail_project";
+import WrapLayoutProject from "./ui/wrap_project";
 
 export { ViewDateEndTask }
 export { CreateUsersProject }
@@ -30,3 +31,4 @@ export { CancelProject }
 export { AddMemberDetailProject }
 export { CreateProject }
 export { AddFileDetailProject }
+export { WrapLayoutProject }

src/module/project/lib/val_project.ts

@@ -3,6 +3,7 @@ import { IFormMemberProject } from "./type_project";
 
 export const globalRefreshProject = hookstate<boolean>(false)
 export const globalMemberProject = hookstate<IFormMemberProject[]>([]);
+export const globalIsMemberProject = hookstate<boolean>(false)
 
 export const valStatusDetailProject = [
     {

src/module/project/ui/list_anggota_detail_project.tsx

@@ -111,7 +111,7 @@ export default function ListAnggotaDetailProject() {
   return (
     <Box pt={20}>
       <Group justify="space-between">
-        <Text c={tema.get().utama}>Anggota Terpilih</Text>
+        <Text fw={'bold'} c={tema.get().utama}>Anggota</Text>
         <Text c={tema.get().utama}>Total {isData.length} Anggota</Text>
       </Group>
       <Box pt={10}>

src/module/project/ui/list_file_detail_project.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { keyWibu, LayoutDrawer, LayoutModalViewFile, TEMA } from '@/module/_global';
+import { globalRole, keyWibu, LayoutDrawer, LayoutModalViewFile, TEMA } from '@/module/_global';
 import LayoutModal from '@/module/_global/layout/layout_modal';
 import { useHookstate } from '@hookstate/core';
 import { Box, Flex, Grid, Group, SimpleGrid, Skeleton, Stack, Text } from '@mantine/core';
@@ -12,6 +12,7 @@ import { FaTrash } from 'react-icons/fa6';
 import { useWibuRealtime } from 'wibu-realtime';
 import { funDeleteFileProject, funGetOneProjectById } from '../lib/api_project';
 import { IDataFileProject } from '../lib/type_project';
+import { globalIsMemberProject } from '../lib/val_project';
 
 export default function ListFileDetailProject() {
   const [isData, setData] = useState<IDataFileProject[]>([])
@@ -26,6 +27,8 @@ export default function ListFileDetailProject() {
   const [isOpenModalView, setOpenModalView] = useState(false)
   const [isExtension, setExtension] = useState('')
   const tema = useHookstate(TEMA)
+  const roleLogin = useHookstate(globalRole)
+  const memberProject = useHookstate(globalIsMemberProject)
   const isMobile = useMediaQuery("(max-width: 350px)");
   const [reason, setReason] = useState("")
   const [dataRealTime, setDataRealtime] = useWibuRealtime({
@@ -212,6 +215,9 @@ export default function ListFileDetailProject() {
                   </Box>
                 </Flex>
 
+                {
+                  (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberProject.get() ? <></>
+                    :
                     <Flex onClick={() => {
                       reason == null ?
                         setOpenModal(true)
@@ -224,6 +230,7 @@ export default function ListFileDetailProject() {
                         <Text c={reason == null ? tema.get().utama : "gray"}>Hapus file</Text>
                       </Box>
                     </Flex>
+                }
               </SimpleGrid>
             </Stack>
           </Box>

src/module/project/ui/list_tugas_detail_project.tsx

@@ -1,8 +1,8 @@
 'use client'
-import { keyWibu, LayoutDrawer, SkeletonDetailListTugasTask, TEMA } from '@/module/_global';
+import { globalRole, keyWibu, LayoutDrawer, SkeletonDetailListTugasTask, TEMA } from '@/module/_global';
 import LayoutModal from '@/module/_global/layout/layout_modal';
 import { useHookstate } from '@hookstate/core';
-import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core';
+import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text, Loader } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { useParams, useRouter } from 'next/navigation';
 import { useState } from 'react';
@@ -12,7 +12,7 @@ import { FaCheck, FaPencil, FaTrash } from 'react-icons/fa6';
 import { useWibuRealtime } from 'wibu-realtime';
 import { funDeleteDetailProject, funGetOneProjectById, funUpdateStatusProject } from '../lib/api_project';
 import { IDataListTaskProject } from '../lib/type_project';
-import { globalRefreshProject, valStatusDetailProject } from '../lib/val_project';
+import { globalIsMemberProject, globalRefreshProject, valStatusDetailProject } from '../lib/val_project';
 
 export default function ListTugasDetailProject() {
   const [isData, setData] = useState<IDataListTaskProject[]>([])
@@ -27,6 +27,10 @@ export default function ListTugasDetailProject() {
   const [loadingDelete, setLoadingDelete] = useState(false)
   const router = useRouter()
   const tema = useHookstate(TEMA)
+  const roleLogin = useHookstate(globalRole)
+  const memberProject = useHookstate(globalIsMemberProject)
+  const [loadingStatus, setLoadingStatus] = useState(false)
+  const [pilihStatus, setPilihStatus] = useState(0)
   const [reason, setReason] = useState("")
   const [dataRealTime, setDataRealtime] = useWibuRealtime({
     WIBU_REALTIME_TOKEN: keyWibu,
@@ -102,6 +106,8 @@ export default function ListTugasDetailProject() {
 
   async function onUpdateStatus(val: number) {
     try {
+      setLoadingStatus(true)
+      setPilihStatus(val)
       const res = await funUpdateStatusProject(idData, { status: val, idProject: param.id });
       if (res.success) {
         setDataRealtime([{
@@ -120,6 +126,8 @@ export default function ListTugasDetailProject() {
     } catch (error) {
       console.error(error);
       toast.error("Gagal update status tugas Kegiatan, coba lagi nanti");
+    } finally {
+      setLoadingStatus(false)
     }
   }
 
@@ -158,11 +166,15 @@ export default function ListTugasDetailProject() {
                   return (
                     <Box key={index}>
                       <Box onClick={() => {
+                        if (!memberProject.get() && ((roleLogin.get() == "user" || roleLogin.get() == "coadmin"))) {
+                          setOpenDrawer(false)
+                        } else {
                           setIdData(item.id)
                           setStatusData(item.status)
                           reason == null ?
                             setOpenDrawer(true)
                             : setOpenDrawer(false)
+                        }
                       }} my={18}>
                         <Checkbox color="teal" size="md" checked={(item.status === 1) ? true : false} disabled
                           label={item.status === 1 ? 'Sudah Selesai' : 'Belum Selesai'}
@@ -275,7 +287,11 @@ export default function ListTugasDetailProject() {
             {
               valStatusDetailProject.map((item, index) => {
                 return (
-                  <Box key={index} onClick={() => { onUpdateStatus(item.value) }}>
+                  <Box key={index} onClick={() => {
+                    if (!loadingStatus) {
+                      onUpdateStatus(item.value)
+                    }
+                  }}>
                     <Flex justify={"space-between"} align={"center"}>
                       <Group>
                         <Text style={{
@@ -294,7 +310,11 @@ export default function ListTugasDetailProject() {
                           paddingLeft: 20,
                         }}
                       >
-                        {statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""}
+                        {
+                          loadingStatus && pilihStatus == item.value ? <Loader color="gray" size="sm" style={{ marginRight: 10 }} />
+                            :
+                            statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""
+                        }
                       </Text>
                     </Flex>
                     <Divider my={20} />

src/module/project/ui/navbar_detail_project.tsx

@@ -12,6 +12,7 @@ import { IoAddCircle } from 'react-icons/io5';
 import { MdCancel } from 'react-icons/md';
 import { useWibuRealtime } from 'wibu-realtime';
 import { funGetOneProjectById } from '../lib/api_project';
+import { globalIsMemberProject } from '../lib/val_project';
 
 export default function NavbarDetailProject() {
   const router = useRouter()
@@ -20,6 +21,7 @@ export default function NavbarDetailProject() {
   const [grup, setGrup] = useState("")
   const [isOpen, setOpen] = useState(false)
   const roleLogin = useHookstate(globalRole)
+  const memberProject = useHookstate(globalIsMemberProject)
   const tema = useHookstate(TEMA)
   const [reason, setReason] = useState("")
   const [dataRealTime, setDataRealtime] = useWibuRealtime({
@@ -57,6 +59,8 @@ export default function NavbarDetailProject() {
   return (
     <>
       <LayoutNavbarNew back={`/project?group=${grup}`} title={name} menu={
+        (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberProject.get() ? <></>
+          :
           <ActionIcon
             variant="light"
             bg={tema.get().bgIcon}

src/module/project/ui/wrap_project.tsx

@@ -0,0 +1,28 @@
+'use client'
+import { useHookstate } from "@hookstate/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { useParams } from "next/navigation";
+import { funGetUserByCookies } from "@/module/auth";
+import { globalIsMemberProject } from "../lib/val_project";
+import { funGetOneProjectById } from "../lib/api_project";
+
+export default function WrapLayoutProject({ children }: { children: React.ReactNode }) {
+   const isMember = useHookstate(globalIsMemberProject)
+   const param = useParams<{ id: string }>()
+
+   const getData = async () => {
+      const res = await funGetOneProjectById(param.id, 'member');
+      const login = await funGetUserByCookies()
+      const cekMember = res.data.some((i: any) => i.idUser == login.id)
+      isMember.set(cekMember)
+   }
+
+   useShallowEffect(() => {
+      getData()
+   }, [])
+   return (
+      <>
+         {children}
+      </>
+   );
+}

src/module/task/ui/detail_list_anggota_task.tsx

@@ -114,7 +114,7 @@ export default function ListAnggotaDetailTask() {
    return (
       <Box pt={20}>
          <Group justify="space-between">
-            <Text c={tema.get().utama}>Anggota Terpilih</Text>
+            <Text fw={'bold'} c={tema.get().utama}>Anggota</Text>
             <Text c={tema.get().utama}>Total {isData.length} Anggota</Text>
          </Group>
          <Box pt={10}>

src/module/task/ui/detail_list_file_task.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { keyWibu, LayoutDrawer, LayoutModalViewFile, TEMA } from "@/module/_global";
+import { globalRole, keyWibu, LayoutDrawer, LayoutModalViewFile, TEMA } from "@/module/_global";
 import LayoutModal from "@/module/_global/layout/layout_modal";
 import { useHookstate } from "@hookstate/core";
 import { Box, Center, Flex, Grid, Group, SimpleGrid, Skeleton, Stack, Text } from "@mantine/core";
@@ -12,8 +12,11 @@ import { FaTrash } from "react-icons/fa6";
 import { useWibuRealtime } from "wibu-realtime";
 import { funDeleteFileTask, funGetTaskDivisionById } from "../lib/api_task";
 import { IDataFileTaskDivision } from "../lib/type_task";
+import { globalIsMemberDivision } from "@/module/division_new";
 
 export default function ListFileDetailTask() {
+   const roleLogin = useHookstate(globalRole)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const [isData, setData] = useState<IDataFileTaskDivision[]>([])
    const [loading, setLoading] = useState(true)
    const param = useParams<{ id: string, detail: string }>()
@@ -193,7 +196,9 @@ export default function ListFileDetailTask() {
                            <Text c={tema.get().utama}>Lihat file</Text>
                         </Box>
                      </Flex>
-
+                     {
+                        (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></>
+                           :
                            <Flex onClick={() => {
                               reason == null ?
                                  setOpenModal(true)
@@ -206,6 +211,7 @@ export default function ListFileDetailTask() {
                                  <Text c={reason == null ? tema.get().utama : "gray"}>Hapus file</Text>
                               </Box>
                            </Flex>
+                     }
                   </SimpleGrid>
                </Stack>
             </Box>

src/module/task/ui/detail_list_tugas_task.tsx

@@ -1,8 +1,8 @@
 'use client'
-import { keyWibu, LayoutDrawer, SkeletonDetailListTugasTask, TEMA } from "@/module/_global"
+import { globalRole, keyWibu, LayoutDrawer, SkeletonDetailListTugasTask, TEMA } from "@/module/_global"
 import LayoutModal from "@/module/_global/layout/layout_modal"
 import { useHookstate } from "@hookstate/core"
-import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from "@mantine/core"
+import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text, Loader } from "@mantine/core"
 import { useShallowEffect } from "@mantine/hooks"
 import "moment/locale/id"
 import { useParams, useRouter } from "next/navigation"
@@ -14,8 +14,11 @@ import { useWibuRealtime } from "wibu-realtime"
 import { funDeleteDetailTask, funGetTaskDivisionById, funUpdateStatusDetailTask } from "../lib/api_task"
 import { IDataListTaskDivision } from "../lib/type_task"
 import { globalRefreshTask, valStatusDetailTask } from "../lib/val_task"
+import { globalIsMemberDivision } from "@/module/division_new"
 
 export default function ListTugasDetailTask() {
+   const roleLogin = useHookstate(globalRole)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const [openDrawer, setOpenDrawer] = useState(false)
    const [openDrawerStatus, setOpenDrawerStatus] = useState(false)
    const [isOpenModal, setOpenModal] = useState(false)
@@ -29,6 +32,8 @@ export default function ListTugasDetailTask() {
    const refresh = useHookstate(globalRefreshTask)
    const tema = useHookstate(TEMA)
    const [reason, setReason] = useState("")
+   const [loadingStatus, setLoadingStatus] = useState(false)
+   const [pilihStatus, setPilihStatus] = useState(0)
    const [dataRealTime, setDataRealtime] = useWibuRealtime({
       WIBU_REALTIME_TOKEN: keyWibu,
       project: "sdm"
@@ -105,6 +110,8 @@ export default function ListTugasDetailTask() {
 
    async function onUpdateStatus(val: number) {
       try {
+         setPilihStatus(val)
+         setLoadingStatus(true)
          const res = await funUpdateStatusDetailTask(idData, { status: val, idProject: param.detail });
          if (res.success) {
             setDataRealtime([{
@@ -123,6 +130,9 @@ export default function ListTugasDetailTask() {
       } catch (error) {
          console.error(error);
          toast.error("Gagal mengubah status tugas divisi, coba lagi nanti");
+      } finally {
+         setLoadingStatus(false)
+         setOpenModal(false)
       }
    }
 
@@ -162,11 +172,15 @@ export default function ListTugasDetailTask() {
                         return (
                            <Box key={index}>
                               <Box onClick={() => {
+                                 if ((roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get()) {
+                                    setOpenDrawer(false)
+                                 } else {
                                     setIdData(item.id)
                                     setStatusData(item.status)
                                     reason == null ?
                                        setOpenDrawer(true)
                                        : setOpenDrawer(false)
+                                 }
                               }} my={18}>
                                  <Checkbox color="teal" size="md" checked={(item.status === 1) ? true : false} disabled
                                     label={item.status === 1 ? 'Sudah Selesai' : 'Belum Selesai'}
@@ -283,7 +297,11 @@ export default function ListTugasDetailTask() {
                {
                   valStatusDetailTask.map((item, index) => {
                      return (
-                        <Box key={index} onClick={() => { onUpdateStatus(item.value) }}>
+                        <Box key={index} onClick={() => {
+                           if (!loadingStatus) {
+                              onUpdateStatus(item.value)
+                           }
+                        }}>
                            <Flex justify={"space-between"} align={"center"}>
                               <Group>
                                  <Text style={{
@@ -302,7 +320,11 @@ export default function ListTugasDetailTask() {
                                     paddingLeft: 20,
                                  }}
                               >
-                                 {statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""}
+                                 {
+                                    loadingStatus && pilihStatus == item.value ? <Loader color="gray" size="sm" style={{ marginRight: 10 }} />
+                                       :
+                                       statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""
+                                 }
                               </Text>
                            </Flex>
                            <Divider my={20} />

src/module/task/ui/navbar_detail_division_task.tsx

@@ -1,6 +1,6 @@
 'use client'
 import { globalRole, keyWibu, LayoutDrawer, LayoutNavbarNew, TEMA } from "@/module/_global";
-import { globalIsAdminDivision } from "@/module/division_new";
+import { globalIsAdminDivision, globalIsMemberDivision } from "@/module/division_new";
 import { useHookstate } from "@hookstate/core";
 import { ActionIcon, Box, Flex, SimpleGrid, Stack, Text } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
@@ -21,6 +21,7 @@ export default function NavbarDetailDivisionTask() {
    const [isOpen, setOpen] = useState(false)
    const roleLogin = useHookstate(globalRole)
    const adminLogin = useHookstate(globalIsAdminDivision)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const tema = useHookstate(TEMA)
    const [reason, setReason] = useState("")
    const [dataRealTime, setDataRealtime] = useWibuRealtime({
@@ -58,6 +59,7 @@ export default function NavbarDetailDivisionTask() {
    return (
       <>
          <LayoutNavbarNew back={`/division/${param.id}/task/`} title={name} menu={
+            ((roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get()) ? <></> :
                <ActionIcon
                   variant="light"
                   bg={tema.get().bgIcon}