From 82f5b237ae52dc087711452f4bd6baa7acce8a1f Mon Sep 17 00:00:00 2001 From: Bagasbanuna02 Date: Wed, 13 Nov 2024 12:04:45 +0800 Subject: [PATCH 1/2] Fix: Notifikasi Deskripsi: - Fix tampilan & route norifkasi - Pengambilan data diatur per notifikasi agar lebih cepat --- src/app/dev/notifikasi/collaboration/page.tsx | 17 +++ src/app/dev/notifikasi/donasi/page.tsx | 15 ++ src/app/dev/notifikasi/event/page.tsx | 15 ++ src/app/dev/notifikasi/forum/page.tsx | 15 ++ src/app/dev/notifikasi/investasi/page.tsx | 15 ++ src/app/dev/notifikasi/job/page.tsx | 15 ++ src/app/dev/notifikasi/layout.tsx | 22 +++ src/app/dev/notifikasi/page.tsx | 24 ---- src/app/dev/notifikasi/semua/page.tsx | 15 ++ src/app/dev/notifikasi/voting/page.tsx | 15 ++ src/app/lib/router_hipmi/router_notifikasi.ts | 3 +- .../home/component/button_header.tsx | 11 +- src/app_modules/notifikasi/_ui/index.ts | 21 +++ .../notifikasi/_ui/ui_all_notifikasi.tsx | 78 ++++++++++ .../_ui/ui_collaboration_notifikasi.tsx | 61 ++++++++ .../notifikasi/_ui/ui_donasi_notifikasi.tsx | 61 ++++++++ .../notifikasi/_ui/ui_event_notifikasi.tsx | 61 ++++++++ .../notifikasi/_ui/ui_forum_notifikasi.tsx | 61 ++++++++ .../_ui/ui_investasi_notifikasi.tsx | 61 ++++++++ .../notifikasi/_ui/ui_job_notifikasi.tsx | 61 ++++++++ .../_ui/ui_new_layout_notifikasi.tsx | 135 ++++++++++++++++++ .../notifikasi/_ui/ui_new_notifikasi.tsx | 80 +++++++++++ .../notifikasi/_ui/ui_voting_notifikasi.tsx | 61 ++++++++ src/app_modules/notifikasi/_view/index.ts | 3 + .../notifikasi/_view/view_new_notifikasi.tsx | 6 + .../notifikasi/component/card_view.tsx | 25 ++-- .../fun/get/get_notifiaksi_by_id.ts | 12 +- .../notifikasi/lib/global_state.ts | 7 +- .../notifikasi/ui/ui_notifiaksi.tsx | 25 ++-- .../notifikasi/view/view_notifikasi.tsx | 2 + 30 files changed, 941 insertions(+), 62 deletions(-) create mode 100644 src/app/dev/notifikasi/collaboration/page.tsx create mode 100644 src/app/dev/notifikasi/donasi/page.tsx create mode 100644 src/app/dev/notifikasi/event/page.tsx create mode 100644 src/app/dev/notifikasi/forum/page.tsx create mode 100644 src/app/dev/notifikasi/investasi/page.tsx create mode 100644 src/app/dev/notifikasi/job/page.tsx create mode 100644 src/app/dev/notifikasi/layout.tsx delete mode 100644 src/app/dev/notifikasi/page.tsx create mode 100644 src/app/dev/notifikasi/semua/page.tsx create mode 100644 src/app/dev/notifikasi/voting/page.tsx create mode 100644 src/app_modules/notifikasi/_ui/index.ts create mode 100644 src/app_modules/notifikasi/_ui/ui_all_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_collaboration_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_donasi_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_event_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_forum_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_investasi_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_job_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_new_layout_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_new_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_ui/ui_voting_notifikasi.tsx create mode 100644 src/app_modules/notifikasi/_view/index.ts create mode 100644 src/app_modules/notifikasi/_view/view_new_notifikasi.tsx diff --git a/src/app/dev/notifikasi/collaboration/page.tsx b/src/app/dev/notifikasi/collaboration/page.tsx new file mode 100644 index 00000000..78f26b83 --- /dev/null +++ b/src/app/dev/notifikasi/collaboration/page.tsx @@ -0,0 +1,17 @@ +import { + Notifikasi_UiCollaboration +} from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Collaboration", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/donasi/page.tsx b/src/app/dev/notifikasi/donasi/page.tsx new file mode 100644 index 00000000..9af63325 --- /dev/null +++ b/src/app/dev/notifikasi/donasi/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiDonasi } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Donasi", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/event/page.tsx b/src/app/dev/notifikasi/event/page.tsx new file mode 100644 index 00000000..fa2ce235 --- /dev/null +++ b/src/app/dev/notifikasi/event/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiEvent } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Event", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/forum/page.tsx b/src/app/dev/notifikasi/forum/page.tsx new file mode 100644 index 00000000..a27ffea2 --- /dev/null +++ b/src/app/dev/notifikasi/forum/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiForum } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Forum", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/investasi/page.tsx b/src/app/dev/notifikasi/investasi/page.tsx new file mode 100644 index 00000000..d5704862 --- /dev/null +++ b/src/app/dev/notifikasi/investasi/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiDonasi, Notifikasi_UiInvestasi } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Investasi", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/job/page.tsx b/src/app/dev/notifikasi/job/page.tsx new file mode 100644 index 00000000..029dbb80 --- /dev/null +++ b/src/app/dev/notifikasi/job/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiJob } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Job", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/layout.tsx b/src/app/dev/notifikasi/layout.tsx new file mode 100644 index 00000000..8b1e90fc --- /dev/null +++ b/src/app/dev/notifikasi/layout.tsx @@ -0,0 +1,22 @@ +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 ( + <> + } + masterKategori={masterKategori} + > + {children} + + + ); +} diff --git a/src/app/dev/notifikasi/page.tsx b/src/app/dev/notifikasi/page.tsx deleted file mode 100644 index 93689e8a..00000000 --- a/src/app/dev/notifikasi/page.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { ComponentNotifikasi_CardSkeleton } from "@/app_modules/notifikasi/component"; -import { notifikasi_funGetKategoriApp } from "@/app_modules/notifikasi/fun/get/fun_get_kategori_app"; -import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; -import { Notifikasi_MainView } from "@/app_modules/notifikasi/view"; -import { Suspense } from "react"; - -export default async function Page() { - const listNotifikasi = await notifikasi_getByUserId({ - page: 1, - kategoriApp: "Semua", - }); - const masterKategori = await notifikasi_funGetKategoriApp(); - - return ( - <> - }> - - - - ); -} diff --git a/src/app/dev/notifikasi/semua/page.tsx b/src/app/dev/notifikasi/semua/page.tsx new file mode 100644 index 00000000..f9fad445 --- /dev/null +++ b/src/app/dev/notifikasi/semua/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiAll } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Semua", + }); + + return ( + <> + + + ); +} diff --git a/src/app/dev/notifikasi/voting/page.tsx b/src/app/dev/notifikasi/voting/page.tsx new file mode 100644 index 00000000..1dd4b042 --- /dev/null +++ b/src/app/dev/notifikasi/voting/page.tsx @@ -0,0 +1,15 @@ +import { Notifikasi_UiVoting } from "@/app_modules/notifikasi/_ui"; +import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; + +export default async function Page() { + const listNotifikasi = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Voting", + }); + + return ( + <> + + + ); +} diff --git a/src/app/lib/router_hipmi/router_notifikasi.ts b/src/app/lib/router_hipmi/router_notifikasi.ts index e9f43426..aaab9490 100644 --- a/src/app/lib/router_hipmi/router_notifikasi.ts +++ b/src/app/lib/router_hipmi/router_notifikasi.ts @@ -1,3 +1,4 @@ export const RouterNotifikasi = { - main: "/dev/notifikasi", + // main: ({ name }: { name: string }) => `/dev/notifikasi/${name}`, + categoryApp: ({ name }: { name: string }) => `/dev/notifikasi/${name}`, }; diff --git a/src/app_modules/home/component/button_header.tsx b/src/app_modules/home/component/button_header.tsx index ae20d147..44fd0bdc 100644 --- a/src/app_modules/home/component/button_header.tsx +++ b/src/app_modules/home/component/button_header.tsx @@ -59,13 +59,11 @@ export function ComponentHome_ButtonHeaderRight({ }) { const router = useRouter(); const [isLoadingBell, setIsLoadingBell] = useState(false); - const [activeKategori, setActiveKategori] = useAtom( - gs_notifikasi_kategori_app - ); // Notifikasi const [countNtf, setCountNtf] = useState(countNotifikasi); const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); useShallowEffect(() => { // console.log(newUserNtf, "new notif"); @@ -113,9 +111,12 @@ export function ComponentHome_ButtonHeaderRight({ if (dataUser?.Profile === null) { ComponentGlobal_NotifikasiPeringatan("Lengkapi Profile"); } else { - router.push(RouterNotifikasi.main, { scroll: false }); + router.push(RouterNotifikasi.categoryApp({ name: "semua" }), { + scroll: false, + }); + setCategoryPage("Semua"); setIsLoadingBell(true); - setActiveKategori("Semua"); + // setActiveKategori("Semua"); } }} > diff --git a/src/app_modules/notifikasi/_ui/index.ts b/src/app_modules/notifikasi/_ui/index.ts new file mode 100644 index 00000000..9123a834 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/index.ts @@ -0,0 +1,21 @@ +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"; + +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 }; diff --git a/src/app_modules/notifikasi/_ui/ui_all_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_all_notifikasi.tsx new file mode 100644 index 00000000..02553505 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_all_notifikasi.tsx @@ -0,0 +1,78 @@ +"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 _ 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 { MODEL_NOTIFIKASI } from "../model/interface"; +import { useAtom } from "jotai"; +import { gs_notifikasi_kategori_app } from "../lib"; +import { useShallowEffect } from "@mantine/hooks"; + +export default function Notifikasi_UiAll({ + listNotifikasi, +}: { + listNotifikasi: any[]; +}) { + const [data, setData] = useState(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + useShallowEffect(() => { + onLoadData({ + onSetData(val: any) { + setData(val); + }, + }); + }, [setData]); + + async function onLoadData({ onSetData }: { onSetData: any }) { + const loadData = await notifikasi_getByUserId({ + page: 1, + kategoriApp: "Semua", + }); + onSetData(loadData); + } + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_collaboration_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_collaboration_notifikasi.tsx new file mode 100644 index 00000000..22429cb1 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_collaboration_notifikasi.tsx @@ -0,0 +1,61 @@ +"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(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_donasi_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_donasi_notifikasi.tsx new file mode 100644 index 00000000..9943d42f --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_donasi_notifikasi.tsx @@ -0,0 +1,61 @@ +"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(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_event_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_event_notifikasi.tsx new file mode 100644 index 00000000..07a860b2 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_event_notifikasi.tsx @@ -0,0 +1,61 @@ +"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_UiEvent({ + listNotifikasi, +}: { + listNotifikasi: any[]; +}) { + const [data, setData] = useState(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_forum_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_forum_notifikasi.tsx new file mode 100644 index 00000000..57f55d09 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_forum_notifikasi.tsx @@ -0,0 +1,61 @@ +"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(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_investasi_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_investasi_notifikasi.tsx new file mode 100644 index 00000000..5e87ef5d --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_investasi_notifikasi.tsx @@ -0,0 +1,61 @@ +"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(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_job_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_job_notifikasi.tsx new file mode 100644 index 00000000..0b92873d --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_job_notifikasi.tsx @@ -0,0 +1,61 @@ +"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_UiJob({ + listNotifikasi, +}: { + listNotifikasi: any[]; +}) { + const [data, setData] = useState(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_new_layout_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_new_layout_notifikasi.tsx new file mode 100644 index 00000000..064e9f55 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_new_layout_notifikasi.tsx @@ -0,0 +1,135 @@ +"use client"; + +import { RouterNotifikasi } from "@/app/lib/router_hipmi/router_notifikasi"; +import { MainColor } from "@/app_modules/_global/color/color_pallet"; +import { + BackgroundImage, + Box, + Button, + Container, + Flex, + rem, +} 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"; + +export default function Notifikasi_UiNewLayout({ + children, + header, + masterKategori, +}: { + children: React.ReactNode; + header?: React.ReactNode; + masterKategori: any[]; +}) { + return ( + <> + + + + + + {children} + + + + + ); +} + +function UIHeader({ header }: { header: React.ReactNode }) { + return ( + <> + {header ? ( + + {header} + + ) : ( + "" + )} + + ); +} + +function UIChildren({ + children, + masterKategori, +}: { + children: React.ReactNode; + masterKategori: any[]; +}) { + const router = useRouter(); + const [mstrKategori, setMstrKategori] = useState(masterKategori); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + + + {mstrKategori.map((e, i) => ( + + ))} + + + {children} + + + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_new_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_new_notifikasi.tsx new file mode 100644 index 00000000..33cce613 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_new_notifikasi.tsx @@ -0,0 +1,80 @@ +"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 ( + <> + + + + {mstrKategori.map((e, i) => ( + + ))} + + + + {activeKategori} + + {/* } + > + + */} + + ); +} diff --git a/src/app_modules/notifikasi/_ui/ui_voting_notifikasi.tsx b/src/app_modules/notifikasi/_ui/ui_voting_notifikasi.tsx new file mode 100644 index 00000000..ebf8b0e3 --- /dev/null +++ b/src/app_modules/notifikasi/_ui/ui_voting_notifikasi.tsx @@ -0,0 +1,61 @@ +"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(listNotifikasi); + const [activePage, setActivePage] = useState(1); + const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); + + return ( + <> + + {_.isEmpty(data) ? ( + + ) : ( + ( +
+ +
+ )} + 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) => ( + + )} +
+ )} +
+ + ); +} diff --git a/src/app_modules/notifikasi/_view/index.ts b/src/app_modules/notifikasi/_view/index.ts new file mode 100644 index 00000000..72f4d8cd --- /dev/null +++ b/src/app_modules/notifikasi/_view/index.ts @@ -0,0 +1,3 @@ +import Notifikasi_ViewNewMain from "./view_new_notifikasi"; + +export { Notifikasi_ViewNewMain }; diff --git a/src/app_modules/notifikasi/_view/view_new_notifikasi.tsx b/src/app_modules/notifikasi/_view/view_new_notifikasi.tsx new file mode 100644 index 00000000..5fc218f3 --- /dev/null +++ b/src/app_modules/notifikasi/_view/view_new_notifikasi.tsx @@ -0,0 +1,6 @@ +export default function Notifikasi_ViewNewMain(){ + return<> + + + +} \ No newline at end of file diff --git a/src/app_modules/notifikasi/component/card_view.tsx b/src/app_modules/notifikasi/component/card_view.tsx index b7c1af20..963b225a 100644 --- a/src/app_modules/notifikasi/component/card_view.tsx +++ b/src/app_modules/notifikasi/component/card_view.tsx @@ -5,35 +5,26 @@ import { AccentColor, MainColor, } from "@/app_modules/_global/color/color_pallet"; +import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component"; import { gs_job_hot_menu } from "@/app_modules/job/global_state"; import { Badge, Card, Divider, Group, Stack, Text } from "@mantine/core"; import { IconCheck, IconChecks } from "@tabler/icons-react"; import { useAtom } from "jotai"; import { useRouter } from "next/navigation"; -import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id"; -import { MODEL_NOTIFIKASI } from "../model/interface"; -import { redirectDetailCollaborationPage } from "./path/collaboration"; -import { redirectDonasiPage } from "./path/donasi"; -import { redirectEventPage } from "./path/event"; -import { redirectDetailForumPage } from "./path/forum"; -import { redirectInvestasiPage } from "./path/investasi"; -import { notifikasi_jobCheckStatus } from "./path/job"; -import { redirectVotingPage } from "./path/voting"; import { useState } from "react"; -import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/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 { notifikasi_jobCheckStatus } from "./path/job"; export function ComponentNotifiaksi_CardView({ data, onLoadData, - activePage, - // onSetMenu, - activeKategori, + categoryPage, }: { data: MODEL_NOTIFIKASI; onLoadData: (val: any) => void; - activePage: number; - // onSetMenu: (val: any) => void; - activeKategori: string; + categoryPage: any; }) { const router = useRouter(); const [visible, setVisible] = useState(false); @@ -64,7 +55,7 @@ export function ComponentNotifiaksi_CardView({ if (checkStatus?.success) { const loadListNotifikasi = await notifikasi_getByUserId({ page: 1, - kategoriApp: activeKategori, + kategoriApp: "Job", }); onLoadData(loadListNotifikasi); diff --git a/src/app_modules/notifikasi/fun/get/get_notifiaksi_by_id.ts b/src/app_modules/notifikasi/fun/get/get_notifiaksi_by_id.ts index da99d45a..98cbb175 100644 --- a/src/app_modules/notifikasi/fun/get/get_notifiaksi_by_id.ts +++ b/src/app_modules/notifikasi/fun/get/get_notifiaksi_by_id.ts @@ -4,12 +4,22 @@ import prisma from "@/app/lib/prisma"; import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; import _ from "lodash"; +type ICategoryapp = + | "Semua" + | "Event" + | "Job" + | "Voting" + | "Donasi" + | "Investasi" + | "Forum" + | "Collaboration"; + export default async function notifikasi_getByUserId({ page, kategoriApp, }: { page: number; - kategoriApp?: string; + kategoriApp?: ICategoryapp }) { console.log(page, "ini page"); console.log(kategoriApp, "ini kategori"); diff --git a/src/app_modules/notifikasi/lib/global_state.ts b/src/app_modules/notifikasi/lib/global_state.ts index 61b08704..cb29f318 100644 --- a/src/app_modules/notifikasi/lib/global_state.ts +++ b/src/app_modules/notifikasi/lib/global_state.ts @@ -1,6 +1,9 @@ +import { atom } from "jotai"; import { atomWithStorage } from "jotai/utils"; export const gs_notifikasi_kategori_app = atomWithStorage( "gs_notifikasi_kategori_app", - "Semua" -) + "" +); + +// export const gs_notifikasi_page = atom(""); diff --git a/src/app_modules/notifikasi/ui/ui_notifiaksi.tsx b/src/app_modules/notifikasi/ui/ui_notifiaksi.tsx index 5a15fb79..6f19330b 100644 --- a/src/app_modules/notifikasi/ui/ui_notifiaksi.tsx +++ b/src/app_modules/notifikasi/ui/ui_notifiaksi.tsx @@ -45,14 +45,14 @@ export function Notifikasi_UiView({ ); // 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); + // 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 }); @@ -65,7 +65,7 @@ export function Notifikasi_UiView({ }) { const loadNotifikasi = await notifikasi_getByUserId({ page: 1, - kategoriApp: kategoriApp, + kategoriApp: "Semua", }); setData(loadNotifikasi as any); @@ -96,7 +96,8 @@ export function Notifikasi_UiView({ activeKategori === e.name ? MainColor.yellow : "GrayText", }} onClick={() => { - setActiveKategori(e.name); + + // setActiveKategori(e.name); // onLoadDataNotifikasi(e.name); }} > @@ -106,7 +107,7 @@ export function Notifikasi_UiView({ - + {/* {_.isEmpty(data) ? ( ) : ( @@ -168,7 +169,7 @@ export function Notifikasi_UiView({ )} )} - + */} ); diff --git a/src/app_modules/notifikasi/view/view_notifikasi.tsx b/src/app_modules/notifikasi/view/view_notifikasi.tsx index 121c50a0..c295a81d 100644 --- a/src/app_modules/notifikasi/view/view_notifikasi.tsx +++ b/src/app_modules/notifikasi/view/view_notifikasi.tsx @@ -4,9 +4,11 @@ import { Notifikasi_UiLayout, Notifikasi_UiView } from "../ui"; export default function Notifikasi_MainView({ listNotifikasi, masterKategori, + kategoriName, }: { listNotifikasi: any[]; masterKategori: any[]; + kategoriName: string }) { return ( <> From afe7040d0e0cf220cdf362b46c4d5bc730196f71 Mon Sep 17 00:00:00 2001 From: Bagasbanuna02 Date: Wed, 13 Nov 2024 12:06:13 +0800 Subject: [PATCH 2/2] Fix version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index dcaedb90..1cd35656 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hipmi", - "version": "1.1.0", + "version": "1.1.1", "private": true, "prisma": { "seed": "npx tsx prisma/seed.ts"