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

Fix notifikasi server action to API

Browse Source
This commit is contained in:
Bagasbanuna02
2024-12-19 06:34:12 +08:00
parent 6bb690e0b5
commit 2322ab8444
43 changed files with 507 additions and 1031 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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>
</>
);
}