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

@@ -0,0 +1,68 @@
+import { prisma } from "@/app/lib";
+import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
+import { NextResponse } from "next/server";
+
+
+// GET DATA HOME
+export async function GET(request: Request) {
+   try {
+      let fixData
+      const { searchParams } = new URL(request.url)
+      const kategori = searchParams.get("cat")
+
+      const userLoginId = await funGetUserIdByToken()
+      if (userLoginId == null) {
+         return NextResponse.json({ success: false, message: "Gagal mendapatkan data, user id tidak ada" }, { status: 500 });
+      }
+
+      if (kategori == "job") {
+         fixData = await prisma.job.findMany({
+            take: 2,
+            orderBy: {
+               createdAt: "desc",
+            },
+            where: {
+               isActive: true,
+               masterStatusId: "1"
+            },
+            select: {
+               id: true,
+               Author: {
+                  select: {
+                     id: true,
+                     username: true,
+                  },
+               },
+               title: true,
+               deskripsi: true
+            },
+         });
+      } else if (kategori == "cek_profile") {
+         const data = await prisma.user.findUnique({
+            where: {
+               id: userLoginId,
+            },
+            select: {
+               Profile: {
+                  select: {
+                     id: true,
+                     imageId: true,
+                  }
+               }
+            }
+         });
+
+         fixData = {
+            profile: data?.Profile?.id,
+            imageId: data?.Profile?.imageId
+         }
+
+      }
+
+      return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: fixData }, { status: 200 });
+
+   } catch (error) {
+      console.error(error);
+      return NextResponse.json({ success: false, message: "Gagal mendapatkan data, coba lagi nanti ", reason: (error as Error).message, }, { status: 500 });
+   }
+}

src/app/api/new/user/route.ts

@@ -0,0 +1,61 @@
+import { prisma } from "@/app/lib";
+import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
+import { NextResponse } from "next/server";
+
+
+// GET DATA USER LOGIN
+export async function GET(request: Request) {
+   try {
+      const userLoginId = await funGetUserIdByToken()
+      if (userLoginId == null) {
+         return NextResponse.json({ success: false, message: "Gagal mendapatkan data, user id tidak ada" }, { status: 500 });
+      }
+
+      const data = await prisma.user.findFirst({
+         where: {
+            id: userLoginId,
+         },
+         select: {
+            id: true,
+            username: true,
+            nomor: true,
+            active: true,
+            masterUserRoleId: true,
+            Profile: {
+               select: {
+                  id: true,
+                  name: true,
+                  email: true,
+                  alamat: true,
+                  jenisKelamin: true,
+                  imageId: true,
+                  imageBackgroundId: true
+               }
+            }
+         }
+      });
+
+      const dataFix = {
+         id: data?.id,
+         username: data?.username,
+         nomor: data?.nomor,
+         active: data?.active,
+         masterUserRoleId: data?.masterUserRoleId,
+         idProfile: data?.Profile?.id,
+         name: data?.Profile?.name,
+         email: data?.Profile?.email,
+         alamat: data?.Profile?.alamat,
+         jenisKelamin: data?.Profile?.jenisKelamin,
+         imageId: data?.Profile?.imageId,
+         imageBackgroundId: data?.Profile?.imageBackgroundId
+
+      }
+
+      return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: dataFix, }, { status: 200 });
+
+   }
+   catch (error) {
+      console.error(error);
+      return NextResponse.json({ success: false, message: "Gagal mendapatkan data, coba lagi nanti ", reason: (error as Error).message, }, { status: 500 });
+   }
+}

src/app/dev/(user)/home/page.tsx

@@ -1,23 +1,21 @@
-import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
-import { HomeView } from "@/app_modules/home";
-import { user_getOneByUserId } from "@/app_modules/home/fun/get/get_one_user_by_id";
-import { job_getTwoForHomeView } from "@/app_modules/job/fun/get/get_two_for_home_view";
+import { HomeViewNew } from "@/app_modules/home";
 import notifikasi_countUserNotifikasi from "@/app_modules/notifikasi/fun/count/fun_count_by_id";
 
 export default async function PageHome() {
-  const userLoginId = await funGetUserIdByToken();
-  const dataUser = await user_getOneByUserId(userLoginId as string);
-  const dataJob = await job_getTwoForHomeView();
+  // const userLoginId = await funGetUserIdByToken();
+  // const dataUser = await user_getOneByUserId(userLoginId as string);
+  // const dataJob = await job_getTwoForHomeView();
   const countNotifikasi = await notifikasi_countUserNotifikasi();
 
 
   return (
     <>
-      <HomeView
+      {/* <HomeView
         dataUser={dataUser as any}
         dataJob={dataJob as any}
         countNotifikasi={countNotifikasi}
-      />
+      /> */}
+      <HomeViewNew countNotifikasi={countNotifikasi} />
     </>
   );
 }

