Fix notifikasi count di home

This commit is contained in:
2024-12-19 12:08:27 +08:00
parent 09c4a878c0
commit c9291a749d
10 changed files with 361 additions and 203 deletions

View File

@@ -1,5 +1,6 @@
"use client";
import { IRealtimeData } from "@/app/lib/global_state";
import { RouterAdminJob } from "@/app/lib/router_admin/router_admin_job";
import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
@@ -8,7 +9,6 @@ import { ComponentAdminGlobal_TitlePage } from "@/app_modules/admin/_admin_globa
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
import { MODEL_JOB } from "@/app_modules/job/model/interface";
import mqtt_client from "@/util/mqtt_client";
import {
Button,
Center,
@@ -22,11 +22,12 @@ import {
Table,
Text,
TextInput,
Textarea
Textarea,
} from "@mantine/core";
import { IconBan, IconPhotoCheck, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { WibuRealtime } from "wibu-pkg";
import { AdminJob_funEditCatatanById } from "../../fun/edit/fun_edit_catatan_by_id";
import adminJob_getListReject from "../../fun/get/get_list_reject";
@@ -311,7 +312,7 @@ async function onReject({
const loadData = await adminJob_getListReject({ page: 1 });
onSetData(loadData);
const dataNotif = {
const dataNotifikasi: IRealtimeData = {
appId: reject.data?.id as any,
status: reject.data?.MasterStatus?.name as any,
userId: reject.data?.authorId as any,
@@ -321,14 +322,15 @@ async function onReject({
};
const notif = await adminNotifikasi_funCreateToUser({
data: dataNotif as any,
data: dataNotifikasi as any,
});
if (notif.status === 201) {
mqtt_client.publish(
"USER",
JSON.stringify({ userId: reject?.data?.authorId, count: 1 })
);
WibuRealtime.setData({
type: "notification",
pushNotificationTo: "USER",
dataMessage: dataNotifikasi,
});
}
ComponentGlobal_NotifikasiBerhasil(reject.message);

View File

@@ -1,5 +1,7 @@
"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";
@@ -9,46 +11,35 @@ import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MainColor } from "../_global/color";
import { ComponentGlobal_NotifikasiPeringatan } from "../_global/notif_global";
import UIGlobal_LayoutHeaderTamplate from "../_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "../_global/ui/ui_layout_tamplate";
import notifikasi_countUserNotifikasi from "../notifikasi/fun/count/fun_count_by_id";
import { 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";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import { gs_notifikasi_kategori_app } from "../notifikasi/lib";
export default function HomeViewNew({
countNotifikasi,
}: {
countNotifikasi: number;
}) {
const [countNtf, setCountNtf] = useState(countNotifikasi);
export default function HomeViewNew() {
const [countNtf, setCountNtf] = useAtom(gs_count_ntf);
const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf);
const [countLoadNtf, setCountLoadNtf] = useAtom(gs_count_ntf);
const [dataUser, setDataUser] = useState<any>({});
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
const router = useRouter();
useShallowEffect(() => {
onLoadNotifikasi({
onLoad(val) {
setCountNtf(val);
},
});
setCountNtf(countLoadNtf as any);
}, [countLoadNtf, setCountNtf]);
onLoadNotifikasi();
}, []);
useShallowEffect(() => {
setCountNtf(countNtf + newUserNtf);
setNewUserNtf(0);
}, [newUserNtf, setCountNtf]);
if (countNtf != null) {
setCountNtf(countNtf + newUserNtf);
setNewUserNtf(0);
}
}, [newUserNtf, countNtf]);
async function onLoadNotifikasi({ onLoad }: { onLoad: (val: any) => void }) {
const loadNotif = await notifikasi_countUserNotifikasi();
onLoad(loadNotif);
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(() => {
@@ -75,6 +66,7 @@ export default function HomeViewNew({
customButtonLeft={
<ActionIcon
radius={"xl"}
disabled={countNtf == null}
variant={"transparent"}
onClick={() => {
if (
@@ -93,6 +85,7 @@ export default function HomeViewNew({
customButtonRight={
<ActionIcon
variant="transparent"
disabled={countNtf == null}
onClick={() => {
if (
dataUser.profile === undefined ||
@@ -100,24 +93,23 @@ export default function HomeViewNew({
) {
router.push(RouterProfile.create, { scroll: false });
} else {
setCategoryPage("Semua")
setCategoryPage("Semua");
router.push(
RouterNotifikasi.categoryApp({ name: "semua" }),
{
scroll: false,
}
);
}
}}
>
{countNotifikasi > 0 ? (
{countNtf != null && countNtf > 0 ? (
<Indicator
processing
color={MainColor.yellow}
label={
<Text fz={10} c={MainColor.darkblue}>
{countNotifikasi > 99 ? "99+" : countNotifikasi}
{countNtf > 99 ? "99+" : countNtf}
</Text>
}
>
@@ -137,137 +129,3 @@ 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>
// </>
// );
// }