wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #209 from bipproduction/fix/bug/notifikasi

Browse Source 
Fix notifikasi server action to API
This commit is contained in:
Bagasbanuna02
2024-12-19 06:35:21 +08:00
committed by GitHub
parent 59c124cec5 2322ab8444
commit 21c327ee8a
43 changed files with 507 additions and 1031 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/api/collaboration/master/route.ts Normal file
View File

@@ -0,0 +1,20 @@
import { prisma } from "@/app/lib";
import backendLogger from "@/util/backendLogger";
import { NextResponse } from "next/server";
export const dynamic = "force-dynamic";
export async function GET(request: Request) {
try {
const data = await prisma.projectCollaborationMaster_Industri.findMany({});
return NextResponse.json(
{ success: true, message: "Berhasil mendapatkan data", data: data },
{ status: 200 }
);
} catch (error) {
backendLogger.error("Master Collaboration:=========>", error);
return NextResponse.json(
{ success: false, message: "Gagal mendapatkan data" },
{ status: 500 }
);
}
}

28
src/app/api/notifikasi/count/route.ts Normal file
View File

@@ -0,0 +1,28 @@
import { prisma } from "@/app/lib";
import { newFunGetUserId } from "@/app/lib/new_fun_user_id";
import backendLogger from "@/util/backendLogger";
import { NextResponse } from "next/server";
export const dynamic = "force-dynamic";
export async function GET(request: Request) {
try {
const userLoginId = await newFunGetUserId();
const count = await prisma.notifikasi.findMany({
where: {
userId: userLoginId,
isRead: false,
userRoleId: "1",
},
});
return NextResponse.json({ success: true, data: count.length });
} catch (error) {
backendLogger.error("Gagal mendapatkan data count notifikasi", error);
return NextResponse.json(
{ success: false, message: "Gagal mendapatkan data" },
{ status: 500 }
);
}
}

70
src/app/api/notifikasi/get-all-by-category/route.ts
View File

@@ -7,37 +7,34 @@ import { NextResponse } from "next/server";
export const dynamic = "force-dynamic";
export async function GET(request: Request) {
if (request.method === "GET") {
try {
const { searchParams } = new URL(request.url);
const category = searchParams.get("category") as ICategoryapp;
const page = searchParams.get("page");
try {
let fixData;
const { searchParams } = new URL(request.url);
const category = searchParams.get("category") as ICategoryapp;
const page = searchParams.get("page");
const userLoginId = await newFunGetUserId();
const fixPage = _.toNumber(page);
const takeData = 10;
const skipData = fixPage * takeData - takeData;
const userLoginId = await newFunGetUserId();
const fixPage = _.toNumber(page);
const takeData = 10;
const skipData = fixPage * takeData - takeData;
if (category === "Semua") {
const data = await prisma.notifikasi.findMany({
take: takeData,
skip: skipData,
orderBy: [
{
isRead: "asc",
},
{ createdAt: "desc" },
],
where: {
userId: userLoginId,
userRoleId: "1",
if (category === "Semua") {
fixData = await prisma.notifikasi.findMany({
take: takeData,
skip: skipData,
orderBy: [
{
isRead: "asc",
},
});
return NextResponse.json({ success: true, data });
}
const allData = await prisma.notifikasi.findMany({
{ createdAt: "desc" },
],
where: {
userId: userLoginId,
userRoleId: "1",
},
});
} else {
fixData = await prisma.notifikasi.findMany({
take: takeData,
skip: skipData,
orderBy: [
@@ -52,12 +49,17 @@ export async function GET(request: Request) {
kategoriApp: _.upperCase(category),
},
});
return NextResponse.json({ success: true, data: allData });
} catch (error) {
backendLogger.error("Error get data notifikasi: " + error);
}
} else {
return NextResponse.json({ success: false, message: "Method not allowed" });
return NextResponse.json(
{ success: true, data: fixData, message: "Berhasil mendapatkan data" },
{ status: 200 }
);
} catch (error) {
backendLogger.error("Error get data notifikasi: " + error);
return NextResponse.json(
{ success: false, message: "Gagal mendapatkan data" },
{ status: 500 }
);
}
}

35
src/app/api/notifikasi/master/route.ts Normal file
View File

@@ -0,0 +1,35 @@
import { prisma } from "@/app/lib";
import backendLogger from "@/util/backendLogger";
import { NextResponse } from "next/server";
export const dynamic = "force-dynamic";
export async function GET(request: Request) {
try {
const data = await prisma.masterKategoriApp.findMany({
where: {
isActive: true,
},
});
data.unshift({
id: "0",
isActive: true,
createdAt: new Date(),
updatedAt: new Date(),
name: "Semua",
value: null,
});
return NextResponse.json(
{ success: true, data, message: "Berhasil mendapatkan data" },
{ status: 200 }
);
} catch (error) {
backendLogger.error("Master Notifikasi:", error);
return NextResponse.json(
{ success: false, message: "Gagal mendapatkan data" },
{ status: 500 }
);
}
}

2
src/app/dev/(user)/home/page.tsx
View File

@@ -15,7 +15,7 @@ export default async function PageHome() {
dataJob={dataJob as any}
countNotifikasi={countNotifikasi}
/> */}
<HomeViewNew countNotifikasi={countNotifikasi} />
<HomeViewNew countNotifikasi={countNotifikasi}/>
</>
);
}

5
src/app/dev/colab/create/page.tsx
View File

@@ -1,12 +1,9 @@
import { Colab_Create } from "@/app_modules/colab";
import colab_funGetMasterIndustri from "@/app_modules/colab/fun/master/fun_get_master_industri";
export default async function Page() {
const listIndustri = await colab_funGetMasterIndustri();
return (
<>
<Colab_Create listIndustri={listIndustri as any} />
<Colab_Create />
</>
);
}

10
src/app/dev/notifikasi/collaboration/page.tsx
View File

@@ -1,15 +1,9 @@
import { Notifikasi_UiCollaboration } from "@/app_modules/notifikasi/_ui";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Collaboration",
});
return (
<>
<Notifikasi_UiCollaboration listNotifikasi={listNotifikasi} />
<Notifikasi_UiMain />
</>
);
}

10
src/app/dev/notifikasi/donasi/page.tsx
View File

@@ -1,15 +1,9 @@
import { Notifikasi_UiDonasi } from "@/app_modules/notifikasi/_ui";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Donasi",
});
return (
<>
<Notifikasi_UiDonasi listNotifikasi={listNotifikasi} />
<Notifikasi_UiMain />
</>
);
}

