Merge pull request #339 from bipproduction/join

Join

src/app/api/document/more/route.ts

@@ -2,7 +2,9 @@ import { DIR, funCopyFile, prisma } from "@/module/_global";
 import { funGetUserByCookies } from "@/module/auth";
 import { createLogUser } from "@/module/user";
 import _ from "lodash";
+import moment from "moment";
 import { NextResponse } from "next/server";
+import "moment/locale/id";
 
 
 // MOVE ITEM
@@ -200,3 +202,92 @@ export async function DELETE(request: Request) {
       return NextResponse.json({ success: false, message: "Gagal membagikan item, coba lagi nanti (error: 500)", reason: (error as Error).message, }, { status: 500 });
    }
 };
+
+// GET INFO ITEM
+export async function GET(request: Request) {
+   try {
+      const user = await funGetUserByCookies()
+      if (user.id == undefined) {
+         return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
+      }
+
+
+      const { searchParams } = new URL(request.url);
+      const idItem = searchParams.get("item");
+
+      const cekItem = await prisma.divisionDocumentFolderFile.count({
+         where: {
+            id: String(idItem),
+         }
+      })
+
+      if (cekItem == 0) {
+         return NextResponse.json({ success: false, message: "Gagal mendapatkan dokumen, data tidak ditemukan" }, { status: 404 });
+      }
+
+      const data = await prisma.divisionDocumentFolderFile.findUnique({
+         where: {
+            id: String(idItem),
+         },
+         select: {
+            category: true,
+            name: true,
+            extension: true,
+            createdAt: true,
+            path: true,
+            Division: {
+               select: {
+                  name: true
+               }
+            },
+            User: {
+               select: {
+                  name: true
+               }
+            }
+         }
+      })
+
+      const dataPath = await prisma.divisionDocumentFolderFile.findUnique({
+         where: {
+            id: data?.path
+         }
+      })
+
+      const share = await prisma.divisionDocumentShare.findMany({
+         where: {
+            idDocument: String(idItem),
+            isActive: true
+         },
+         select: {
+            Division: {
+               select: {
+                  name: true
+               }
+            }
+         }
+      })
+
+
+      const dataUtama = {
+         category: data?.category,
+         name: data?.name,
+         extension: data?.extension,
+         createdAt: moment(data?.createdAt).format('DD MMMM YYYY'),
+         path: (dataPath?.name !== undefined && dataPath?.name !== null && dataPath?.name !== '') ? dataPath.name : "home",
+         division: data?.Division?.name,
+         createdBy: data?.User?.name
+      }
+
+      const dataShare = share.map((v: any) => ({
+         ..._.omit(v, ["Division"]),
+         division: v.Division.name
+      }))
+
+      return NextResponse.json({ success: true, message: "Berhasil mendapatkan item", data: dataUtama, share: dataShare }, { status: 200 });
+
+   } catch (error) {
+      console.error(error);
+      return NextResponse.json({ success: false, message: "Gagal mendapatkan item, coba lagi nanti (error: 500)", reason: (error as Error).message, }, { status: 500 });
+   }
+}

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.1", mode: "staging" }, { status: 200 });
+      return NextResponse.json({ success: true, version: "0.2.2", mode: "staging" }, { 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/document/lib/api_document.ts

@@ -79,6 +79,11 @@ export const funShareDocument = async (data: IShareDocument) => {
    return await response.json().catch(() => null);
 };
 
+export const funGetInfoDocument = async (path?: string) => {
+   const response = await fetch(`/api/document/more${(path) ? path : ''}`);
+   return await response.json().catch(() => null);
+};
+
 export const funUploadFileDocument = async (data: FormData) => {
    const response = await fetch(`/api/document/upload`, {
       method: "POST",

src/module/document/lib/type_document.ts

@@ -11,6 +11,20 @@ export interface IDataDocument {
    updatedAt: string;
 }
 
+export interface IInfoDocument {
+   id: string;
+   path: string;
+   name: string;
+   extension: string;
+   category: string;
+   division: string;
+   createdBy: string;
+   createdAt: string;
+}
+
+export interface IInfoShare {
+   division: string
+}
 
 export interface IFormFolder {
    name: string;

src/module/document/ui/drawer_info_document.tsx

@@ -0,0 +1,196 @@
+import { SkeletonDetailProfile } from "@/module/_global";
+import { Accordion, Box, Divider, Grid, Group, List, ScrollArea, Skeleton, Stack, Text } from "@mantine/core";
+import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
+import _ from "lodash";
+import { useState } from "react";
+import toast from "react-hot-toast";
+import { CiCalendarDate } from "react-icons/ci";
+import { FcDocument, FcFolder, FcImageFile } from "react-icons/fc";
+import { GrLocationPin } from "react-icons/gr";
+import { HiOutlineDocumentText } from "react-icons/hi2";
+import { MdOutlineCategory } from "react-icons/md";
+import { PiUsersThree } from "react-icons/pi";
+import { TbLockAccess } from "react-icons/tb";
+import { funGetInfoDocument } from "../lib/api_document";
+import { IFormDetailMoreItem, IInfoDocument, IInfoShare } from "../lib/type_document";
+
+export default function DrawerInfoDocument({ data }: { data: IFormDetailMoreItem[] }) {
+   const [dataInfo, setDataInfo] = useState<IInfoDocument>();
+   const [dataShare, setDataShare] = useState<IInfoShare[]>([])
+   const [loading, setLoading] = useState(true);
+   const isMobile = useMediaQuery("(max-width: 369px)");
+
+
+   async function getOneData(loading: boolean) {
+      try {
+         setLoading(loading);
+         const respon = await funGetInfoDocument("?item=" + data[0].id);
+         if (respon.success) {
+            setDataInfo(respon.data);
+            setDataShare(respon.share)
+         } else {
+            toast.error(respon.message);
+         }
+      } catch (error) {
+         console.error(error);
+         toast.error("Gagal mendapatkan item, coba lagi nanti");
+      } finally {
+         setLoading(false);
+      }
+   }
+
+   useShallowEffect(() => {
+      getOneData(true);
+   }, []);
+
+   return (
+      <Box>
+         <Box pb={60}>
+            <Box>
+               <Stack
+                  align="center"
+                  justify="center"
+                  gap="xs"
+               >
+                  {loading ? <Skeleton height={100} radius={"10"} width={100} /> :
+                     dataInfo?.category == "FOLDER"
+                        ? (<FcFolder size={isMobile ? 80 : 100} />)
+                        : dataInfo?.extension == "pdf" || dataInfo?.extension == "csv"
+                           ? (<FcDocument size={isMobile ? 80 : 100} />)
+                           : (<FcImageFile size={isMobile ? 80 : 100} />)
+                  }
+               </Stack>
+            </Box>
+            <ScrollArea
+               h={{
+                  base: "55vh",
+                  xl: "56vh",
+                  md: "56vh",
+                  sm: "56vh",
+               }}
+               type="scroll"
+               scrollbarSize={2}
+               scrollHideDelay={0}
+               scrollbars="y"
+            >
+               {loading ? (
+                  <SkeletonDetailProfile />
+               ) : (
+                  <Stack py={20}>
+                     <Grid>
+                        <Grid.Col span={6}>
+                           <Group>
+                              {
+                                 !isMobile ?
+                                    <HiOutlineDocumentText size={25} />
+                                    : ''
+                              }
+                              <Text fz={15}>Nama Dokumen</Text>
+                           </Group>
+                        </Grid.Col>
+                        <Grid.Col span={6}>
+                           <Text lineClamp={1} fz={15} ta={"right"}>{dataInfo?.category == "FOLDER" ? dataInfo?.name : dataInfo?.name + '.' + dataInfo?.extension}</Text>
+                        </Grid.Col>
+                     </Grid>
+                     <Divider size="xs" />
+                     <Grid>
+                        <Grid.Col span={5}>
+                           <Group>
+                              {
+                                 !isMobile ?
+                                    <MdOutlineCategory size={25} />
+                                    : ''
+                              }
+                              <Text fz={15}>Tipe</Text>
+                           </Group>
+                        </Grid.Col>
+                        <Grid.Col span={7}>
+                           <Text fz={15} ta={"right"}>{_.lowerCase(dataInfo?.category)}</Text>
+                        </Grid.Col>
+                     </Grid>
+                     <Divider size="xs" />
+                     <Grid>
+                        <Grid.Col span={4}>
+                           <Group>
+                              {
+                                 !isMobile ?
+                                    <GrLocationPin size={25} />
+                                    : ''
+                              }
+                              <Text fz={15}>Lokasi</Text>
+                           </Group>
+                        </Grid.Col>
+                        <Grid.Col span={8}>
+                           <Text lineClamp={1} fz={15} ta={"right"}>{dataInfo?.path}</Text>
+                        </Grid.Col>
+                     </Grid>
+                     <Divider size="xs" />
+                     <Grid>
+                        <Grid.Col span={4}>
+                           <Group>
+                              {
+                                 !isMobile ?
+                                    <PiUsersThree size={25} />
+                                    : ''
+                              }
+                              <Text fz={15}>Pemilik</Text>
+                           </Group>
+                        </Grid.Col>
+                        <Grid.Col span={8}>
+                           <Text lineClamp={1} fz={15} ta={"right"}> {dataInfo?.division} </Text>
+                        </Grid.Col>
+                     </Grid>
+                     <Divider size="xs" />
+                     <Grid>
+                        <Grid.Col span={6}>
+                           <Group>
+                              {
+                                 !isMobile ?
+                                    <CiCalendarDate size={25} />
+                                    : ''
+                              }
+                              <Text fz={15}>Tanggal Dibuat</Text>
+                           </Group>
+                        </Grid.Col>
+                        <Grid.Col span={6}>
+                           <Text fz={15} ta={"right"}>
+                              {dataInfo?.createdAt}
+                           </Text>
+                        </Grid.Col>
+                     </Grid>
+                     <Divider size="xs" />
+                     <Accordion p={0} mt={-15}>
+                        <Accordion.Item value="share" p={0}>
+                           <Accordion.Control p={0} icon={
+                              !isMobile ?
+                                 <TbLockAccess size={25} />
+                                 : ''
+                           } fz={15}>Yang Memiliki Akses</Accordion.Control>
+                           <Accordion.Panel>
+                              <List
+                                 spacing="xs"
+                                 size="sm"
+                                 center
+                                 icon={
+                                    <PiUsersThree size={20} />
+                                 }
+                              >
+                                 <List.Item>{dataInfo?.division}</List.Item>
+                                 {
+                                    dataShare.map((i: any) => {
+                                       return (
+                                          <List.Item key={i.id}>{i.division}</List.Item>
+                                       )
+                                    })
+                                 }
+                              </List>
+                           </Accordion.Panel>
+                        </Accordion.Item>
+                     </Accordion>
+                  </Stack>
+               )}
+            </ScrollArea>
+         </Box>
+      </Box>
+   );
+}

src/module/document/ui/drawer_more.tsx

@@ -5,14 +5,15 @@ import { useShallowEffect } from "@mantine/hooks";
 import { useParams, useSearchParams } from "next/navigation";
 import { useState } from "react";
 import toast from "react-hot-toast";
-import { LuFolders, LuFolderSymlink } from "react-icons/lu";
+import { LuFolders, LuFolderSymlink, LuInfo } from "react-icons/lu";
 import { useWibuRealtime } from "wibu-realtime";
 import { funCopyDocument, funMoveDocument } from "../lib/api_document";
 import { IDataDocument } from "../lib/type_document";
 import { globalRefreshDocument } from "../lib/val_document";
 import DrawerCutDocuments from "./drawer_cut_documents";
+import DrawerInfoDocument from "./drawer_info_document";
 
-export default function DrawerMore({ data }: { data: IDataDocument[] }) {
+export default function DrawerMore({ data, share }: { data: IDataDocument[], share: boolean }) {
   const [isCut, setIsCut] = useState(false)
   const [isCopy, setIsCopy] = useState(false)
   const refresh = useHookstate(globalRefreshDocument)
@@ -27,6 +28,8 @@ export default function DrawerMore({ data }: { data: IDataDocument[] }) {
   })
   const searchParams = useSearchParams()
   const pathAwal = searchParams.get('path')
+  const [nFileSelected, setNFileSelected] = useState(0)
+  const [isInfo, setIsInfo] = useState(false)
 
 
   async function onMoveItem(path: string) {
@@ -86,6 +89,7 @@ export default function DrawerMore({ data }: { data: IDataDocument[] }) {
   function cekFileSelected() {
     const cek = data.some((i: any) => i.category == "FOLDER")
     setForbidCopy(cek)
+    setNFileSelected(data.length)
   }
 
   useShallowEffect(() => {
@@ -100,14 +104,17 @@ export default function DrawerMore({ data }: { data: IDataDocument[] }) {
         <SimpleGrid
           cols={{ base: 3, sm: 3, lg: 3 }}
         >
-          <Flex onClick={() => setIsCut(true)} justify={'center'} align={'center'} direction={'column'} >
+          {
-            <Box>
+            !share &&
-              <LuFolderSymlink size={30} color={tema.get().utama} />
+            <Flex onClick={() => setIsCut(true)} justify={'center'} align={'center'} direction={'column'} >
-            </Box>
+              <Box>
-            <Box>
+                <LuFolderSymlink size={30} color={tema.get().utama} />
-              <Text c={tema.get().utama}>Pindah</Text>
+              </Box>
-            </Box>
+              <Box>
-          </Flex>
+                <Text c={tema.get().utama}>Pindah</Text>
+              </Box>
+            </Flex>
+          }
           {
             (!forbidCopy) &&
             <Flex onClick={() => setIsCopy(true)} justify={'center'} align={'center'} direction={'column'} >
@@ -119,6 +126,17 @@ export default function DrawerMore({ data }: { data: IDataDocument[] }) {
               </Box>
             </Flex>
           }
+          {
+            (nFileSelected == 1) &&
+            <Flex onClick={() => setIsInfo(true)} justify={'center'} align={'center'} direction={'column'} >
+              <Box>
+                <LuInfo size={30} color={tema.get().utama} />
+              </Box>
+              <Box>
+                <Text c={tema.get().utama}>Informasi</Text>
+              </Box>
+            </Flex>
+          }
         </SimpleGrid>
       </Stack>
 
@@ -130,6 +148,10 @@ export default function DrawerMore({ data }: { data: IDataDocument[] }) {
       <LayoutDrawer opened={isCopy} onClose={() => setIsCopy(false)} title={'Pilih Lokasi Salin'} size="lg">
         <DrawerCutDocuments data={data} loadingAction={loadingCopy} onChoosePath={(val) => { onCopyItem(val) }} category="copy" />
       </LayoutDrawer>
+
+      <LayoutDrawer opened={isInfo} onClose={() => setIsInfo(false)} title={'Informasi Dokumen'} size="lg">
+        <DrawerInfoDocument data={data} />
+      </LayoutDrawer>
     </Box>
   );
 }

src/module/document/ui/navbar_document_division.tsx

@@ -461,7 +461,7 @@ export default function NavbarDocumentDivision() {
                     variant="subtle"
                     aria-label="share"
                     onClick={
-                      selectedFiles.length > 0 && !shareSelected
+                      (selectedFiles.length == 1) || (selectedFiles.length > 0 && !shareSelected)
                         ? () => setMore(true)
                         : undefined
                     }
@@ -469,7 +469,7 @@ export default function NavbarDocumentDivision() {
                     <MdOutlineMoreHoriz
                       size={20}
                       color={
-                        selectedFiles.length > 0 && !shareSelected
+                        (selectedFiles.length == 1) || (selectedFiles.length > 0 && !shareSelected)
                           ? "white"
                           : "#656060"
                       }
@@ -479,7 +479,7 @@ export default function NavbarDocumentDivision() {
                     fz={12}
                     ta={"center"}
                     c={
-                      selectedFiles.length > 0 && !shareSelected
+                      (selectedFiles.length == 1) || (selectedFiles.length > 0 && !shareSelected)
                         ? "white"
                         : "#656060"
                     }
@@ -891,7 +891,7 @@ export default function NavbarDocumentDivision() {
       </LayoutDrawer>
 
       <LayoutDrawer opened={more} title={""} onClose={() => setMore(false)}>
-        <DrawerMore data={selectedFiles} />
+        <DrawerMore data={selectedFiles} share={shareSelected} />
       </LayoutDrawer>
 
       <LayoutModalViewFile