Notifikasi Forum

# feat
- Notif jika ada postingan baru
## No issue

prisma/schema.prisma

@@ -865,8 +865,8 @@ model Notifikasi {
   Role       MasterUserRole? @relation(fields: [userRoleId], references: [id])
   userRoleId String
 
-  User    User   @relation("UserNotifikasi", fields: [userId], references: [id], map: "NotifikasiUser")
+  User    User    @relation("UserNotifikasi", fields: [userId], references: [id], map: "NotifikasiUser")
   userId  String
-  Admin   User   @relation("AdminNotifikasi", fields: [adminId], references: [id], map: "NotifikasiAdmin")
+  Admin   User?   @relation("AdminNotifikasi", fields: [adminId], references: [id], map: "NotifikasiAdmin")
-  adminId String
+  adminId String?
 }

src/app/dev/forum/main/page.tsx

@@ -1,11 +1,14 @@
 
 import { Forum_Beranda } from "@/app_modules/forum";
 import { forum_getListAllPosting } from "@/app_modules/forum/fun/get/get_list_all_posting";
+import { forum_new_getAllPosting } from "@/app_modules/forum/fun/get/new_get_all_posting";
+import forum_v2_getAllPosting from "@/app_modules/forum/fun/get/v2_get_all_posting";
 import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
 
 export default async function Page() {
-  const listForum = await forum_getListAllPosting();
+  const listForum = await forum_v2_getAllPosting({});
   const userLoginId = await user_getOneUserId();
+
   return (
     <>
       <Forum_Beranda

src/app_modules/forum/component/beranda/beranda_button_more.tsx

@@ -219,12 +219,14 @@ function ButtonDelete({
     setOpenDel(false);
     await forum_funDeletePostingById(postingId as any).then(async (res) => {
       if (res.status === 200) {
-        ComponentGlobal_NotifikasiBerhasil(`Postingan Terhapus`, 2000);
+        // ComponentGlobal_NotifikasiBerhasil(`Postingan Terhapus`, 2000);
         setLoading(true);
         const listForum = await forum_getListAllPosting();
         setData(listForum);
+        return null;
       } else {
-        ComponentGlobal_NotifikasiGagal(res.message);
+        // ComponentGlobal_NotifikasiGagal(res.message);
+        return null;
       }
     });
   }
@@ -273,19 +275,34 @@ function ButtonStatus({
   async function onTutupForum() {
     setOpenStatus(false);
 
-    await forum_funEditStatusPostingById(postingId as any, 2).then(
+    const upateStatusClose = await forum_funEditStatusPostingById(
-      async (res) => {
+      postingId as any,
-        if (res.status === 200) {
+      2
-          await forum_getListAllPosting().then((val) => {
-            setData(val as any);
-            ComponentGlobal_NotifikasiBerhasil(`Forum Ditutup`, 2000);
-            setLoading(true);
-          });
-        } else {
-          ComponentGlobal_NotifikasiGagal(res.message);
-        }
-      }
     );
+    if (upateStatusClose.status === 200) {
+      const loadData = await forum_getListAllPosting();
+      // ComponentGlobal_NotifikasiBerhasil(`Forum Ditutup`, 2000);
+      setData(loadData);
+      setLoading(true);
+      return null;
+    } else {
+      //  ComponentGlobal_NotifikasiGagal(upateStatusClose.message);
+      return null;
+    }
+
+    // await forum_funEditStatusPostingById(postingId as any, 2).then(
+    //   async (res) => {
+    //     if (res.status === 200) {
+    //       await forum_getListAllPosting().then((val) => {
+    //         setData(val as any);
+    //         ComponentGlobal_NotifikasiBerhasil(`Forum Ditutup`, 2000);
+    //         setLoading(true);
+    //       });
+    //     } else {
+    //       ComponentGlobal_NotifikasiGagal(res.message);
+    //     }
+    //   }
+    // );
   }
 
   async function onBukaForum() {

src/app_modules/forum/component/beranda/beranda_card.tsx

@@ -37,9 +37,6 @@ export default function ComponentForum_BerandaCardView({
         {data.map((e, i) => (
           <Card key={i}>
             <Card.Section>
-              {/* <pre>{JSON.stringify(e.Author.id, null, 2)}</pre>
-              <pre>{JSON.stringify(userLoginId, null, 2)}</pre> */}
-
               <ComponentForum_BerandaAuthorNameOnHeader
                 authorName={e?.Author?.Profile?.name}
                 imagesId={e?.Author?.Profile?.imagesId}
@@ -52,11 +49,11 @@ export default function ComponentForum_BerandaCardView({
                 setData={setData}
               />
             </Card.Section>
+
             <Card.Section
               sx={{ zIndex: 0 }}
               p={"lg"}
               onClick={() => {
-                // console.log("halaman forum");
                 setLoadingDetail(true);
                 router.push(RouterForum.main_detail + e.id);
               }}
@@ -65,6 +62,7 @@ export default function ComponentForum_BerandaCardView({
                 <div dangerouslySetInnerHTML={{ __html: e.diskusi }} />
               </Text>
             </Card.Section>
+            
             <Card.Section>
               <Stack>
                 <Group spacing={"xs"} px={"sm"}>

src/app_modules/forum/component/card_loader.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { Overlay, Center, Loader } from "@mantine/core";
+
+export default function ComponentForum_CardLoadingOverlay({
+  size,
+  variant,
+}: {
+  size?: number;
+  variant?: any;
+}) {
+  return (
+    <>
+      <Overlay h={"100%"} opacity={0.1} >
+        <Center h={"100%"}>
+          <Loader
+            variant={variant ? variant : "oval"}
+            size={size ? size : 20}
+            color="gray"
+          />
+        </Center>
+      </Overlay>
+    </>
+  );
+}

src/app_modules/forum/component/main_component/card_header.tsx

@@ -0,0 +1,146 @@
+"use client";
+
+import loading from "@/app/dev/home/loading";
+import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
+import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
+import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_global/notif_global/notifikasi_peringatan";
+import {
+  Stack,
+  Loader,
+  Avatar,
+  Badge,
+  Group,
+  Divider,
+  Grid,
+  Text,
+} from "@mantine/core";
+import { IconCircle } from "@tabler/icons-react";
+import ComponentForum_BerandaButtonMore from "../beranda/beranda_button_more";
+import { MODEL_USER } from "@/app_modules/home/model/interface";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { MODEL_FORUM_POSTING } from "../../model/interface";
+import ComponentForum_V2_CardMoreButton from "./card_more_button";
+
+export default function ComponentForum_V2_HeaderCard({
+  data,
+  isMoreButton,
+  userLoginId,
+  onLoadData,
+}: {
+  data: MODEL_FORUM_POSTING;
+  isMoreButton: boolean;
+  userLoginId: string;
+  onLoadData: (val: any) => void
+}) {
+  const router = useRouter();
+  const [isLoading, setIsLoading] = useState(false);
+
+  return (
+    <>
+      <Stack spacing={"xs"}>
+        <Grid align="center">
+          <Grid.Col
+            span={"content"}
+            onClick={() => {
+              if (data.Author.id) {
+                setIsLoading(true);
+                router.push(RouterForum.forumku + data.Author.id);
+              } else {
+                ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
+              }
+            }}
+          >
+            {isLoading ? (
+              <Loader color="gray" variant="dots" />
+            ) : (
+              <Avatar
+                size={40}
+                sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
+                radius={"xl"}
+                bg={"gray.1"}
+                src={
+                  data.Author.Profile.imagesId
+                    ? RouterProfile.api_foto_profile +
+                      data.Author.Profile.imagesId
+                    : "/aset/global/avatar.png"
+                }
+              />
+            )}
+          </Grid.Col>
+
+          <Grid.Col span={"auto"}>
+            <Stack justify="center" h={"100%"} spacing={3}>
+              <Grid>
+                <Grid.Col span={"auto"}>
+                  <Text lineClamp={1} fz={"sm"} fw={"bold"}>
+                    {data.Author.username
+                      ? data.Author.username
+                      : "Nama author  "}
+                  </Text>
+                </Grid.Col>
+                <Grid.Col span={"content"}></Grid.Col>
+              </Grid>
+
+              <Badge
+                w={70}
+                variant="light"
+                color={
+                  (data.ForumMaster_StatusPosting.id as any) === 1
+                    ? "green"
+                    : "red"
+                }
+              >
+                <Text fz={10}>
+                  {(data.ForumMaster_StatusPosting.id as any) === 1
+                    ? "Open"
+                    : "Close"}
+                </Text>
+              </Badge>
+            </Stack>
+          </Grid.Col>
+
+          <Grid.Col span={"content"}>
+            <Group position="center" spacing={"xs"}>
+              <Group spacing={3}>
+                <Text c={"gray"} fz={"sm"}>
+                  {data.createdAt
+                    ? data.createdAt.toLocaleDateString(["id-ID"], {
+                        day: "numeric",
+                        month: "short",
+                      })
+                    : new Date().toLocaleDateString(["id-ID"], {
+                        day: "numeric",
+                        month: "short",
+                      })}
+
+                  <IconCircle
+                    size={5}
+                    color="gray"
+                    style={{ marginLeft: "5px" }}
+                  />
+                </Text>
+              </Group>
+
+              {isMoreButton ? (
+                <Group position="right">
+                  <ComponentForum_V2_CardMoreButton
+                    authorId={data?.Author.id}
+                    postingId={data?.id}
+                    statusId={data?.ForumMaster_StatusPosting.id}
+                    userLoginId={userLoginId}
+                    onLoadData={onLoadData}
+                  />
+
+                </Group>
+              ) : (
+                ""
+              )}
+            </Group>
+          </Grid.Col>
+        </Grid>
+        {/* {isPembatas ? <Divider /> : ""} */}
+      </Stack>
+    </>
+  );
+}

src/app_modules/forum/component/main_component/card_more_button.tsx

@@ -0,0 +1,350 @@
+"use client";
+
+import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
+import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
+import {
+  ActionIcon,
+  Button,
+  Drawer,
+  Grid,
+  Group,
+  Loader,
+  Modal,
+  Stack,
+  Text,
+  Title,
+} from "@mantine/core";
+import { useDisclosure } from "@mantine/hooks";
+import {
+  IconDots,
+  IconEdit,
+  IconFlag3,
+  IconSquareCheck,
+  IconSquareRoundedX,
+  IconTrash,
+} from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/component_global/notif_global/notifikasi_gagal";
+import { forum_funDeletePostingById } from "../../fun/delete/fun_delete_posting_by_id";
+import { forum_funEditStatusPostingById } from "../../fun/edit/fun_edit_status_posting_by_id";
+import { forum_getListAllPosting } from "../../fun/get/get_list_all_posting";
+import { forum_new_getAllPosting } from "../../fun/get/new_get_all_posting";
+import forum_v2_getAllPosting from "../../fun/get/v2_get_all_posting";
+
+export default function ComponentForum_V2_CardMoreButton({
+  authorId,
+  postingId,
+  statusId,
+  userLoginId,
+  onLoadData,
+}: {
+  authorId: any;
+  postingId?: any;
+  statusId?: any;
+  userLoginId: any;
+  onLoadData: (val: any) => void;
+}) {
+  const router = useRouter();
+
+  // modal & drawer
+  const [opened, { open, close }] = useDisclosure(false);
+  const [openDel, setOpenDel] = useState(false);
+  const [openStatusClose, setOpenStatusClose] = useState(false);
+
+  // loading
+  const [loadingEdit, setLoadingEdit] = useState(false);
+  const [loadingReport, setLoadingReport] = useState(false);
+
+  //   if (loadingEdit) return <ComponentGlobal_V2_LoadingPage />;
+
+  return (
+    <>
+      <Drawer
+        // className={classes.radiusCustom}
+        opened={opened}
+        onClose={close}
+        withCloseButton={false}
+        overlayProps={{ opacity: 0.1, blur: 1 }}
+        position="bottom"
+        size={"auto"}
+      >
+        <Stack>
+          {userLoginId != authorId ? (
+            ""
+          ) : (
+            <Stack>
+              <Grid
+                onClick={() => {
+                  close();
+                  setOpenStatusClose(true);
+                }}
+              >
+                <Grid.Col span={"content"}>
+                  {statusId === 1 ? (
+                    <IconSquareRoundedX color="red" />
+                  ) : (
+                    <IconSquareCheck />
+                  )}
+                </Grid.Col>
+                <Grid.Col span={"auto"}>
+                  {statusId === 1 ? (
+                    <Text c={"red"}>Tutup forum</Text>
+                  ) : (
+                    <Text>Buka forum</Text>
+                  )}
+                </Grid.Col>
+              </Grid>
+
+              <Grid
+                onClick={() => {
+                  close();
+                  setOpenDel(true);
+                }}
+              >
+                <Grid.Col span={"content"}>
+                  <IconTrash color="red" />
+                </Grid.Col>
+                <Grid.Col span={"auto"}>
+                  <Text c={"red"}>Hapus</Text>
+                </Grid.Col>
+              </Grid>
+
+              <Grid
+                onClick={() => {
+                  setLoadingEdit(true);
+                  router.push(RouterForum.edit_posting + postingId);
+                }}
+              >
+                <Grid.Col span={"content"}>
+                  <IconEdit color={loadingEdit ? "gray" : "black"} />
+                </Grid.Col>
+                <Grid.Col span={"auto"}>
+                  <Group>
+                    <Text c={loadingEdit ? "gray" : "black"}>Edit posting</Text>{" "}
+                    {loadingEdit ? <Loader size={"sm"} /> : ""}
+                  </Group>
+                </Grid.Col>
+              </Grid>
+            </Stack>
+          )}
+
+          {userLoginId == authorId ? (
+            ""
+          ) : (
+            <Grid
+              onClick={() => {
+                setLoadingReport(true);
+                router.push(RouterForum.report_posting + postingId);
+              }}
+            >
+              <Grid.Col span={"content"}>
+                <IconFlag3 color={loadingReport ? "gray" : "black"} />
+              </Grid.Col>
+              <Grid.Col span={"auto"}>
+                <Group>
+                  <Text c={loadingReport ? "gray" : "black"}>
+                    Laporkan posting
+                  </Text>{" "}
+                  {loadingReport ? <Loader size={"sm"} /> : ""}
+                </Group>
+              </Grid.Col>
+            </Grid>
+          )}
+
+          <Button variant="outline" radius={"xl"} onClick={close}>
+            Batal
+          </Button>
+        </Stack>
+      </Drawer>
+
+      <Modal
+        opened={openDel}
+        onClose={() => {
+          setOpenDel(false);
+        }}
+        centered
+        withCloseButton={false}
+      >
+        <ButtonDelete
+          postingId={postingId}
+          setOpenDel={setOpenDel}
+          onLoadData={onLoadData}
+        />
+      </Modal>
+
+      <Modal
+        opened={openStatusClose}
+        onClose={() => setOpenStatusClose(false)}
+        centered
+        withCloseButton={false}
+      >
+        <ButtonStatus
+          postingId={postingId}
+          setOpenStatus={setOpenStatusClose}
+          statusId={statusId}
+          onLoadData={onLoadData}
+          userLoginId={userLoginId}
+          authorId={authorId}
+        />
+      </Modal>
+
+      <ActionIcon variant="transparent" onClick={() => open()}>
+        <IconDots size={20} />
+      </ActionIcon>
+    </>
+  );
+}
+
+function ButtonDelete({
+  postingId,
+  setOpenDel,
+  onLoadData,
+}: {
+  postingId?: string;
+  setOpenDel: any;
+  onLoadData: (val: any) => void;
+}) {
+  const [loading, setLoading] = useState(false);
+
+  async function onDelete() {
+    setOpenDel(false);
+    await forum_funDeletePostingById(postingId as any).then(async (res) => {
+      if (res.status === 200) {
+        // ComponentGlobal_NotifikasiBerhasil(`Postingan Terhapus`, 2000);
+        setLoading(true);
+        const loadData = await forum_new_getAllPosting({ page: 1 });
+        onLoadData(loadData);
+        return null;
+      } else {
+        // ComponentGlobal_NotifikasiGagal(res.message);
+        return null;
+      }
+    });
+  }
+  return (
+    <>
+      <Stack>
+        <Title order={6}>Yakin menghapus posting ini ?</Title>
+        <Group position="center">
+          <Button radius={"xl"} onClick={() => setOpenDel(false)}>
+            Batal
+          </Button>
+          <Button
+            loaderPosition="center"
+            loading={loading ? true : false}
+            color="red"
+            radius={"xl"}
+            onClick={() => {
+              onDelete();
+            }}
+          >
+            Hapus
+          </Button>
+        </Group>
+      </Stack>
+    </>
+  );
+}
+
+function ButtonStatus({
+  postingId,
+  setOpenStatus,
+  statusId,
+  onLoadData,
+  userLoginId,
+  authorId,
+}: {
+  postingId?: string;
+  setOpenStatus: any;
+  statusId?: any;
+  onLoadData: (val: any) => void;
+  userLoginId: string;
+  authorId: string;
+}) {
+  const [loading, setLoading] = useState(false);
+
+  async function onTutupForum() {
+    setOpenStatus(false);
+
+    const upateStatusClose = await forum_funEditStatusPostingById(
+      postingId as any,
+      2
+    );
+    if (upateStatusClose.status === 200) {
+      ComponentGlobal_NotifikasiBerhasil(`Forum Ditutup`, 2000);
+
+      const loadData = await forum_v2_getAllPosting({})
+      onLoadData(loadData);
+      setLoading(true);
+
+    } else {
+       ComponentGlobal_NotifikasiGagal(upateStatusClose.message);
+
+    }
+
+  }
+
+  async function onBukaForum() {
+    setOpenStatus(false);
+
+    await forum_funEditStatusPostingById(postingId as any, 1).then(
+      async (res) => {
+        if (res.status === 200) {
+          const loadData = await forum_v2_getAllPosting({});
+          onLoadData(loadData);
+
+          ComponentGlobal_NotifikasiBerhasil(`Forum Dibuka`, 2000);
+          setLoading(true);
+
+        } else {
+          ComponentGlobal_NotifikasiGagal(res.message);
+        }
+      }
+    );
+  }
+
+  return (
+    <>
+      <Stack>
+        {statusId === 1 ? (
+          <Title order={6}>Yakin menutup forum ini ?</Title>
+        ) : (
+          <Title order={6}>Yakin membuka forum ini ?</Title>
+        )}
+        <Group position="center">
+          <Button radius={"xl"} onClick={() => setOpenStatus(false)}>
+            Batal
+          </Button>
+
+          {statusId === 1 ? (
+            <Button
+              loaderPosition="center"
+              loading={loading ? true : false}
+              color="orange"
+              radius={"xl"}
+              onClick={() => {
+                onTutupForum();
+              }}
+            >
+              Tutup
+            </Button>
+          ) : (
+            <Button
+              loaderPosition="center"
+              loading={loading ? true : false}
+              color="green"
+              radius={"xl"}
+              onClick={() => {
+                onBukaForum();
+              }}
+            >
+              Buka
+            </Button>
+          )}
+        </Group>
+      </Stack>
+    </>
+  );
+}

src/app_modules/forum/component/main_component/card_view.tsx

@@ -0,0 +1,97 @@
+"use client";
+
+import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
+import { Stack, Card, Group, ActionIcon, Divider, Text } from "@mantine/core";
+import { IconMessageCircle, IconMessageCircleX } from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
+import ComponentForum_BerandaAuthorNameOnHeader from "../beranda/beranda_author_header";
+import ComponentForum_V2_HeaderCard from "./card_header";
+import { MODEL_FORUM_POSTING } from "../../model/interface";
+import { useState } from "react";
+import ComponentGlobal_CardLoadingOverlay from "@/app_modules/component_global/loading_card";
+import ComponentForum_CardLoadingOverlay from "../card_loader";
+
+export default function ComponentForum_V2_MainCardView({
+  data,
+  userLoginId,
+  onLoadData,
+}: {
+  data: MODEL_FORUM_POSTING[];
+  userLoginId: string;
+  onLoadData: (val: any) => void;
+}) {
+  const router = useRouter();
+  const [loadingKomen, setLoadingKomen] = useState(false);
+  const [loadingDetail, setLoadingDetail] = useState(false);
+
+  const [postingId, setPostingId] = useState("");
+
+  return (
+    <>
+      <Stack spacing={"xl"}>
+        {data.map((e, i) => (
+          <Card key={i} >
+            <Card.Section>
+              <ComponentForum_V2_HeaderCard
+                data={e}
+                isMoreButton={true}
+                userLoginId={userLoginId}
+                onLoadData={onLoadData}
+              />
+              {/* <ComponentForum_BerandaAuthorNameOnHeader
+                tglPublish={e?.createdAt}
+                isMoreButton={true}
+                postingId={e?.id}
+                statusId={e?.ForumMaster_StatusPosting?.id}
+                userLoginId={userLoginId}
+                setData={setData}
+              /> */}
+            </Card.Section>
+
+            <Card.Section
+              sx={{ zIndex: 0 }}
+              p={"lg"}
+              onClick={() => {
+                  router.push(RouterForum.main_detail + e.id)
+              }}
+            >
+              <Text fz={"sm"} lineClamp={4}>
+                <div dangerouslySetInnerHTML={{ __html: e.diskusi }} />
+              </Text>
+            </Card.Section>
+
+            <Card.Section>
+              <Stack>
+                <Group spacing={"xs"} px={"sm"}>
+                  <ActionIcon
+                    loading={loadingKomen && e?.id === postingId ? true : false}
+                    variant="transparent"
+                    sx={{ zIndex: 1 }}
+                    onClick={() => {
+                      setPostingId(e?.id),
+                        (e?.ForumMaster_StatusPosting.id as any) === 1
+                          ? (router.push(RouterForum.komentar + e?.id),
+                            setLoadingKomen(true))
+                          : router.push(RouterForum.main_detail + e?.id);
+                    }}
+                  >
+                    {(e?.ForumMaster_StatusPosting?.id as any) === 1 ? (
+                      <IconMessageCircle color="gray" size={25} />
+                    ) : (
+                      <IconMessageCircleX color="gray" size={25} />
+                    )}
+                  </ActionIcon>
+
+                  {/* <TotalKomentar postingId={e?.id} /> */}
+
+                  <Text c={"gray"}>{e?.Forum_Komentar.length}</Text>
+                </Group>
+                <Divider />
+              </Stack>
+            </Card.Section>
+          </Card>
+        ))}
+      </Stack>
+    </>
+  );
+}

src/app_modules/forum/create/index.tsx

@@ -35,6 +35,8 @@ const ReactQuill = dynamic(
   { ssr: false }
 );
 
+import mqtt_client from "@/util/mqtt_client";
+
 export default function Forum_Create() {
   const [value, setValue] = useState("");
   const [totalLength, setTotalLength] = useState(0);
@@ -74,7 +76,6 @@ export default function Forum_Create() {
           <ButtonAction value={value} />
         </Group>
       </Stack>
-      {/* <pre> {JSON.stringify(value, null, 2)}</pre> */}
     </>
   );
 }
@@ -88,15 +89,17 @@ function ButtonAction({ value }: { value: string }) {
       return null;
     }
 
-    await forum_funCreate(value).then((res) => {
+    const create = await forum_funCreate(value);
-      if (res.status === 201) {
+    if (create.status === 201) {
-        setLoading(true);
+      setLoading(true);
-        ComponentGlobal_NotifikasiBerhasil(res.message);
+      ComponentGlobal_NotifikasiBerhasil(create.message);
-        setTimeout(() => router.back(), 1000);
+      setTimeout(() => router.back(), 1000);
-      } else {
+
-        ComponentGlobal_NotifikasiGagal(res.message);
+      mqtt_client.publish("Forum_user_to_user", JSON.stringify({isNewPost: true, count: 1 }));
-      }
+
-    });
+    } else {
+      ComponentGlobal_NotifikasiGagal(create.message);
+    }
   }
   return (
     <>

src/app_modules/forum/forumku/index.tsx

@@ -1,36 +1,28 @@
 "use client";
 
+import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
 import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
-import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/component_global/author_name_on_header";
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
 import { MODEL_USER } from "@/app_modules/home/model/interface";
 import {
   ActionIcon,
   Affix,
   Avatar,
   Button,
-  Card,
   Center,
   Divider,
   Grid,
-  Group,
   Stack,
   Text,
   rem,
 } from "@mantine/core";
-import {
-  IconCircleFilled,
-  IconMessageCircle,
-  IconPencilPlus,
-} from "@tabler/icons-react";
-import { useRouter } from "next/navigation";
-import ComponentForum_PostingAuthorNameOnHeader from "../component/header/posting_author_header_name";
-import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
-import { useState } from "react";
-import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
-import { MODEL_FORUM_POSTING } from "../model/interface";
-import ComponentForum_MainCardView from "../component/main_card_view";
 import { useWindowScroll } from "@mantine/hooks";
+import { IconCircleFilled, IconPencilPlus } from "@tabler/icons-react";
 import _ from "lodash";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import ComponentForum_MainCardView from "../component/main_card_view";
+import { MODEL_FORUM_POSTING } from "../model/interface";
 
 export default function Forum_Forumku({
   auhtorSelectedData,
@@ -185,9 +177,6 @@ function ForumPosting({
   if (loadingKomen) return <ComponentGlobal_V2_LoadingPage />;
   return (
     <>
-
-
-
       <ComponentForum_MainCardView
         data={data}
         setLoadingKomen={setLoadingKomen}

src/app_modules/forum/fun/create/fun_create.tsx

@@ -15,7 +15,7 @@ export async function forum_funCreate(value: string) {
     },
   });
 
-  if (!create) return { status: 400, message: "Gagal  menambahkan postingan" };
+  if (!create) return { status: 400, message: "Gagal  memposting" };
   revalidatePath("/dev/forum/main");
-  return { status: 201, message: "Berhasil menambahkan  postingan" };
+  return { status: 201, message: "Berhasil memposting" };
 }

src/app_modules/forum/fun/get/new_get_all_posting.ts

@@ -0,0 +1,75 @@
+"use server";
+
+import _, { ceil } from "lodash";
+import prisma from "@/app/lib/prisma";
+import { forum_countOneTotalKomentarById } from "../count/count_one_total_komentar_by_id";
+import { forum_countTotalKomenById } from "../count/count_total_komentar_by_id";
+
+export async function forum_new_getAllPosting({
+  page,
+  search,
+}: {
+  page: number;
+  search?: string;
+}) {
+  const takeData = 10;
+  const skipData = page * takeData - takeData;
+
+  const getData = await prisma.forum_Posting.findMany({
+    take: takeData,
+    skip: skipData,
+    orderBy: {
+      createdAt: "desc",
+    },
+    where: {
+      isActive: true,
+      diskusi: {
+        mode: "insensitive",
+        contains: search,
+      },
+    },
+    select: {
+      id: true,
+      diskusi: true,
+      createdAt: true,
+      isActive: true,
+      authorId: true,
+      Author: {
+        select: {
+          id: true,
+          username: true,
+          Profile: {
+            select: {
+              id: true,
+              imagesId: true,
+            },
+          },
+        },
+      },
+      Forum_Komentar: {
+        where: {
+          isActive: true,
+        },
+      },
+      ForumMaster_StatusPosting: true,
+    },
+  });
+
+  const nCount = await prisma.forum_Posting.count({
+    where: {
+      isActive: true,
+      diskusi: {
+        mode: "insensitive",
+        contains: search,
+      },
+    },
+  });
+
+  const allData = {
+    data: getData,
+    nPage: ceil(nCount / takeData),
+  };
+  
+
+  return allData;
+}

src/app_modules/forum/fun/get/v2_get_all_posting.ts

@@ -0,0 +1,48 @@
+"use server"
+
+import prisma from "@/app/lib/prisma";
+
+
+export default async function forum_v2_getAllPosting({search}: {search?: string}) {
+    const getData = await prisma.forum_Posting.findMany({
+    //   take: takeData,
+    //   skip: skipData,
+      orderBy: {
+        createdAt: "desc",
+      },
+      where: {
+        isActive: true,
+        diskusi: {
+          mode: "insensitive",
+          contains: search,
+        },
+      },
+      select: {
+        id: true,
+        diskusi: true,
+        createdAt: true,
+        isActive: true,
+        authorId: true,
+        Author: {
+          select: {
+            id: true,
+            username: true,
+            Profile: {
+              select: {
+                id: true,
+                imagesId: true,
+              },
+            },
+          },
+        },
+        Forum_Komentar: {
+          where: {
+            isActive: true,
+          },
+        },
+        ForumMaster_StatusPosting: true,
+      },
+    });
+
+    return getData
+}

src/app_modules/forum/main/beranda.tsx

@@ -16,6 +16,8 @@ import {
   Box,
   TextInput,
   Center,
+  Button,
+  Pagination,
 } from "@mantine/core";
 import { useShallowEffect, useTimeout, useWindowScroll } from "@mantine/hooks";
 import {
@@ -37,33 +39,95 @@ import { forum_getListAllPosting } from "../fun/get/get_list_all_posting";
 import { forum_funSearchListPosting } from "../fun/search/fun_search_list_posting";
 import _ from "lodash";
 import ComponentForum_BerandaCardView from "../component/beranda/beranda_card";
+import mqtt_client from "@/util/mqtt_client";
+import ComponentForum_V2_MainCardView from "../component/main_component/card_view";
+import { forum_new_getAllPosting } from "../fun/get/new_get_all_posting";
+import forum_v2_getAllPosting from "../fun/get/v2_get_all_posting";
 
 export default function Forum_Beranda({
   listForum,
   userLoginId,
 }: {
-  listForum: MODEL_FORUM_POSTING[];
+  listForum: any;
   userLoginId: string;
 }) {
   const router = useRouter();
-  const [data, setData] = useState(listForum);
   const [scroll, scrollTo] = useWindowScroll();
 
-  const [loadingCreate, setLoadingCreate] = useState(false);
+  const [data, setData] = useState<MODEL_FORUM_POSTING[]>(listForum);
-  const [loadingKomen, setLoadingKomen] = useState(false);
+  // const [nPage, setNPage] = useState(listForum.nPage);
-  const [loadingDetail, setLoadingDetail] = useState(false);
+  // const [activePage, setActivePage] = useState(1);
+  const [isSearch, setIsSearch] = useState("");
 
-  if (loadingDetail) return <ComponentGlobal_V2_LoadingPage />;
+  const [loadingCreate, setLoadingCreate] = useState(false);
-  if (loadingKomen) return <ComponentGlobal_V2_LoadingPage />;
+
+  // 
+  const [isNewPost, setIsNewPost] = useState(false);
+  const [countNewPost, setCountNewPost] = useState(0);
+
+  // useShallowEffect(() => {
+  //   onLoadAllData({
+  //     onLoad(val) {
+  //       setData(val.data);
+  //       setNPage(val.nPage);
+  //     },
+  //   });
+  // }, [setData, setNPage]);
+
+  // async function onLoadAllData({ onLoad }: { onLoad: (val: any) => void }) {
+  //   const loadData = await forum_new_getAllPosting({ page: 1 });
+  //   onLoad(loadData);
+  // }
+
+  useShallowEffect(() => {
+    mqtt_client.subscribe("Forum_user_to_user");
+
+    mqtt_client.on("message", (topic: any, message: any) => {
+      const data = JSON.parse(message.toString());
+      // console.log(data);
+      setIsNewPost(data.isNewPost);
+      const tambah = countNewPost + data.count;
+      setCountNewPost(tambah);
+    });
+  }, [countNewPost]);
 
   async function onSearch(text: string) {
-    await forum_funSearchListPosting(text).then((res: any) => {
+    setIsSearch(text);
-      setData(res);
+    const search = await forum_v2_getAllPosting({search: text});
-    });
+    setData(search as any);
+    // setNPage(search.nPage);
+    // setActivePage(1);
   }
 
+  // async function onClickPage(nextpage: number) {
+  //   setActivePage(nextpage);
+  //   const next = await forum_new_getAllPosting({
+  //     page: nextpage,
+  //     search: isSearch,
+  //   });
+  //   scrollTo({ y: 0 });
+  //   setData(next.data as any);
+  //   setNPage(next.nPage);
+  // }
+
+
   return (
     <>
+      {isNewPost && (
+        <Affix position={{ top: rem(70) }} w={"100%"}>
+          <ButtonUpdateBeranda
+            countNewPost={countNewPost}
+            onSetData={(val) => setData(val)}
+            onSetNewPost={(val) => {
+              setIsNewPost(val);
+            }}
+            onSetCountNewPosting={(val) => {
+              setCountNewPost(val);
+            }}
+          />
+        </Affix>
+      )}
+
       {/* <pre>{JSON.stringify(listForum, null, 2)}</pre> */}
       <Affix position={{ bottom: rem(100), right: rem(30) }}>
         <ActionIcon
@@ -98,23 +162,80 @@ export default function Forum_Beranda({
             <IconSearchOff size={80} color="gray" />
             <Stack spacing={0} align="center">
               <Text c={"gray"} fw={"bold"} fz={"xs"}>
-                Forum tidak ditemukan
+                Tidak ada data
-              </Text>
-              <Text c={"gray"} fw={"bold"} fz={"xs"}>
-                Coba masukan kata yang bebeda
               </Text>
             </Stack>
           </Stack>
         ) : (
-          <ComponentForum_BerandaCardView
+          // --- Main component --- //
+          <ComponentForum_V2_MainCardView
             data={data}
-            setData={setData}
-            setLoadingKomen={setLoadingKomen}
-            setLoadingDetail={setLoadingDetail}
             userLoginId={userLoginId}
+            onLoadData={(val) => {
+              setData(val);
+              // setNPage(val.nPage);
+            }}
           />
         )}
       </Stack>
+
+      {/* <Center mt={"md"}>
+        <Pagination
+          value={activePage}
+          total={nPage}
+          onChange={(val) => {
+            onClickPage(val);
+          }}
+          styles={(theme) => ({
+            control: {
+              borderRadius: "100%",
+             
+            },
+          })}
+        />
+      </Center> */}
+    </>
+  );
+}
+
+function ButtonUpdateBeranda({
+  countNewPost,
+  onSetData,
+  onSetNewPost,
+  onSetCountNewPosting,
+}: {
+  countNewPost: number;
+  onSetData: (val: any) => void;
+  onSetNewPost: (val: any) => void;
+  onSetCountNewPosting: (val: any) => void;
+}) {
+  const [scroll, scrollTo] = useWindowScroll();
+  const [isLoading, setIsLoading] = useState(false);
+
+  async function onLoadData() {
+    setIsLoading(true);
+    const loadData = await forum_getListAllPosting();
+    if (loadData) {
+      onSetData(loadData);
+      onSetNewPost(false);
+      setIsLoading(false);
+      onSetCountNewPosting(0);
+    }
+  }
+
+  return (
+    <>
+      <Center>
+        <Button
+          loaderPosition="center"
+          loading={isLoading ? true : false}
+          radius={"xl"}
+          opacity={scroll.y > 0 ? 0.5 : 0.8}
+          onClick={() => onLoadData()}
+        >
+          Update beranda + {countNewPost}
+        </Button>
+      </Center>
     </>
   );
 }

src/app_modules/forum/model/interface.tsx

@@ -9,7 +9,7 @@ export interface MODEL_FORUM_POSTING {
   diskusi: string;
   authorId: string;
   Author: MODEL_USER;
-  _count: number;
+  _count: number
   Forum_Komentar: MODEL_FORUM_KOMENTAR[];
   Forum_ReportPosting: MODEL_FORUM_MASTER_REPORT[];
   ForumMaster_StatusPosting: MODEL_FORUM_MASTER_STATUS;