6
src/app/dev/notifikasi/event/page.tsx
View File

@@ -1,11 +1,9 @@
import { Notifikasi_UiEvent } from "@/app_modules/notifikasi/_ui";
import Notifikasi_UiMain from "@/app_modules/notifikasi/_ui/ui_notifikasi";
export default async function Page() {
//
return (
<>
<Notifikasi_UiEvent />
<Notifikasi_UiMain />
</>
);
}

10
src/app/dev/notifikasi/forum/page.tsx
View File

@@ -1,15 +1,9 @@
import { Notifikasi_UiForum } from "@/app_modules/notifikasi/_ui";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Forum",
});
return (
<>
<Notifikasi_UiForum listNotifikasi={listNotifikasi} />
<Notifikasi_UiMain />
</>
);
}

10
src/app/dev/notifikasi/investasi/page.tsx
View File

@@ -1,15 +1,9 @@
import { Notifikasi_UiDonasi, Notifikasi_UiInvestasi } from "@/app_modules/notifikasi/_ui";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Investasi",
});
return (
<>
<Notifikasi_UiInvestasi listNotifikasi={listNotifikasi} />
<Notifikasi_UiMain />
</>
);
}

10
src/app/dev/notifikasi/job/page.tsx
View File

@@ -1,15 +1,9 @@
import { Notifikasi_UiJob } from "@/app_modules/notifikasi/_ui";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Job",
});
return (
<>
<Notifikasi_UiJob listNotifikasi={listNotifikasi} />
<Notifikasi_UiMain />
</>
);
}

4
src/app/dev/notifikasi/layout.tsx
View File

@@ -1,19 +1,15 @@
import { UIGlobal_LayoutHeaderTamplate } from "@/app_modules/_global/ui";
import { Notifikasi_UiNewLayout } from "@/app_modules/notifikasi/_ui";
import { notifikasi_funGetKategoriApp } from "@/app_modules/notifikasi/fun/get/fun_get_kategori_app";
export default async function Layout({
children,
}: {
children: React.ReactNode;
}) {
const masterKategori = await notifikasi_funGetKategoriApp();
return (
<>
<Notifikasi_UiNewLayout
header={<UIGlobal_LayoutHeaderTamplate title="Notifikasi" />}
masterKategori={masterKategori}
>
{children}
</Notifikasi_UiNewLayout>

4
src/app/dev/notifikasi/semua/page.tsx
View File

@@ -1,9 +1,9 @@
import { Notifikasi_UiAll } from "@/app_modules/notifikasi/_ui";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
return (
<>
<Notifikasi_UiAll />
<Notifikasi_UiMain />
</>
);
}

10
src/app/dev/notifikasi/voting/page.tsx
View File

@@ -1,15 +1,9 @@
import { Notifikasi_UiVoting } from "@/app_modules/notifikasi/_ui";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_UiMain } from "@/app_modules/notifikasi/_ui";
export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Voting",
});
return (
<>
<Notifikasi_UiVoting listNotifikasi={listNotifikasi} />
<Notifikasi_UiMain />
</>
);
}

4
src/app/lib/api_user_router/route_api_notifikasi.ts
View File

@@ -8,4 +8,8 @@ export const API_RouteNotifikasi = {
category: ICategoryapp;
page: number;
}) => `/api/notifikasi/get-all-by-category?category=${category}&page=${page}`,
get_master_kategori: () => `/api/notifikasi/master`,
get_count_by_id: () => `/api/notifikasi/count`,
};

2
src/app/lib/global_state.ts
View File