src/app_modules/home/component/body_home.tsx

@@ -0,0 +1,193 @@
+import { AccentColor, MainColor } from "@/app_modules/_global/color";
+import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
+import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
+import { ActionIcon, Box, Group, Image, Paper, SimpleGrid, Skeleton, Stack, Text } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { IconUserSearch } from "@tabler/icons-react";
+import _ from "lodash";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { apiGetDataHome } from "../fun/get/api_home";
+import { listMenuHomeBody, menuHomeJob } from "./list_menu_home";
+
+export default function BodyHome() {
+   const router = useRouter()
+   const [dataUser, setDataUser] = useState<any>({})
+   const [dataJob, setDataJob] = useState<any[]>([])
+   const [loadingJob, setLoadingJob] = useState(true)
+
+   useShallowEffect(() => {
+      cekUserLogin()
+      getHomeJob()
+   }, []);
+
+
+   async function cekUserLogin() {
+      try {
+         const response = await apiGetDataHome("?cat=cek_profile")
+         if (response.success) {
+            setDataUser(response.data);
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   async function getHomeJob() {
+      try {
+         setLoadingJob(true)
+         const response = await apiGetDataHome("?cat=job")
+         if (response.success) {
+            setDataJob(response.data);
+         }
+      } catch (error) {
+         console.error(error);
+      } finally {
+         setLoadingJob(false)
+      }
+   }
+
+   return (
+      <Box>
+         <Paper
+            radius={"xl"}
+            mb={"xs"}
+            style={{
+               borderRadius: "10px 10px 10px 10px",
+               border: `2px solid ${AccentColor.blue}`,
+            }}
+         >
+            <Image radius={"lg"} alt="logo" src={"/aset/home/home-hipmi-new.png"} />
+         </Paper>
+
+         <Stack my={"sm"}>
+            <SimpleGrid
+               cols={2}
+               spacing="md"
+            >
+               {listMenuHomeBody.map((e, i) => (
+                  <Paper
+                     key={e.id}
+                     h={150}
+                     bg={MainColor.darkblue}
+                     style={{
+                        borderRadius: "10px 10px 10px 10px",
+                        border: `2px solid ${AccentColor.blue}`,
+                     }}
+                     onClick={() => {
+                        if (dataUser.profile === undefined || dataUser?.profile === null) {
+                           return ComponentGlobal_NotifikasiPeringatan(
+                              "Lengkapi Profile"
+                           );
+                        } else {
+                           if (e.link === "") {
+                              return ComponentGlobal_NotifikasiPeringatan(
+                                 "Cooming Soon !!"
+                              );
+                           } else {
+                              router.push(e.link, { scroll: false });
+                           }
+                        }
+                     }}
+                  >
+                     <Stack align="center" justify="center" h={"100%"}>
+                        <ActionIcon
+                           size={50}
+                           variant="transparent"
+                           c={e.link === "" ? "gray.3" : "white"}
+                        >
+                           {e.icon}
+                        </ActionIcon>
+                        <Text c={e.link === "" ? "gray.3" : "white"} fz={"xs"}>
+                           {e.name}
+                        </Text>
+                     </Stack>
+                  </Paper>
+               ))}
+            </SimpleGrid>
+
+            {/* Job View */}
+            <Paper
+               p={"md"}
+               w={"100%"}
+               bg={MainColor.darkblue}
+               style={{
+                  borderRadius: "10px 10px 10px 10px",
+                  border: `2px solid ${AccentColor.blue}`,
+               }}
+            >
+               <Stack
+                  onClick={() => {
+                     if (dataUser.profile === undefined || dataUser?.profile === null) {
+                        return ComponentGlobal_NotifikasiPeringatan(
+                           "Lengkapi Profile"
+                        );
+                     } else {
+                        if (menuHomeJob.link === "") {
+                           return ComponentGlobal_NotifikasiPeringatan(
+                              "Cooming Soon !!"
+                           );
+                        } else {
+                           return router.push(menuHomeJob.link, { scroll: false });
+                        }
+                     }
+                  }}
+               >
+                  <Group>
+                     <ActionIcon
+                        variant="transparent"
+                        size={40}
+                        c={menuHomeJob.link === "" ? "gray.3" : "white"}
+                     >
+                        {menuHomeJob.icon}
+                     </ActionIcon>
+                     <Text c={menuHomeJob.link === "" ? "gray.3" : "white"}>
+                        {menuHomeJob.name}
+                     </Text>
+                  </Group>
+                  {
+                     loadingJob ?
+                        Array(2)
+                           .fill(null)
+                           .map((_, i) => (
+                              <Box key={i} mb={"md"}>
+                                 <Skeleton height={10} mt={0} radius="xl" width={"50%"} />
+                                 <Skeleton height={10} mt={10} radius="xl" />
+                                 <Skeleton height={10} mt={10} radius="xl" />
+                              </Box>
+                           ))
+                        : _.isEmpty(dataJob) ?
+                           (<ComponentGlobal_IsEmptyData text="Tidak ada data" height={10} />)
+                           : (
+                              <SimpleGrid cols={2} spacing="md">
+                                 {dataJob.map((e, i) => (
+                                    <Stack key={e.id}>
+                                       <Group spacing={"xs"}>
+                                          <Stack h={"100%"} align="center" justify="flex-start">
+                                             <IconUserSearch size={20} color="white" />
+                                          </Stack>
+                                          <Stack spacing={0} w={"60%"}>
+                                             <Text
+                                                lineClamp={1}
+                                                fz={"sm"}
+                                                c={MainColor.yellow}
+                                                fw={"bold"}
+                                             >
+                                                {e?.Author.username}
+                                             </Text>
+                                             <Text fz={"sm"} c={"white"} lineClamp={2}>
+                                                {e?.title}
+                                             </Text>
+                                          </Stack>
+                                       </Group>
+                                    </Stack>
+                                 ))}
+                              </SimpleGrid>
+                           )
+                  }
+               </Stack>
+            </Paper>
+         </Stack>
+      </Box>
+   );
+}

src/app_modules/home/component/footer_home.tsx

@@ -0,0 +1,113 @@
+import { APIs } from "@/app/lib";
+import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
+import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
+import { ActionIcon, Box, Center, SimpleGrid, Stack, Text } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { IconUserCircle } from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { apiGetDataHome } from "../fun/get/api_home";
+import { Home_ComponentAvatarProfile } from "./comp_avatar_profile";
+import { listMenuHomeFooter } from "./list_menu_home";
+
+export default function FooterHome() {
+   const router = useRouter()
+   const [dataUser, setDataUser] = useState<any>({})
+
+   useShallowEffect(() => {
+      cekUserLogin();
+   }, []);
+
+
+   async function cekUserLogin() {
+      try {
+         const response = await apiGetDataHome("?cat=cek_profile")
+         if (response.success) {
+            setDataUser(response.data);
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   return (
+      <Box
+         style={{
+            zIndex: 99,
+            borderRadius: "20px 20px 0px 0px",
+         }}
+         w={"100%"}
+         bottom={0}
+         h={"9vh"}
+      >
+         <SimpleGrid cols={listMenuHomeFooter.length + 1}>
+            {listMenuHomeFooter.map((e) => (
+               <Center h={"9vh"} key={e.id}>
+                  <Stack align="center" spacing={0}
+                     onClick={() => {
+                        if (dataUser.profile === undefined || dataUser?.profile === null) {
+                           ComponentGlobal_NotifikasiPeringatan("Lengkapi Profile");
+                        } else {
+                           if (e.link == "") {
+                              ComponentGlobal_NotifikasiPeringatan("Cooming Soon")
+                           } else {
+                              router.push(e.link, { scroll: false })
+                           }
+                        }
+                     }}
+                  >
+                     <ActionIcon
+                        radius={"xl"}
+                        c={e.link === "" ? "gray" : "white"}
+                        variant="transparent"
+                     >
+                        {e.icon}
+                     </ActionIcon>
+                     <Text
+                        lineClamp={1}
+                        c={e.link === "" ? "gray" : "white"}
+                        fz={12}
+                     >
+                        {e.name}
+                     </Text>
+                  </Stack>
+               </Center>
+            ))}
+
+            <Center h={"9vh"}>
+               <Stack
+                  align="center"
+                  spacing={2}
+                  onClick={() => {
+                     if (dataUser.profile === undefined || dataUser?.profile === null) {
+                        router.push(RouterProfile.create, { scroll: false });
+                     } else {
+                        router.push(
+                           RouterProfile.katalogOLD + `${dataUser?.profile}`,
+                           { scroll: false }
+                        );
+                     }
+                  }}
+               >
+                  <ActionIcon variant={"transparent"}>
+                     {dataUser.profile === undefined || dataUser?.profile === null
+                        ?
+                        <IconUserCircle color="white" />
+                        :
+                        <Home_ComponentAvatarProfile
+                           url={APIs.GET({
+                              fileId: dataUser?.imageId as string,
+                              size: "50"
+                           })}
+                        />
+                     }
+                  </ActionIcon>
+                  <Text fz={10} c={"white"}>
+                     Profile
+                  </Text>
+               </Stack>
+            </Center>
+         </SimpleGrid>
+      </Box>
+   );
+}

src/app_modules/home/component/list_menu_home.tsx

@@ -0,0 +1,67 @@
+import { RouterColab } from '@/app/lib/router_hipmi/router_colab';
+import { RouterEvent } from '@/app/lib/router_hipmi/router_event';
+import { RouterForum } from '@/app/lib/router_hipmi/router_forum';
+import { RouterJob } from '@/app/lib/router_hipmi/router_job';
+import { RouterMap } from '@/app/lib/router_hipmi/router_map';
+import { RouterVote } from '@/app/lib/router_hipmi/router_vote';
+import { IconAffiliate, IconBriefcase, IconHeartHandshake, IconMap2, IconMessages, IconPackageImport, IconPresentation, IconShoppingBag } from '@tabler/icons-react';
+
+
+// yg ada di footer home
+export const listMenuHomeFooter = [
+  {
+    id: 1,
+    name: "Forums",
+    icon: <IconMessages />,
+    link: RouterForum.splash,
+  },
+  {
+    id: 2,
+    name: "MarketPlace",
+    icon: <IconShoppingBag />,
+    link: "",
+  },
+  {
+    id: 3,
+    name: "Business Maps",
+    icon: <IconMap2 />,
+    link: RouterMap.splash,
+  },
+];
+
+
+// yg ada di kotak2 home (body)
+export const listMenuHomeBody = [
+  {
+    id: 1,
+    name: "Event",
+    icon: <IconPresentation size={50} />,
+    link: RouterEvent.splash,
+  },
+  {
+    id: 2,
+    name: "Collaboration",
+    icon: <IconAffiliate size={50} />,
+    link: RouterColab.splash,
+  },
+
+  {
+    id: 3,
+    name: "Voting",
+    icon: <IconPackageImport size={50} />,
+    link: RouterVote.splash,
+  },
+
+  {
+    id: 4,
+    name: "Crowd Funding",
+    icon: <IconHeartHandshake size={50} />,
+    link: `/dev/crowd/splash`,
+  },
+];
+
+export const menuHomeJob = {
+  name: "Job Vacancy",
+  icon: <IconBriefcase size={50} />,
+  link: RouterJob.spalsh,
+};

src/app_modules/home/fun/get/api_home.ts

@@ -0,0 +1,4 @@
+export const apiGetDataHome = async (path?: string) => {
+   const response = await fetch(`/api/new/home${(path) ? path : ''}`)
+   return await response.json().catch(() => null)
+}

src/app_modules/home/index.ts

@@ -1,4 +1,6 @@
+import { listMenuHomeFooter } from './component/list_menu_home';
 import HomeView from "./view_home";
+import HomeViewNew from "./view_home_new";
 import Home_UserNotActive from "./user_non_active";
 
-export { HomeView, Home_UserNotActive as Home_UserNonActive };
+export { HomeView, HomeViewNew, listMenuHomeFooter, Home_UserNotActive as Home_UserNonActive };

src/app_modules/home/view_home_new.tsx

@@ -0,0 +1,127 @@
+"use client";
+import { gs_count_ntf, gs_user_ntf } from "@/app/lib/global_state";
+import { RouterNotifikasi } from "@/app/lib/router_hipmi/router_notifikasi";
+import { RouterUserSearch } from "@/app/lib/router_hipmi/router_user_search";
+import { ActionIcon, Indicator, Text } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { IconBell, IconUserSearch } from "@tabler/icons-react";
+import { useAtom } from "jotai";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { MainColor } from "../_global/color";
+import { ComponentGlobal_NotifikasiPeringatan } from "../_global/notif_global";
+import UIGlobal_LayoutHeaderTamplate from "../_global/ui/ui_header_tamplate";
+import UIGlobal_LayoutTamplate from "../_global/ui/ui_layout_tamplate";
+import notifikasi_countUserNotifikasi from "../notifikasi/fun/count/fun_count_by_id";
+import BodyHome from "./component/body_home";
+import FooterHome from "./component/footer_home";
+import { apiGetDataHome } from "./fun/get/api_home";
+
+export default function HomeViewNew({ countNotifikasi }: { countNotifikasi: number; }) {
+   const [countNtf, setCountNtf] = useState(countNotifikasi);
+   const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf);
+   const [countLoadNtf, setCountLoadNtf] = useAtom(gs_count_ntf);
+   const [dataUser, setDataUser] = useState<any>({})
+   const router = useRouter();
+
+
+   useShallowEffect(() => {
+      onLoadNotifikasi({
+         onLoad(val) {
+            setCountNtf(val);
+         },
+      });
+
+      setCountNtf(countLoadNtf as any);
+   }, [countLoadNtf, setCountNtf]);
+
+   useShallowEffect(() => {
+      setCountNtf(countNtf + newUserNtf);
+      setNewUserNtf(0);
+   }, [newUserNtf, setCountNtf]);
+
+   async function onLoadNotifikasi({ onLoad }: { onLoad: (val: any) => void }) {
+      const loadNotif = await notifikasi_countUserNotifikasi();
+      onLoad(loadNotif);
+   }
+
+   useShallowEffect(() => {
+      cekUserLogin();
+   }, []);
+
+
+   async function cekUserLogin() {
+      try {
+         const response = await apiGetDataHome("?cat=cek_profile")
+         if (response.success) {
+            setDataUser(response.data);
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   return (
+      <>
+         <UIGlobal_LayoutTamplate
+            header={
+               <UIGlobal_LayoutHeaderTamplate
+                  title="HIPMI"
+                  customButtonLeft={
+                     <ActionIcon
+                        radius={"xl"}
+                        variant={"transparent"}
+                        onClick={() => {
+                           if (dataUser.profile === undefined || dataUser?.profile === null) {
+                              ComponentGlobal_NotifikasiPeringatan("Lengkapi Profile");
+                           } else {
+                              router.push(RouterUserSearch.main, { scroll: false });
+                           }
+                        }}
+                     >
+                        <IconUserSearch color="white" />
+                     </ActionIcon>
+                  }
+                  customButtonRight={
+                     <ActionIcon
+                        variant="transparent"
+                        onClick={() => {
+                           if (dataUser.profile === undefined || dataUser?.profile === null) {
+                              ComponentGlobal_NotifikasiPeringatan("Lengkapi Profile");
+                           } else {
+                              router.push(RouterNotifikasi.categoryApp({ name: "semua" }), {
+                                 scroll: false,
+                              });
+                           }
+                        }}
+                     >
+                        {
+                           countNotifikasi > 0
+                              ?
+                              <Indicator
+                                 processing
+                                 color={MainColor.yellow}
+                                 label={
+                                    <Text fz={10} c={MainColor.darkblue}>
+                                       {countNotifikasi > 99 ? "99+" : countNotifikasi}
+                                    </Text>
+                                 }
+                              >
+                                 <IconBell color="white" />
+                              </Indicator>
+                              :
+                              <IconBell color="white" />
+                        }
+
+                     </ActionIcon>
+                  }
+               />
+            }
+
+            footer={<FooterHome />}
+         >
+            <BodyHome />
+         </UIGlobal_LayoutTamplate>
+      </>
+   );
+}

src/app_modules/user/index.ts

@@ -0,0 +1,5 @@
+import { IUserLogin } from './lib/type_user';
+import { apiGetUserLogin } from "./lib/api_user";
+
+export { apiGetUserLogin };
+export type { IUserLogin };

src/app_modules/user/lib/api_user.ts

@@ -0,0 +1,4 @@
+export const apiGetUserLogin = async () => {
+   const response = await fetch(`/api/new/user`)
+   return await response.json().catch(() => null)
+}

src/app_modules/user/lib/type_user.ts

@@ -0,0 +1,14 @@
+export interface IUserLogin {
+   id: string
+   username: string
+   nomor: string
+   active:boolean
+   masterUserRoleId: string
+   idProfile: string
+   name: string
+   email: string
+   alamat: string
+   jenisKelamin: string
+   imageId: string
+   imageBackgroundId: string
+}

src/middleware.ts

@@ -32,6 +32,7 @@ const middlewareConfig: MiddlewareConfig = {
     "/auth/api/login",
     "/aset/global/main_background.png",
     "/aset/logo/logo-hipmi.png",
+    "/api/new/*"
   ],
   encodedKey: process.env.NEXT_PUBLIC_BASE_TOKEN_KEY!,
   sessionKey: process.env.NEXT_PUBLIC_BASE_SESSION_KEY!,