upd: search

deskripsi:
- cek search
- img profile
- link sesuai fitur
- pembatasan sesuai role

No Issues

src/app/api/home/search/route.ts

@@ -4,12 +4,13 @@
 
 import { prisma } from "@/module/_global";
 import { funGetUserByCookies } from "@/module/auth";
+import _ from "lodash";
 import { NextResponse } from "next/server";
 
 export async function GET(request: Request) {
     try {
-        const { searchParams } = new URL(request.url);
+        const { searchParams } = new URL(request.url)
-        const search = searchParams.get("search");
+        const search = searchParams.get("search")
         const userId = await funGetUserByCookies()
         if (userId.id == undefined) {
             return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
@@ -69,31 +70,68 @@ export async function GET(request: Request) {
             select: {
                 id: true,
                 name: true,
-                email: true
+                email: true,
+                img: true,
+                Position: {
+                    select: {
+                        name: true
+                    }
+                },
+                Group: {
+                    select: {
+                        name: true
+                    }
+                }
             }
         })
 
+        const userOmit = user.map((v: any) => ({
+            ..._.omit(v, ["Position", "Group"]),
+            position: v.Position.name,
+            group: v.Group.name
+        }))
+
         const divisions = await prisma.division.findMany({
             where: kondisi,
             select: {
                 id: true,
                 name: true,
-                desc: true
+                desc: true,
+                Group: {
+                    select: {
+                        name: true
+                    }
+                }
             }
         })
 
+        const divisionOmit = divisions.map((v: any) => ({
+            ..._.omit(v, ["Group"]),
+            group: v.Group.name
+        }))
+
         const projects = await prisma.project.findMany({
             where: kondisiProject,
             select: {
                 id: true,
                 title: true,
+                Group: {
+                    select: {
+                        name: true
+                    }
+                }
             }
         })
 
+        const projectOmit = projects.map((v: any) => ({
+            ..._.omit(v, ["Group"]),
+            group: v.Group.name
+        }))
+
         const allDataSearch = {
-            user: user,
+            user: userOmit,
-            division: divisions,
+            division: divisionOmit,
-            project: projects
+            project: projectOmit
         }
         return NextResponse.json({ success: true, data: allDataSearch }, { status: 200 });
 

src/module/home/lib/type_search.ts

@@ -2,15 +2,20 @@ export interface IDataUserSearch {
     id: string
     name: string
     email: string
-}
+    position: string
-
+    group: string
-export interface IDataDivisionSearch {
+    img: string
-    id: string
-    title: string
 }
 
 export interface IDataProjectSearch  {
+    id: string
+    title: string
+    group: string
+}
+
+export interface IDataDivisionSearch {
     id: string
     name: string
     desc: string
-  }
+    group: string
+}

src/module/home/ui/view_detail_feature.tsx

@@ -98,7 +98,7 @@ export default function ViewDetailFeature() {
                 </ActionIcon>
               </Center>
               <Center>
-                <Text fz={15} c={WARNA.biruTua}>Group</Text>
+                <Text fz={15} c={WARNA.biruTua}>Grup</Text>
               </Center>
             </Box>
           </SimpleGrid>

src/module/home/ui/view_search.tsx

@@ -1,17 +1,19 @@
 "use client"
 import { LayoutNavbarNew, WARNA } from '@/module/_global';
-import { ActionIcon, Box, Divider, Grid, Group, Text, TextInput } from '@mantine/core';
+import { ActionIcon, Avatar, Box, Divider, Grid, Group, Text, TextInput } from '@mantine/core';
 import React, { useState } from 'react';
-import { HiMagnifyingGlass, HiMiniUser } from 'react-icons/hi2';
+import { HiMagnifyingGlass, HiMiniPresentationChartBar, HiMiniUserGroup } from 'react-icons/hi2';
 import { funGetSearchAll } from '../lib/api_search';
 import { useShallowEffect } from '@mantine/hooks';
 import { IDataDivisionSearch, IDataProjectSearch, IDataUserSearch } from '../lib/type_search';
+import { useRouter } from 'next/navigation';
 
 export default function ViewSearch() {
   const [search, setSearch] = useState('');
   const [dataUser, setDataUser] = useState<IDataUserSearch[]>([]);
-  const [dataProject, setDataProject] = useState<IDataDivisionSearch[]>([]);
+  const [dataProject, setDataProject] = useState<IDataProjectSearch[]>([]);
-  const [dataDivision, setDataDivision] = useState<IDataProjectSearch[]>([]);
+  const [dataDivision, setDataDivision] = useState<IDataDivisionSearch[]>([]);
+  const router = useRouter()
 
   async function featchSearch() {
     try {
@@ -26,8 +28,12 @@ export default function ViewSearch() {
   }
 
   useShallowEffect(() => {
-    if (search !== '') {
+    if (search != '') {
       featchSearch()
+    } else {
+      setDataUser([]);
+      setDataProject([]);
+      setDataDivision([]);
     }
   }, [search])
 
@@ -58,22 +64,27 @@ export default function ViewSearch() {
               borderRadius: 10,
             }}>
               <Text>ANGGOTA</Text>
+              <Box style={{
+                paddingLeft: 20,
+                paddingRight: 20,
+                paddingTop: 10,
+                paddingBottom: 10,
+                backgroundColor: `#E7EBF1`,
+                borderRadius: 5
+              }}>
                 {dataUser.length > 0 ? (
                   <Box>
                     {dataUser.map((v, i) => {
                       return (
-                      <Box key={i}>
+                        <Box key={i} onClick={() => router.push(`/member/${v.id}`)}>
                           <Group align='center' style={{
-                          padding: 10,
+                            padding: 5,
+                            paddingLeft: 0,
                           }} >
-                          <Box>
+                            <Avatar src={`/api/file/img?cat=user&file=${v.img}`} size="lg" />
-                            <ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
-                              <HiMiniUser color={'white'} size={25} />
-                            </ActionIcon>
-                          </Box>
                             <Box>
                               <Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
-                            <Text fw={'lighter'} fz={12}>{v.email}</Text>
+                              <Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
                             </Box>
                           </Group>
                           <Divider my={5} />
@@ -84,6 +95,8 @@ export default function ViewSearch() {
                 ) :
                   <Text>Tidak Ada Anggota</Text>
                 }
+              </Box>
+
               <Box mt={10}>
                 <Text>DIVISI</Text>
                 <Box style={{
@@ -98,15 +111,16 @@ export default function ViewSearch() {
                     <Box>
                       {dataDivision.map((v, i) => {
                         return (
-                          <Box key={i}>
+                          <Box key={i} onClick={() => router.push(`/division/${v.id}`)}>
                             <Grid justify='center' align='center' mt={15}>
                               <Grid.Col span={"auto"}>
                                 <ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
-                                  <HiMiniUser color={'white'} size={25} />
+                                  <HiMiniUserGroup color={'white'} size={25} />
                                 </ActionIcon>
                               </Grid.Col>
                               <Grid.Col span={10}>
                                 <Text fw={'bold'} c={WARNA.biruTua}>{v.name.toUpperCase()}</Text>
+                                <Text fw={'lighter'} fz={12}>{v.group}</Text>
                               </Grid.Col>
                             </Grid>
                             <Text fw={'lighter'} mt={5} mb={10} lineClamp={2}>{v.desc}</Text>
@@ -134,15 +148,16 @@ export default function ViewSearch() {
                     <Box>
                       {dataProject.map((v, i) => {
                         return (
-                        <Box key={i}>
+                          <Box key={i} onClick={() => router.push(`/project/${v.id}`)}>
                             <Grid justify='center' align='center' mt={10}>
                               <Grid.Col span={"auto"}>
                                 <ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
-                                <HiMiniUser color={'white'} size={25} />
+                                  <HiMiniPresentationChartBar color={'white'} size={25} />
                                 </ActionIcon>
                               </Grid.Col>
                               <Grid.Col span={10}>
                                 <Text fw={'bold'} c={WARNA.biruTua}>{v.title.toUpperCase()}</Text>
+                                <Text fw={'lighter'} fz={12}>{v.group}</Text>
                               </Grid.Col>
                             </Grid>
                             <Divider mt={10} />