From bde7a136e2d131f6d4056ee543869887698a5c6f Mon Sep 17 00:00:00 2001
From: amel <amel@amel.local>
Date: Tue, 1 Oct 2024 11:44:51 +0800
Subject: [PATCH] upd: realtime

deskripsi:
- coba realtime
- api version

No Issues
---
 src/app/api/version-app/route.ts              | 10 +++++++
 src/app/test/_ui/RealtimePage.tsx             |  3 +-
 .../components/notification_custome.tsx       |  6 ++--
 src/module/_global/components/wrap_layout.tsx | 30 ++++++++++++++++++-
 src/module/home/ui/view_home.tsx              |  6 ----
 5 files changed, 44 insertions(+), 11 deletions(-)
 create mode 100644 src/app/api/version-app/route.ts

diff --git a/src/app/api/version-app/route.ts b/src/app/api/version-app/route.ts
new file mode 100644
index 0000000..0e22514
--- /dev/null
+++ b/src/app/api/version-app/route.ts
@@ -0,0 +1,10 @@
+import { NextResponse } from "next/server";
+
+export async function GET(request: Request) {
+   try {
+      return NextResponse.json({ success: true, version: "0.1" }, { status: 200 });
+   } catch (error) {
+      console.error(error);
+      return NextResponse.json({ success: false, version: "Gagal mendapatkan version, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
+   }
+}
diff --git a/src/app/test/_ui/RealtimePage.tsx b/src/app/test/_ui/RealtimePage.tsx
index d962bf3..85fdf63 100644
--- a/src/app/test/_ui/RealtimePage.tsx
+++ b/src/app/test/_ui/RealtimePage.tsx
@@ -15,7 +15,8 @@ export function RealtimePage({ wibuKey }: { wibuKey: string }) {
 
    async function onTekan() {
       setData({
-         name: Math.random().toString(),
+         title: Math.random().toString(),
+         desc: 'Anda memiliki pengumuman baru. Silahkan periksa detailnya.'
       })
    }
    return (
diff --git a/src/module/_global/components/notification_custome.tsx b/src/module/_global/components/notification_custome.tsx
index eb47e9e..72fe2fa 100644
--- a/src/module/_global/components/notification_custome.tsx
+++ b/src/module/_global/components/notification_custome.tsx
@@ -13,14 +13,14 @@ export default function NotificationCustome({ onClose, title, desc, onClick }: {
   useShallowEffect(() => {
     const timer = setTimeout(() => {
       setOpened(true);
-    }, 2000);
+    },50);
     return () => clearTimeout(timer);
   }, []);
 
   useShallowEffect(() => {
     const timer = setTimeout(() => {
       setOpened(false)
-    }, 6000);
+    }, 2000);
     return () => clearTimeout(timer);
   }, []);
 
@@ -42,7 +42,7 @@ export default function NotificationCustome({ onClose, title, desc, onClick }: {
                 ...state,
                 zIndex: 999,
                 position: 'fixed',
-                top: 50,
+                top: 10,
                 display: 'flex',
                 margin: 20,
                 justifyContent: 'center',
diff --git a/src/module/_global/components/wrap_layout.tsx b/src/module/_global/components/wrap_layout.tsx
index d4ae575..85041d6 100644
--- a/src/module/_global/components/wrap_layout.tsx
+++ b/src/module/_global/components/wrap_layout.tsx
@@ -2,12 +2,19 @@
 import { useHookstate } from "@hookstate/core";
 import { globalNotifPage, globalRole, TEMA } from "../bin/val_global";
 import { useShallowEffect } from "@mantine/hooks";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
+import { useWibuRealtime } from "wibu-realtime";
+import NotificationCustome from "./notification_custome";
 
 export default function WrapLayout({ children, role, theme, user }: { children: React.ReactNode, role: any, theme: any, user: any }) {
    const roleLogin = useHookstate(globalRole)
    const tema = useHookstate(TEMA)
    const notifLoadPage = useHookstate(globalNotifPage)
+   const [tampilNotif, setTampilNotif] = useState(false)
+   const [data, setData] = useWibuRealtime({
+      WIBU_REALTIME_TOKEN: 'padahariminggukuturutayahkekotanaikdelmanistimewakududukdimuka',
+      project: "sdm"
+   })
 
    useEffect(() => {
       roleLogin.set(role)
@@ -15,8 +22,29 @@ export default function WrapLayout({ children, role, theme, user }: { children:
       // eslint-disable-next-line react-hooks/exhaustive-deps
    }, [role, theme])
 
+   useShallowEffect(() => {
+      if (data) {
+         setTampilNotif(true)
+
+         setTimeout(() => {
+            setTampilNotif(false);
+         }, 3000);
+      }
+   }, [data])
+
    return (
       <>
+         {JSON.stringify(data)}
+         {
+            tampilNotif &&
+            <NotificationCustome
+               title={data?.title}
+               desc={data?.desc}
+               onClick={() => { '' }}
+               onClose={() => { '' }}
+            />
+         }
+
          {children}
       </>
    );
diff --git a/src/module/home/ui/view_home.tsx b/src/module/home/ui/view_home.tsx
index 2555a78..a91b619 100644
--- a/src/module/home/ui/view_home.tsx
+++ b/src/module/home/ui/view_home.tsx
@@ -26,12 +26,6 @@ export default function ViewHome() {
         }
         title='UPDATE'
       /> */}
-      {/* <NotificationCustome
-        title='Pengumuman'
-        desc='Pengumuman Upacara bendera Upacara bendera Upacara bendera Upacara bendera Upacara bendera'
-        onClick={() => {''}}
-        onClose={() => {''}}
-      /> */}
       <Box p={20}>
         <Stack >
           <Carosole />