Fix: Event

Deksripsi
- Fix notifikasi
- Fix load beranda
- Fix reload button di admin

src/app_modules/home/component/button_header.tsx

@@ -15,7 +15,7 @@ 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 { useEffect, useState } from "react";
 import { MODEL_USER } from "../model/interface";
 
 export function ComponentHome_ButtonHeaderLeft({
@@ -61,47 +61,27 @@ export function ComponentHome_ButtonHeaderRight({
   const [isLoadingBell, setIsLoadingBell] = useState(false);
 
   // Notifikasi
-  const [countNtf, setCountNtf] = useState(countNotifikasi);
-  const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf);
+  // 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");
-    // console.log(countNtf, "count ntf");
-    setCountNtf(countNtf + newUserNtf);
-    setNewUserNtf(0);
-
-    onLoadNotifikasi({
-      onLoad(val) {
-        console.log(val, "total notif");
-        setCountNtf(val);
-      },
-    });
-  }, [newUserNtf, setCountNtf]);
-
-  // useShallowEffect(() => {
-  //   mqtt_client.subscribe("USER");
-
-  //   mqtt_client.on("message", (topic: any, message: any) => {
-  //     // console.log(topic);
-  //     const data = JSON.parse(message.toString());
-
-  //     if (data.userId === dataUser.id) {
-  //       setCountNtf(countNtf + data.count);
-  //     }
-  //   });
-
+  // useEffect(() => {
   //   onLoadNotifikasi({
   //     onLoad(val) {
   //       setCountNtf(val);
   //     },
   //   });
-  // }, [countNtf]);
+  // }, [setCountNtf]);
 
-  async function onLoadNotifikasi({ onLoad }: { onLoad: (val: any) => void }) {
-    const loadNotif = await notifikasi_countUserNotifikasi();
-    onLoad(loadNotif);
-  }
+  // useShallowEffect(() => {
+  //   setCountNtf(countNtf + newUserNtf);
+  //   setNewUserNtf(0);
+  // }, [newUserNtf, setCountNtf]);
+
+  // async function onLoadNotifikasi({ onLoad }: { onLoad: (val: any) => void }) {
+  //   const loadNotif = await notifikasi_countUserNotifikasi();
+  //   onLoad(loadNotif);
+  // }
 
   return (
     <>
@@ -116,13 +96,12 @@ export function ComponentHome_ButtonHeaderRight({
             });
             setCategoryPage("Semua");
             setIsLoadingBell(true);
-            // setActiveKategori("Semua");
           }
         }}
       >
         {isLoadingBell ? (
           <Loader color={AccentColor.yellow} size={20} />
-        ) : countNtf === 0 ? (
+        ) : countNotifikasi === 0 ? (
           <IconBell color="white" />
         ) : (
           <Indicator
@@ -130,7 +109,7 @@ export function ComponentHome_ButtonHeaderRight({
             color={MainColor.yellow}
             label={
               <Text fz={10} c={MainColor.darkblue}>
-                {countNtf > 99 ? "99+" : countNtf}
+                {countNotifikasi > 99 ? "99+" : countNotifikasi}
               </Text>
             }
           >

src/app_modules/home/view_home.tsx

@@ -1,3 +1,6 @@
+"use client";
+
+import { useEffect, useState } from "react";
 import UIGlobal_LayoutHeaderTamplate from "../_global/ui/ui_header_tamplate";
 import UIGlobal_LayoutTamplate from "../_global/ui/ui_layout_tamplate";
 import { MODEL_JOB } from "../job/model/interface";
@@ -7,6 +10,10 @@ import {
 } from "./component/button_header";
 import { Home_UiFooter, Home_UiView } from "./component/ui_home";
 import { MODEL_USER } from "./model/interface";
+import { useShallowEffect } from "@mantine/hooks";
+import { gs_count_ntf, gs_user_ntf } from "@/app/lib/global_state";
+import { useAtom } from "jotai";
+import notifikasi_countUserNotifikasi from "../notifikasi/fun/count/fun_count_by_id";
 
 export default function HomeView({
   dataUser,
@@ -17,8 +24,29 @@ export default function HomeView({
   dataJob: MODEL_JOB[];
   countNotifikasi: number;
 }) {
-  
+  const [countNtf, setCountNtf] = useState(countNotifikasi);
+  const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf);
+  const [countLoadNtf, setCountLoadNtf] = useAtom(gs_count_ntf);
 
+  useShallowEffect(() => {
+    onLoadNotifikasi({
+      onLoad(val) {
+        setCountNtf(val);
+      },
+    });
+
+    setCountNtf(countLoadNtf as any);
+  }, [countLoadNtf, setCountNtf]);
+
+  useShallowEffect(() => {
+    setCountNtf(countNtf + newUserNtf);
+    setNewUserNtf(0);
+  }, [newUserNtf, setCountNtf]);
+
+  async function onLoadNotifikasi({ onLoad }: { onLoad: (val: any) => void }) {
+    const loadNotif = await notifikasi_countUserNotifikasi();
+    onLoad(loadNotif);
+  }
 
   return (
     <>
@@ -32,7 +60,7 @@ export default function HomeView({
             customButtonRight={
               <ComponentHome_ButtonHeaderRight
                 dataUser={dataUser}
-                countNotifikasi={countNotifikasi}
+                countNotifikasi={countNtf}
               />
             }
           />