@@ -42,7 +42,7 @@ export type IRealtimeData = {
export const gs_realtimeData = atom<IRealtimeData | null>(null);
export const gs_admin_ntf = atom<number>(0);
export const gs_user_ntf = atom<number>(0);
export const gs_count_ntf = atom<number>(0);
export const gs_count_ntf = atom<number | null>(null);
// job
export const gs_adminJob_triggerReview = atom<boolean>(false);

2
src/app/lib/prisma.ts
View File

@@ -25,6 +25,6 @@ process.on("SIGINT", async () => {
process.exit(0);
});
// console.log("==> Test prisma");
console.log("==> Test prisma");
export default prisma;

3
src/app_modules/colab/component/index.ts Normal file
View File

@@ -0,0 +1,3 @@
import { Collaboration_SkeletonCreate } from "./skeleton_view";
export { Collaboration_SkeletonCreate };

4
src/app_modules/colab/component/lib/api_collaboration.ts Normal file
View File

@@ -0,0 +1,4 @@
export async function apiGetMasterCollaboration() {
const data = await fetch(`/api/collaboration/master`);
return await data.json().catch(() => null);
}

28
src/app_modules/colab/component/skeleton_view.tsx Normal file
View File

@@ -0,0 +1,28 @@
import { Skeleton, Stack } from "@mantine/core";
export function Collaboration_SkeletonCreate() {
return (
<>
<Stack px={"xl"} spacing={"lg"}>
<Stack spacing={"xs"}>
<Skeleton height={10} width={50} />
<Skeleton height={40} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={10} width={50} />
<Skeleton height={40} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={10} width={50} />
<Skeleton height={130} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={10} width={50} />
<Skeleton height={130} />
</Stack>
<Skeleton mt={50} height={40} radius={"xl"} />
</Stack>
</>
);
}

55
src/app_modules/colab/create/index.tsx
View File

@@ -5,7 +5,15 @@ import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/inpu
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { Button, Select, Stack, TextInput, Textarea } from "@mantine/core";
import {
Button,
Center,
Select,
Stack,
TextInput,
Textarea,
Loader,
} from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
import colab_funCreateProyek from "../fun/create/fun_create_proyek";
@@ -13,12 +21,12 @@ import { MODEL_COLLABORATION_MASTER } from "../model/interface";
import mqtt_client from "@/util/mqtt_client";
import { useHookstate } from "@hookstate/core";
import { useGsCollabCreate } from "../global_state/state";
import { useShallowEffect } from "@mantine/hooks";
import { apiGetMasterCollaboration } from "../component/lib/api_collaboration";
import { clientLogger } from "@/util/clientLogger";
import { Collaboration_SkeletonCreate } from "../component";
export default function Colab_Create({
listIndustri,
}: {
listIndustri: MODEL_COLLABORATION_MASTER[];
}) {
export default function Colab_Create() {
const [value, setValue] = useState({
title: "",
lokasi: "",
@@ -27,9 +35,38 @@ export default function Colab_Create({
projectCollaborationMaster_IndustriId: 0,
// jumlah_partisipan: 0,
});
const [listIndustri, setListIndustri] = useState<
MODEL_COLLABORATION_MASTER[] | null
>(null);
useShallowEffect(() => {
onLoadMaster();
}, []);
async function onLoadMaster() {
try {
const respone = await apiGetMasterCollaboration();
if (respone.success) {
setListIndustri(respone.data);
}
} catch (error) {
clientLogger.error("Error get master collaboration", error);
}
}
if (listIndustri == null) {
return (
<>
<Collaboration_SkeletonCreate />
</>
);
}
return (
<>
<Stack px={"xl"} py={"md"}>
<Stack px={"xl"} pb={"md"}>
<TextInput
maxLength={100}
styles={{
@@ -66,7 +103,7 @@ export default function Colab_Create({
}}
/>
<Select
{/* <Select
styles={{
label: {
color: "white",
@@ -85,7 +122,7 @@ export default function Colab_Create({
projectCollaborationMaster_IndustriId: val as any,
});
}}
/>
/> */}
{/* <TextInput
description={

36
src/app_modules/home/component/body_home.tsx
View File

@@ -1,3 +1,4 @@
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
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";
@@ -19,7 +20,6 @@ import { useRouter } from "next/navigation";
import { useState } from "react";
import { apiGetDataHome } from "../fun/get/api_home";
import { listMenuHomeBody, menuHomeJob } from "./list_menu_home";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
export default function BodyHome() {
const router = useRouter();
@@ -83,12 +83,19 @@ export default function BodyHome() {
}}
onClick={() => {
if (
dataUser.profile === undefined ||
dataUser?.profile === null
dataUser.profile == undefined ||
dataUser?.profile == null ||
dataJob.length == undefined ||
dataJob.length == null
) {
return null;
} else if (
dataUser.profile == undefined ||
dataUser?.profile == null
) {
router.push(RouterProfile.create, { scroll: false });
} else {
if (e.link === "") {
if (e.link == "") {
return ComponentGlobal_NotifikasiPeringatan(
"Cooming Soon !!"
);
@@ -102,11 +109,11 @@ export default function BodyHome() {
<ActionIcon
size={50}
variant="transparent"
c={e.link === "" ? "gray.3" : "white"}
c={e.link == "" ? "gray.3" : "white"}
>
{e.icon}
</ActionIcon>
<Text c={e.link === "" ? "gray.3" : "white"} fz={"xs"}>
<Text c={e.link == "" ? "gray.3" : "white"} fz={"xs"}>
{e.name}
</Text>
</Stack>
@@ -127,12 +134,19 @@ export default function BodyHome() {
<Stack
onClick={() => {
if (
dataUser.profile === undefined ||
dataUser?.profile === null
dataUser.profile == undefined ||
dataUser?.profile == null ||
dataJob.length == undefined ||
dataJob.length == null
) {
return null;
} else if (
dataUser.profile == undefined ||
dataUser?.profile == null
) {
router.push(RouterProfile.create, { scroll: false });
} else {
if (menuHomeJob.link === "") {
if (menuHomeJob.link == "") {
return ComponentGlobal_NotifikasiPeringatan(
"Cooming Soon !!"
);
@@ -146,11 +160,11 @@ export default function BodyHome() {
<ActionIcon
variant="transparent"
size={40}
c={menuHomeJob.link === "" ? "gray.3" : "white"}
c={menuHomeJob.link == "" ? "gray.3" : "white"}
>
{menuHomeJob.icon}
</ActionIcon>
<Text c={menuHomeJob.link === "" ? "gray.3" : "white"}>
<Text c={menuHomeJob.link == "" ? "gray.3" : "white"}>
{menuHomeJob.name}
</Text>
</Group>

5
src/app_modules/home/component/footer_home.tsx
View File

@@ -56,6 +56,11 @@ export default function FooterHome() {
if (
dataUser.profile === undefined ||
dataUser?.profile === null
) {
return null;
} else if (
dataUser.profile === undefined ||
dataUser?.profile === null
) {
router.push(RouterProfile.create, { scroll: false });
} else {

134
src/app_modules/home/view_home_new.tsx
View File

@@ -137,3 +137,137 @@ export default function HomeViewNew({
</>
);
}
// "use client";
// import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
// import { gs_count_ntf, gs_user_ntf } from "@/app/lib/global_state";
// import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
// 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 UIGlobal_LayoutHeaderTamplate from "../_global/ui/ui_header_tamplate";
// import UIGlobal_LayoutTamplate from "../_global/ui/ui_layout_tamplate";
// import { gs_notifikasi_kategori_app } from "../notifikasi/lib";
// import BodyHome from "./component/body_home";
// import FooterHome from "./component/footer_home";
// import { apiGetDataHome } from "./fun/get/api_home";
// export default function HomeViewNew() {
// const [countNtf, setCountNtf] = useAtom(gs_count_ntf);
// const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf);
// const [dataUser, setDataUser] = useState<any>({});
// const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
// const router = useRouter();
// useShallowEffect(() => {
// onLoadNotifikasi();
// }, []);
// useShallowEffect(() => {
// if (countNtf != null) {
// setCountNtf(countNtf + newUserNtf);
// setNewUserNtf(0);
// }
// console.log("notif baru", newUserNtf);
// console.log("notif baru", countNtf);
// }, [newUserNtf, countNtf]);
// async function onLoadNotifikasi() {
// const loadNotif = await fetch(API_RouteNotifikasi.get_count_by_id());
// const data = await loadNotif.json().then((res) => res.data);
// setCountNtf(data);
// }
// 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"}
// disabled={countNtf == null}
// variant={"transparent"}
// onClick={() => {
// if (
// dataUser.profile === undefined ||
// dataUser?.profile === null
// ) {
// router.push(RouterProfile.create, { scroll: false });
// } else {
// router.push(RouterUserSearch.main, { scroll: false });
// }
// }}
// >
// <IconUserSearch color="white" />
// </ActionIcon>
// }
// customButtonRight={
// <ActionIcon
// variant="transparent"
// disabled={countNtf == null}
// onClick={() => {
// if (
// dataUser.profile === undefined ||
// dataUser?.profile === null
// ) {
// router.push(RouterProfile.create, { scroll: false });
// } else {
// setCategoryPage("Semua");
// router.push(
// RouterNotifikasi.categoryApp({ name: "semua" }),
// {
// scroll: false,
// }
// );
// }
// }}
// >
// {countNtf != null && countNtf > 0 ? (
// <Indicator
// processing
// color={MainColor.yellow}
// label={
// <Text fz={10} c={MainColor.darkblue}>
// {countNtf > 99 ? "99+" : countNtf}
// </Text>
// }
// >
// <IconBell color="white" />
// </Indicator>
// ) : (
// <IconBell color="white" />
// )}
// </ActionIcon>
// }
// />
// }
// footer={<FooterHome />}
// >
// <BodyHome />
// </UIGlobal_LayoutTamplate>
// </>
// );
// }

21
src/app_modules/notifikasi/_ui/index.ts
View File

@@ -1,21 +1,4 @@
import Notifikasi_UiAll from "./ui_all_notifikasi";
import Notifikasi_UiCollaboration from "./ui_collaboration_notifikasi";
import Notifikasi_UiDonasi from "./ui_donasi_notifikasi";
import Notifikasi_UiEvent from "./ui_event_notifikasi";
import Notifikasi_UiForum from "./ui_forum_notifikasi";
import Notifikasi_UiInvestasi from "./ui_investasi_notifikasi";
import Notifikasi_UiJob from "./ui_job_notifikasi";
import Notifikasi_UiNewLayout from "./ui_new_layout_notifikasi";
import Notifikasi_UiNewMain from "./ui_new_notifikasi";
import Notifikasi_UiVoting from "./ui_voting_notifikasi";
import Notifikasi_UiMain from "./ui_notifikasi";
export { Notifikasi_UiNewMain };
export { Notifikasi_UiNewLayout };
export { Notifikasi_UiAll };
export { Notifikasi_UiJob };
export { Notifikasi_UiEvent };
export { Notifikasi_UiForum };
export { Notifikasi_UiVoting };
export { Notifikasi_UiDonasi };
export { Notifikasi_UiInvestasi };
export { Notifikasi_UiCollaboration };
export { Notifikasi_UiMain, Notifikasi_UiNewLayout };

92
src/app_modules/notifikasi/_ui/ui_all_notifikasi.tsx
View File

@@ -1,92 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import {
Box,
Center,
Divider,
Grid,
Group,
Loader,
Skeleton,
Stack,
} from "@mantine/core";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import {
ComponentNotifiaksi_CardView,
Notifikasi_ComponentSkeletonView,
} from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { ICategoryapp, MODEL_NOTIFIKASI } from "../model/interface";
import { useAtom } from "jotai";
import { gs_notifikasi_kategori_app } from "../lib";
import { useShallowEffect } from "@mantine/hooks";
import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
export default function Notifikasi_UiAll() {
const [data, setData] = useState<MODEL_NOTIFIKASI[] | null>(null);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
useShallowEffect(() => {
onLoadData();
}, []);
async function onLoadData() {
const loadData = await fetch(
API_RouteNotifikasi.get_all_by_category({
category: categoryPage as any,
page: 1,
})
);
const data = await loadData.json().then((res) => res.data as any);
setData(data);
}
return (
<>
<Box>
{_.isNull(data) ? (
<Notifikasi_ComponentSkeletonView />
) : _.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData as any}
moreData={async () => {
const loadData = await fetch(
API_RouteNotifikasi.get_all_by_category({
category: categoryPage as any,
page: activePage + 1,
})
);
const data = await loadData.json().then((res) => res.data as any);
setActivePage((val) => val + 1);
return data;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage as any}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

61
src/app_modules/notifikasi/_ui/ui_collaboration_notifikasi.tsx
View File

@@ -1,61 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
export default function Notifikasi_UiCollaboration({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: categoryPage as any,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

61
src/app_modules/notifikasi/_ui/ui_donasi_notifikasi.tsx
View File

@@ -1,61 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
export default function Notifikasi_UiDonasi({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: categoryPage as any,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

61
src/app_modules/notifikasi/_ui/ui_forum_notifikasi.tsx
View File

@@ -1,61 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
export default function Notifikasi_UiForum({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: categoryPage as any,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

61
src/app_modules/notifikasi/_ui/ui_investasi_notifikasi.tsx
View File

@@ -1,61 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
export default function Notifikasi_UiInvestasi({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: categoryPage as any,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

74
src/app_modules/notifikasi/_ui/ui_job_notifikasi.tsx
View File

@@ -1,74 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
import { useShallowEffect } from "@mantine/hooks";
export default function Notifikasi_UiJob({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
useShallowEffect(() => {
onLoadData(setData);
}, [setData]);
async function onLoadData(setData: any) {
const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Job",
});
setData(listNotifikasi);
}
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: categoryPage as any,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

105
src/app_modules/notifikasi/_ui/ui_new_layout_notifikasi.tsx
View File

@@ -9,21 +9,22 @@ import {
Container,
Flex,
rem,
Loader,
} from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { gs_notifikasi_kategori_app } from "../lib/global_state";
import { useShallowEffect } from "@mantine/hooks";
import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
export default function Notifikasi_UiNewLayout({
children,
header,
masterKategori,
}: {
children: React.ReactNode;
header?: React.ReactNode;
masterKategori: any[];
}) {
return (
<>
@@ -45,7 +46,7 @@ export default function Notifikasi_UiNewLayout({
>
<UIHeader header={header} />
<UIChildren masterKategori={masterKategori}>{children}</UIChildren>
<UIChildren>{children}</UIChildren>
</BackgroundImage>
</Container>
</Box>
@@ -75,17 +76,77 @@ function UIHeader({ header }: { header: React.ReactNode }) {
);
}
function UIChildren({
children,
masterKategori,
}: {
children: React.ReactNode;
masterKategori: any[];
}) {
function UIChildren({ children }: { children: React.ReactNode }) {
const router = useRouter();
const [mstrKategori, setMstrKategori] = useState(masterKategori);
const [mstrKategori, setMstrKategori] = useState<any[] | null>(null);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
useShallowEffect(() => {
onLoadMaster();
}, []);
async function onLoadMaster() {
const res = await fetch(API_RouteNotifikasi.get_master_kategori());
const data = await res.json();
setMstrKategori(data.data);
}
return (
<>
{_.isNull(mstrKategori) ? (
<SkeletonButton />
) : _.isEmpty(mstrKategori) ? (
<Button w={80} radius={"xl"} c={"gray.5"}>
Null
</Button>
) : (
<Box style={{ zIndex: 0 }} h={"92vh"} px={"xs"} pos={"static"}>
<Box
mb={"xs"}
style={{
display: "flex",
gap: "20px",
position: "relative",
overflowX: "scroll",
scrollbarWidth: "none",
}}
>
<Flex gap={"md"}>
{mstrKategori.map((e, i) => (
<Button
radius={"xl"}
key={i}
c={categoryPage === e.name ? "black" : "gray.5"}
style={{
transition: "0.3s",
backgroundColor:
categoryPage === e.name ? MainColor.yellow : "GrayText",
}}
onClick={() => {
router.replace(
RouterNotifikasi.categoryApp({
name: _.lowerCase(e.name),
}),
{
scroll: false,
}
);
setCategoryPage(e.name);
}}
>
{e.name}
</Button>
))}
</Flex>
</Box>
{children}
</Box>
)}
</>
);
}
function SkeletonButton() {
return (
<>
<Box style={{ zIndex: 0 }} h={"92vh"} px={"xs"} pos={"static"}>
@@ -100,33 +161,25 @@ function UIChildren({
}}
>
<Flex gap={"md"}>
{mstrKategori.map((e, i) => (
{Array.from(new Array(10)).map((e, i) => (
<Button
w={80}
radius={"xl"}
key={i}
c={categoryPage === e.name ? "black" : "gray.5"}
c={"gray.5"}
style={{
transition: "0.3s",
backgroundColor:
categoryPage === e.name ? MainColor.yellow : "GrayText",
}}
onClick={() => {
router.replace(
RouterNotifikasi.categoryApp({ name: _.lowerCase(e.name) }),
{
scroll: false,
}
);
setCategoryPage(e.name);
backgroundColor: "GrayText",
}}
onClick={() => {}}
>
{e.name}
<Loader size={"xs"} color="black" />
</Button>
))}
</Flex>
</Box>
{children}
</Box>
;
</>
);
}

80
src/app_modules/notifikasi/_ui/ui_new_notifikasi.tsx
View File

@@ -1,80 +0,0 @@
"use client";
import { Box, Button, Flex, Stack, Title } from "@mantine/core";
import UIGlobal_LayoutHeaderTamplate from "../../_global/ui/ui_header_tamplate";
import { Notifikasi_ViewNewMain } from "../_view";
import { Notifikasi_UiLayout, Notifikasi_UiView } from "../ui";
import { useState } from "react";
import { MainColor } from "@/app_modules/_global/color";
import { useRouter } from "next/navigation";
import { RouterNotifikasi } from "@/app/lib/router_hipmi/router_notifikasi";
import _ from "lodash";
export default function Notifikasi_UiNewMain({
listNotifikasi,
masterKategori,
categoryName,
}: {
listNotifikasi: any[];
masterKategori: any[];
categoryName: string;
}) {
const router = useRouter();
const [mstrKategori, setMstrKategori] = useState(masterKategori);
const [activeKategori, setActiveKategori] = useState(categoryName);
return (
<>
<Stack>
<Box
style={{
display: "flex",
gap: "20px",
position: "relative",
overflowX: "scroll",
scrollbarWidth: "none",
}}
>
<Flex gap={"md"}>
{mstrKategori.map((e, i) => (
<Button
radius={"xl"}
key={i}
c={categoryName === _.lowerCase(e.name) ? "black" : "gray.5"}
style={{
transition: "0.3s",
backgroundColor:
categoryName === _.lowerCase(e.name)
? MainColor.yellow
: "GrayText",
}}
onClick={() => {
// router.replace(
// RouterNotifikasi.main({ name: _.lowerCase(e.name) }),
// {
// scroll: false,
// }
// );
setActiveKategori(_.lowerCase(e.name));
// onLoadDataNotifikasi(e.name);
}}
>
{e.name}
</Button>
))}
</Flex>
</Box>
<Title>{activeKategori}</Title>
</Stack>
{/* <Notifikasi_UiNewLayout
header={<UIGlobal_LayoutHeaderTamplate title="Notifikasi" />}
>
<Notifikasi_ViewNewMain
// listNotifikasi={listNotifikasi}
// masterKategori={masterKategori}
/>
</Notifikasi_UiNewLayout> */}
</>
);
}

43
src/app_modules/notifikasi/_ui/ui_event_notifikasi.tsx → src/app_modules/notifikasi/_ui/ui_notifikasi.tsx
View File

@@ -1,8 +1,11 @@
"use client";
import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { clientLogger } from "@/util/clientLogger";
import { Box, Center } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
@@ -11,13 +14,11 @@ import {
ComponentNotifiaksi_CardView,
Notifikasi_ComponentSkeletonView,
} from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { apiGetAllNotifikasiByCategory } from "../lib/api_notifikasi";
import { MODEL_NOTIFIKASI } from "../model/interface";
import { useShallowEffect } from "@mantine/hooks";
import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
export default function Notifikasi_UiEvent() {
export default function Notifikasi_UiMain() {
const [data, setData] = useState<MODEL_NOTIFIKASI[] | null>(null);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
@@ -27,11 +28,18 @@ export default function Notifikasi_UiEvent() {
}, []);
async function onLoadData() {
const loadData = await fetch(
API_RouteNotifikasi.get_all_by_category({ category: categoryPage as any, page: 1 })
);
const data = await loadData.json().then((res) => res.data as any);
setData(data);
try {
const respon = await apiGetAllNotifikasiByCategory({
category: categoryPage as any,
page: 1,
});
if (respon.success) {
setData(respon.data);
}
} catch (error) {
clientLogger.error("Error get notifikasi", error);
}
}
return (
@@ -52,16 +60,19 @@ export default function Notifikasi_UiEvent() {
data={data}
setData={setData as any}
moreData={async () => {
const loadData = await fetch(
API_RouteNotifikasi.get_all_by_category({
try {
const respon = await apiGetAllNotifikasiByCategory({
category: categoryPage as any,
page: activePage + 1,
})
);
const data = await loadData.json().then((res) => res.data as any);
});
setActivePage((val) => val + 1);
return data;
if (respon.success) {
setActivePage((val) => val + 1);
return respon.data;
}
} catch (error) {
clientLogger.error("Error get notifikasi", error);
}
}}
>
{(item) => (

61
src/app_modules/notifikasi/_ui/ui_voting_notifikasi.tsx
View File

@@ -1,61 +0,0 @@
"use client";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
export default function Notifikasi_UiVoting({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: categoryPage as any,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
categoryPage={categoryPage}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

10
src/app_modules/notifikasi/lib/api_notifikasi.ts Normal file
View File

@@ -0,0 +1,10 @@
import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
import { ICategoryapp } from "../model/interface";
export const apiGetAllNotifikasiByCategory = async ({category, page}: {category: ICategoryapp; page: number}) => {
const respone = await fetch(
`/api/notifikasi/get-all-by-category?category=${category}&page=${page}`
);
return await respone.json().catch(() => null);
}

5
src/app_modules/notifikasi/ui/index.ts
View File

@@ -1,5 +0,0 @@
import { Notifikasi_UiLayout } from "./ui_layout_notifikasi";
import { Notifikasi_UiView } from "./ui_notifiaksi";
export { Notifikasi_UiLayout };
export { Notifikasi_UiView };

91
src/app_modules/notifikasi/ui/ui_layout_notifikasi.tsx
View File

@@ -1,91 +0,0 @@
"use client";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import {
BackgroundImage,
Box,
Container,
Footer,
rem,
ScrollArea,
} from "@mantine/core";
import React from "react";
export function Notifikasi_UiLayout({
children,
header,
footer,
}: {
children: React.ReactNode;
header?: React.ReactNode;
footer?: React.ReactNode;
}) {
return (
<>
<Box
w={"100%"}
h={"100%"}
style={{
backgroundColor: MainColor.black,
overflowX: "auto",
overflowY: "auto",
position: "fixed",
}}
>
<Container mih={"100vh"} p={0} size={rem(500)} bg={MainColor.darkblue}>
<BackgroundImage
src={"/aset/global/main_background.png"}
h={"100vh"}
style={{ position: "relative" }}
>
<UIHeader header={header} />
<UIChildren footer={footer}>{children}</UIChildren>
</BackgroundImage>
</Container>
</Box>
</>
);
}
function UIHeader({ header }: { header: React.ReactNode }) {
return (
<>
{header ? (
<Box
h={"8vh"}
style={{
zIndex: 10,
}}
w={"100%"}
pos={"sticky"}
top={0}
>
{header}
</Box>
) : (
""
)}
</>
);
}
function UIChildren({
children,
footer,
}: {
children: React.ReactNode;
footer: React.ReactNode;
}) {
return (
<>
<Box style={{ zIndex: 0 }} h={"92vh"} px={"md"} pos={"static"}>
{children}
{/* <ScrollArea h={"100%"} px={"md"}>
</ScrollArea> */}
</Box>
</>
);
}

176
src/app_modules/notifikasi/ui/ui_notifiaksi.tsx
View File

@@ -1,176 +0,0 @@
"use client";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import {
gs_donasi_hot_menu,
gs_donasi_tabs_posting,
} from "@/app_modules/donasi/global_state";
import {
gs_event_hotMenu,
gs_event_status,
} from "@/app_modules/event/global_state";
import {
gs_investas_menu,
gs_investasi_status,
} from "@/app_modules/investasi/g_state";
import {
gs_vote_hotMenu,
gs_vote_status,
} from "@/app_modules/vote/global_state";
import { Box, Button, Center, Flex, Stack } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifiaksi_CardView } from "../component/card_view";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { gs_notifikasi_kategori_app } from "../lib";
import { MODEL_NOTIFIKASI } from "../model/interface";
export function Notifikasi_UiView({
listNotifikasi,
masterKategori,
}: {
listNotifikasi: any[];
masterKategori: any[];
}) {
const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1);
const [mstrKategori, setMstrKategori] = useState(masterKategori);
const [activeKategori, setActiveKategori] = useAtom(
gs_notifikasi_kategori_app
);
// Kategori App
// const [voteMenu, setVoteMenu] = useAtom(gs_vote_hotMenu);
// const [voteStatus, setVoteStatus] = useAtom(gs_vote_status);
// const [eventMenu, setEventMenu] = useAtom(gs_event_hotMenu);
// const [eventStatus, setEventStatus] = useAtom(gs_event_status);
// const [donasiMenu, setDonasiMenu] = useAtom(gs_donasi_hot_menu);
// const [donasiStatus, setDonasiStatus] = useAtom(gs_donasi_tabs_posting);
// const [investasiMenu, setInvestasiMenu] = useAtom(gs_investas_menu);
// const [investasiStatus, setInvestasiStatus] = useAtom(gs_investasi_status);
useShallowEffect(() => {
onLoadDataNotifikasi({ kategoriApp: activeKategori });
}, [activeKategori]);
async function onLoadDataNotifikasi({
kategoriApp,
}: {
kategoriApp: string;
}) {
const loadNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Semua",
});
setData(loadNotifikasi as any);
}
return (
<>
<Stack spacing={"xs"}>
<Box
style={{
display: "flex",
gap: "20px",
position: "relative",
overflowX: "scroll",
scrollbarWidth: "none",
}}
>
<Flex gap={"md"}>
{mstrKategori.map((e, i) => (
<Button
radius={"xl"}
key={i}
c={activeKategori === e.name ? "black" : "gray.5"}
style={{
transition: "0.3s",
backgroundColor:
activeKategori === e.name ? MainColor.yellow : "GrayText",
}}
onClick={() => {
// setActiveKategori(e.name);
// onLoadDataNotifikasi(e.name);
}}
>
{e.name}
</Button>
))}
</Flex>
</Box>
{/* <Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : (
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<ComponentGlobal_Loader />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await notifikasi_getByUserId({
page: activePage + 1,
kategoriApp: activeKategori,
});
// console.log(loadData);
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentNotifiaksi_CardView
data={item}
onLoadData={setData}
activePage={activePage}
activeKategori={activeKategori}
// onSetMenu={(val) => {
// if (item?.kategoriApp === "JOB") {
// setJobMenuId(val.menuId);
// // setJobStatus(val.status);
// }
// // if (item?.kategoriApp === "VOTING") {
// // setVoteMenu(val.menuId);
// // setVoteStatus(val.status);
// // }
// // if (item?.kategoriApp === "EVENT") {
// // setEventMenu(val.menuId);
// // setEventStatus(val.status);
// // }
// // if (item?.kategoriApp === "DONASI") {
// // setDonasiMenu(val.menuId);
// // setDonasiStatus(val.status);
// // }
// // if (item?.kategoriApp === "INVESTASI") {
// // setInvestasiMenu(val.menuId);
// // setInvestasiStatus(val.status);
// // }
// }}
/>
)}
</ScrollOnly>
)}
</Box> */}
</Stack>
</>
);
}

3
src/app_modules/notifikasi/view/index.ts
View File

@@ -1,3 +0,0 @@
import Notifikasi_MainView from "./view_notifikasi";
export { Notifikasi_MainView };

25
src/app_modules/notifikasi/view/view_notifikasi.tsx
View File

@@ -1,25 +0,0 @@
import UIGlobal_LayoutHeaderTamplate from "../../_global/ui/ui_header_tamplate";
import { Notifikasi_UiLayout, Notifikasi_UiView } from "../ui";
export default function Notifikasi_MainView({
listNotifikasi,
masterKategori,
kategoriName,
}: {
listNotifikasi: any[];
masterKategori: any[];
kategoriName: string
}) {
return (
<>
<Notifikasi_UiLayout
header={<UIGlobal_LayoutHeaderTamplate title="Notifikasi" />}
>
<Notifikasi_UiView
listNotifikasi={listNotifikasi}
masterKategori={masterKategori}
/>
</Notifikasi_UiLayout>
</>
);
}

1
src/middleware.ts
View File

@@ -19,6 +19,7 @@ const middlewareConfig: MiddlewareConfig = {
userPath: "/dev/home",
publicRoutes: [
"/",
"/api/collaboration/*",
"/api/notifikasi/*",
"/api/logs/*",
"/api/image/*",