Merge pull request #113 from bipproduction/investasi/upload

Fix: Upload image

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hipmi",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "private": true,
   "prisma": {
     "seed": "npx tsx prisma/seed.ts"

prisma/schema.prisma

@@ -418,6 +418,8 @@ model Donasi {
   Donasi_Invoice              Donasi_Invoice[]
   Donasi_Kabar                Donasi_Kabar[]
   Donasi_PencairanDana        Donasi_PencairanDana[]
+
+  imageId String?
 }
 
 model Donasi_TemporaryCreate {
@@ -433,6 +435,8 @@ model Donasi_TemporaryCreate {
   donasiMaster_KategoriId String?
   durasi                  DonasiMaster_Durasi?   @relation(fields: [donasiMaster_DurasiId], references: [id])
   donasiMaster_DurasiId   String?
+
+  imageId String?
 }
 
 model DonasiMaster_Kategori {
@@ -467,6 +471,8 @@ model Donasi_Cerita {
   imagesId          String? @unique
   Donasi            Donasi? @relation(fields: [donasiId], references: [id])
   donasiId          String? @unique
+
+  imageId String?
 }
 
 model DonasiMaster_StatusDonasi {
@@ -514,6 +520,8 @@ model Donasi_Invoice {
   authorId                     String?
   Images                       Images?                     @relation(fields: [imagesId], references: [id])
   imagesId                     String?
+
+  imageId String?
 }
 
 model Donasi_Kabar {
@@ -529,6 +537,8 @@ model Donasi_Kabar {
   ImagesKabar  Images?        @relation(fields: [imagesId], references: [id])
   imagesId     String?
   Donasi_Notif Donasi_Notif[]
+
+  imageId String?
 }
 
 model Donasi_Notif {
@@ -556,6 +566,8 @@ model Donasi_PencairanDana {
   donasiId    String?
   Images      Images?  @relation(fields: [imagesId], references: [id])
   imagesId    String?
+
+  imageId String?
 }
 
 // ========================================= EVENT ========================================= //

src/app/dev/donasi/main/galang_dana/page.tsx

@@ -10,6 +10,11 @@ export default async function Page() {
   const listDraft = await donasi_funGetAllStatusDraft({ page: 1 });
   const listReject = await donasi_funGetAllStatusReject({ page: 1 });
 
+  // console.log(listPublish, "ini publish")
+  // console.log(listReview, "ini review")
+  // console.log(listDraft, "ini draft")
+  // console.log(listReject, "ini reject")
+
   return (
     <>
       <PostingDonasi

src/app/dev/investasi/berita/[id]/layout.tsx

@@ -1,14 +0,0 @@
-import { LayoutBeritaInvestasi } from "@/app_modules/investasi";
-import React from "react";
-
-export default async function Layout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <>
-      <LayoutBeritaInvestasi>{children}</LayoutBeritaInvestasi>
-    </>
-  );
-}

src/app/dev/investasi/berita/[id]/page.tsx

@@ -1,13 +1,12 @@
-import { BeritaInvestasi } from "@/app_modules/investasi";
+import { investasi_funGetOneBeritaById } from "@/app_modules/investasi/_fun";
-import getOneInvestasiById from "@/app_modules/investasi/fun/get_one_investasi_by_id";
+import { Investasi_UiDetailBerita } from "@/app_modules/investasi/_ui";
-
-export default async function Page({params}: {params: {id: string}}) {
-
-  const dataInvestasi = await getOneInvestasiById(params.id)
 
+export default async function Page({ params }: { params: { id: string } }) {
+  const beritaId = params.id;
+  const dataBerita = await investasi_funGetOneBeritaById({ beritaId });
   return (
     <>
-      <BeritaInvestasi dataInvestasi={dataInvestasi as any}/>
+      <Investasi_UiDetailBerita dataBerita={dataBerita} />
     </>
   );
 }

src/app/dev/investasi/berita/daftar/[id]/page.tsx

@@ -0,0 +1,14 @@
+import { investasi_funGetBeritaById } from "@/app_modules/investasi/_fun";
+import { Investasi_UiDaftarBerita } from "@/app_modules/investasi/_ui";
+
+export default async function Page({ params }: { params: { id: string } }) {
+   const investasiId = params.id;
+   const dataBerita = await investasi_funGetBeritaById({ investasiId });
+
+  
+  return (
+    <>
+      <Investasi_UiDaftarBerita dataBerita={dataBerita} />
+    </>
+  );
+}

src/app/dev/investasi/berita/rekap/[id]/page.tsx

@@ -0,0 +1,17 @@
+import { investasi_funGetBeritaById } from "@/app_modules/investasi/_fun";
+import { Investasi_UiRekapBerita } from "@/app_modules/investasi/_ui";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  const investasiId = params.id;
+  const dataBerita = await investasi_funGetBeritaById({ investasiId });
+
+
+  return (
+    <>
+      <Investasi_UiRekapBerita
+        investasiId={investasiId}
+        dataBerita={dataBerita}
+      />
+    </>
+  );
+}

src/app/dev/investasi/create/berita/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { Investasi_UiCreateBerita } from "@/app_modules/investasi/_ui";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  const investasiId = params.id;
+  return (
+    <>
+      <Investasi_UiCreateBerita investasiId={investasiId} />
+    </>
+  );
+}

src/app/dev/investasi/detail/[id]/layout.tsx

@@ -1,14 +0,0 @@
-import { LayoutDetailInvestasi } from "@/app_modules/investasi";
-import React from "react";
-
-export default async function Layout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <>
-      <LayoutDetailInvestasi>{children}</LayoutDetailInvestasi>
-    </>
-  );
-}

src/app/dev/investasi/detail/[id]/page.tsx

@@ -1,18 +1,19 @@
 import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
-import { DetailInvestasi } from "@/app_modules/investasi";
+import { investasi_funGetOneInvestasiById } from "@/app_modules/investasi/_fun";
-import getOneInvestasiById from "@/app_modules/investasi/fun/get_one_investasi_by_id";
+import { Investasi_UiDetailMain } from "@/app_modules/investasi/_ui";
+
 
 export default async function Page({ params }: { params: { id: string } }) {
   const investasiId = params.id;
   const userLoginId = await funGetUserIdByToken();
-  
+
-  const dataInvestasi = await getOneInvestasiById(investasiId);
+  const dataInvestasi = await investasi_funGetOneInvestasiById({ investasiId });
 
   return (
     <>
-      <DetailInvestasi
+      <Investasi_UiDetailMain
         dataInvestasi={dataInvestasi as any}
-        loginUserId={userLoginId}
+        userLoginId={userLoginId}
       />
     </>
   );

src/app/dev/investasi/detail/portofolio/[id]/page.tsx

@@ -1,15 +1,21 @@
+import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
 import { investasi_funGetOneInvestasiById } from "@/app_modules/investasi/_fun";
 import { Investasi_UiDetailPortofolio } from "@/app_modules/investasi/_ui";
 
 export default async function Page({ params }: { params: { id: string } }) {
   const investasiId = params.id;
+  const userLoginId = await funGetUserIdByToken();
+
   const dataPortofolio = await investasi_funGetOneInvestasiById({
     investasiId,
   });
-  
+
   return (
     <>
-      <Investasi_UiDetailPortofolio data={dataPortofolio as any} />
+      <Investasi_UiDetailPortofolio
+        data={dataPortofolio as any}
+        userLoginId={userLoginId}
+      />
     </>
   );
 }

src/app/dev/investasi/dokumen/daftar/[id]/page.tsx

@@ -1,6 +1,5 @@
 import {
-  investasi_funGetAllDocumentById,
+  investasi_funGetAllDocumentById
-  investasi_funGetOneInvestasiById,
 } from "@/app_modules/investasi/_fun";
 import { Investasi_UiDaftarDokmen } from "@/app_modules/investasi/_ui";
 
@@ -13,7 +12,10 @@ export default async function Page({ params }: { params: { id: string } }) {
 
   return (
     <>
-      <Investasi_UiDaftarDokmen dataDokumen={dataDokumen} investasiId={investasiId}/>
+      <Investasi_UiDaftarDokmen
+        dataDokumen={dataDokumen}
+        investasiId={investasiId}
+      />
     </>
   );
 }

src/app/dev/investasi/dokumen/rekap/[id]/page.tsx

@@ -1,10 +1,12 @@
 import { investasi_funGetAllDocumentById } from "@/app_modules/investasi/_fun";
-import {  Investasi_UiRekapDokumen } from "@/app_modules/investasi/_ui";
+import { Investasi_UiRekapDokumen } from "@/app_modules/investasi/_ui";
 
 export default async function Page({ params }: { params: { id: string } }) {
   const investasiId = params.id;
-  const dataDokumen = await investasi_funGetAllDocumentById({ investasiId, page: 1 });
+  const dataDokumen = await investasi_funGetAllDocumentById({
-
+    investasiId,
+    page: 1,
+  });
 
   return (
     <>

src/app/lib/id-derectory.ts

@@ -4,12 +4,21 @@ const DIRECTORY_ID = {
   portofolio_logo: "cm0yjl6ug000310njwmk6j0tx",
   map_pin: "cm0yjq8up000710njv5klra32",
   map_image: "cm0yjqnxl000910njplqho07w",
+
+  // Investasi
   investasi_image: "cm0yjs35h000b10njb35o12h1",
   investasi_bukti_transfer: "cm0yjsflu000d10njrc3lnqho",
   investasi_prospektus: "cm1soio74003p38bjyciwf1oy",
   investasi_dokumen: "cm21g2hxw004d10dpx8j16tt7",
+  investasi_berita: "cm21g2yzc004f10dpbtqdfcjb",
+
+  // Donasi
   donasi_image: "cm0yk1coh000f10nj597a99kv",
+  donasi_temporary_image: "cm2dvxo48007t10dpmmustxa2",
+  donasi_cerita_image: "cm2dvy9bi007v10dpmatb5yiy",
   donasi_bukti_transfer: "cm0yk1pmh000h10njhi6m8b8t",
+
+  // Job
   job_image: "cm0ypp6zl0003kp7jf59zuvjy",
 };
 

src/app/lib/router_hipmi/router_investasi.ts

@@ -8,7 +8,7 @@ export const NEW_RouterInvestasi = {
    * @param param status id | 1: Publish, 2: Review, 3: Draft, 4: Reject
    * @type string
    */
-  portofolio: ({ id }: { id: string }) =>
+  portofolio: ({ id }: { id: "1" | "2" | "3" | "4" }) =>
     `/dev/investasi/main/portofolio/${id}`,
 
   // TRANSAKSI
@@ -29,14 +29,11 @@ export const NEW_RouterInvestasi = {
   OLD_file_view_dokumen: "/dev/investasi/file-view/dokumen/",
 
   // DETAIL
+  detail_main: ({ id }: { id: string }) => `/dev/investasi/detail/${id}`,
   detail_portofolio: ({ id }: { id: string }) =>
     `/dev/investasi/detail/portofolio/${id}`,
   detail_prospektus: ({ id }: { id: string }) =>
     `/dev/investasi/detail/prospektus/${id}`,
-  daftar_dokumen: ({ id }: { id: string }) =>
-    `/dev/investasi/detail/daftar-dokumen/${id}`,
-  rekap_dokumen: ({ id }: { id: string }) =>
-    `/dev/investasi/detail/rekap-dokumen/${id}`,
 
   detail_saham: "/dev/investasi/detail/saham/",
   detail_publish: "/dev/investasi/detail_portofolio/publish/",
@@ -44,6 +41,39 @@ export const NEW_RouterInvestasi = {
   detail_draft: "/dev/investasi/detail_portofolio/draft/",
   detail_reject: "/dev/investasi/detail_portofolio/reject/",
 
+  // DOKUMEN
+  /**
+   * @param id | investasiId
+   * @type string
+   */
+  daftar_dokumen: ({ id }: { id: string }) =>
+    `/dev/investasi/dokumen/daftar/${id}`,
+  /**
+   * @param id | investasiId
+   * @type string
+   */
+  rekap_dokumen: ({ id }: { id: string }) =>
+    `/dev/investasi/dokumen/rekap/${id}`,
+
+  // BERITA
+  /**
+   * @param id | beritaId
+   * @type string
+   */
+  berita: ({ id }: { id: string }) => `/dev/investasi/berita/${id}`,
+
+  /**
+   * @param id | investasiId
+   * @type string
+   */
+  daftar_berita: ({ id }: { id: string }) =>
+    `/dev/investasi/berita/daftar/${id}`,
+  /**
+   * @param id | investasiId
+   * @type string
+   */
+  rekap_berita: ({ id }: { id: string }) => `/dev/investasi/berita/rekap/${id}`,
+
   // CREATE
   /**
    * @param id | investasiId
@@ -52,6 +82,13 @@ export const NEW_RouterInvestasi = {
   create_dokumen: ({ id }: { id: string }) =>
     `/dev/investasi/create/dokumen/${id}`,
 
+  /**
+   * @param id | investasiId
+   * @type string
+   */
+  create_berita: ({ id }: { id: string }) =>
+    `/dev/investasi/create/berita/${id}`,
+
   // EDIT
   /**
    * @param id | investasiId

src/app_modules/donasi/component/card_view/card_publish.tsx

@@ -1,21 +1,11 @@
 "use client";
 
-import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
-import { AccentColor } from "@/app_modules/_global/color/color_pallet";
 import {
   ComponentGlobal_CardLoadingOverlay,
   ComponentGlobal_CardStyles,
+  ComponentGlobal_LoadImageCustom,
 } from "@/app_modules/_global/component";
-import {
+import { Grid, Progress, Stack, Text } from "@mantine/core";
-  AspectRatio,
-  Card,
-  Grid,
-  Image,
-  Paper,
-  Progress,
-  Stack,
-  Text,
-} from "@mantine/core";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
 import ComponentDonasi_TampilanHitungMundur from "../tampilan_hitung_mundur";
@@ -43,18 +33,13 @@ export default function ComponentDonasi_CardPublish({
       >
         <Stack>
           <Grid>
-            <Grid.Col span={7}>
+            <Grid.Col span={6}>
-              <AspectRatio ratio={16 / 9}>
+              <ComponentGlobal_LoadImageCustom
-                <Paper radius={"md"}>
+                fileId={data.imageId}
-                  <Image
+                height={150}
-                    alt="Foto"
+              />
-                    src={RouterDonasi.api_gambar + `${data.imagesId}`}
-                    radius={"xs"}
-                  />
-                </Paper>
-              </AspectRatio>
             </Grid.Col>
-            <Grid.Col span={5}>
+            <Grid.Col span={6}>
               <Stack spacing={"xs"}>
                 <Stack spacing={0}>
                   <Text fz={"sm"} fw={"bold"} lineClamp={2}>

src/app_modules/donasi/component/card_view/card_status.tsx

@@ -1,6 +1,10 @@
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import { AccentColor } from "@/app_modules/_global/color/color_pallet";
-import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
+import {
+  ComponentGlobal_CardLoadingOverlay,
+  ComponentGlobal_CardStyles,
+  ComponentGlobal_LoadImageCustom,
+} from "@/app_modules/_global/component";
 import {
   AspectRatio,
   Card,
@@ -23,39 +27,24 @@ export function ComponentDonasi_CardStatus({
 }) {
   const router = useRouter();
   const [visible, setVisible] = useState(false);
-  const [donasiId, setDonasiId] = useState("");
 
   return (
     <>
-      <Card
+      <ComponentGlobal_CardStyles
-        style={{
+        onClickHandler={() => {
-          padding: "15px",
-          backgroundColor: AccentColor.darkblue,
-          borderRadius: "10px",
-          border: `2px solid ${AccentColor.blue}`,
-          color: "white",
-          marginBottom: "15px",
-        }}
-        onClick={() => {
           setVisible(true);
-          setDonasiId(data.id);
           router.push(path + `${data.id}`);
         }}
       >
         <Stack>
           <Grid>
-            <Grid.Col span={7}>
+            <Grid.Col span={6}>
-              <AspectRatio ratio={16 / 9}>
+              <ComponentGlobal_LoadImageCustom
-                <Paper radius={"sm"} bg={"gray.1"}>
+                fileId={data.imageId}
-                  <Image
+                height={100}
-                    alt="Foto"
+              />
-                    src={RouterDonasi.api_gambar + `${data.imagesId}`}
-                    radius={"md"}
-                  />
-                </Paper>
-              </AspectRatio>
             </Grid.Col>
-            <Grid.Col span={5}>
+            <Grid.Col span={6}>
               <Stack spacing={"xs"}>
                 <Text fz={"sm"} fw={"bold"} lineClamp={2}>
                   {data.title}
@@ -74,12 +63,24 @@ export function ComponentDonasi_CardStatus({
           </Grid>
           {/* {width > 575 ? "" : <Divider />} */}
         </Stack>
-        {visible && donasiId !== "" ? (
+        {visible && <ComponentGlobal_CardLoadingOverlay />}
-          <ComponentGlobal_CardLoadingOverlay />
+      </ComponentGlobal_CardStyles>
-        ) : (
+      {/* <Card
-          ""
+        style={{
-        )}
+          padding: "15px",
-      </Card>
+          backgroundColor: AccentColor.darkblue,
+          borderRadius: "10px",
+          border: `2px solid ${AccentColor.blue}`,
+          color: "white",
+          marginBottom: "15px",
+        }}
+        onClick={() => {
+          setVisible(true);
+          router.push(path + `${data.id}`);
+        }}
+      >
+        
+      </Card> */}
     </>
   );
 }

src/app_modules/donasi/component/detail_galang_dana/detail_data_donasi.tsx

@@ -1,19 +1,16 @@
 "use client";
 
+import {
+  MainColor
+} from "@/app_modules/_global/color/color_pallet";
+import {
+  ComponentGlobal_CardStyles,
+  ComponentGlobal_LoadImageLandscape,
+} from "@/app_modules/_global/component";
+import { Group, Stack, Text, Title } from "@mantine/core";
 import { useRouter } from "next/navigation";
 import { MODEL_DONASI } from "../../model/interface";
-import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
-import {
-  Stack,
-  AspectRatio,
-  Paper,
-  Title,
-  Group,
-  Image,
-  Text,
-} from "@mantine/core";
 import TampilanRupiahDonasi from "../tampilan_rupiah";
-import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
 
 export default function ComponentDonasi_DetailDataGalangDana({
   donasi,
@@ -23,28 +20,9 @@ export default function ComponentDonasi_DetailDataGalangDana({
   const router = useRouter();
   return (
     <>
-      <Stack
+      <ComponentGlobal_CardStyles>
-        style={{
-          paddingInline: "15px",
-          paddingBottom: "15px",
-          backgroundColor: AccentColor.darkblue,
-          border: `2px solid ${AccentColor.blue}`,
-          borderRadius: "10px",
-          color: "white",
-        }}
-      >
         <Stack>
-          <AspectRatio
+          <ComponentGlobal_LoadImageLandscape fileId={donasi.imageId} />
-            ratio={1 / 1}
-            mx={"sm"}
-            mah={300}
-          >
-            <Image
-              alt="Foto"
-              src={RouterDonasi.api_image + `${donasi.imageDonasi.url}`}
-              radius={"sm"}
-            />
-          </AspectRatio>
           <Stack spacing={0}>
             <Title order={4}>{donasi.title}</Title>
             <Text fz={10}>Durasi: {donasi.DonasiMaster_Durasi.name} hari</Text>
@@ -53,24 +31,30 @@ export default function ComponentDonasi_DetailDataGalangDana({
             <Group position="apart">
               <Stack spacing={0}>
                 <Text fz={12}>Dana dibutuhkan</Text>
-                <Title order={4} style={{
+                <Title
-                  color: MainColor.yellow
+                  order={4}
-                }}>
+                  style={{
+                    color: MainColor.yellow,
+                  }}
+                >
                   <TampilanRupiahDonasi nominal={+donasi.target} />
                 </Title>
               </Stack>
               <Stack spacing={0}>
                 <Text fz={12}>Kategori</Text>
-                <Title order={4} style={{
+                <Title
-                  color: MainColor.yellow
+                  order={4}
-                }}>
+                  style={{
+                    color: MainColor.yellow,
+                  }}
+                >
                   {donasi.DonasiMaster_Ketegori.name}
                 </Title>
               </Stack>
             </Group>
           </Stack>
         </Stack>
-      </Stack>
+      </ComponentGlobal_CardStyles>
     </>
   );
 }

src/app_modules/donasi/component/detail_main/detail_data_donasi.tsx

@@ -30,6 +30,10 @@ import { MODEL_DONASI } from "../../model/interface";
 import { NotifPeringatan } from "../notifikasi/notif_peringatan";
 import ComponentDonasi_TampilanHitungMundur from "../tampilan_hitung_mundur";
 import TampilanRupiahDonasi from "../tampilan_rupiah";
+import {
+  ComponentGlobal_CardStyles,
+  ComponentGlobal_LoadImageLandscape,
+} from "@/app_modules/_global/component";
 
 export function ComponentDonasi_DetailDataMain({
   donasi,
@@ -47,23 +51,9 @@ export function ComponentDonasi_DetailDataMain({
 
   return (
     <>
-      <Stack
+      <ComponentGlobal_CardStyles>
-        style={{
-          padding: "15px",
-          border: `2px solid ${AccentColor.blue}`,
-          backgroundColor: AccentColor.darkblue,
-          borderRadius: "10px",
-          color: "white",
-        }}
-      >
         <Stack>
-          <AspectRatio ratio={1 / 1} mx={"sm"} mah={300}>
+          <ComponentGlobal_LoadImageLandscape fileId={donasi.imageId} />
-            <Image
-              alt="Foto"
-              src={RouterDonasi.api_image + `${donasi?.imageDonasi?.url}`}
-              radius={"sm"}
-            />
-          </AspectRatio>
 
           <Stack spacing={0} mt={"lg"}>
             <Title order={4}>{donasi?.title}</Title>
@@ -179,7 +169,7 @@ export function ComponentDonasi_DetailDataMain({
             </Grid.Col>
           </Grid>
         </Stack>
-      </Stack>
+      </ComponentGlobal_CardStyles>
     </>
   );
 }

src/app_modules/donasi/create/create_cerita_penggalang.tsx

@@ -1,41 +1,40 @@
 "use client";
 
+import { DIRECTORY_ID } from "@/app/lib";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
-import {
+import { MainColor } from "@/app_modules/_global/color/color_pallet";
-  AccentColor,
+import { ComponentGlobal_BoxUploadImage } from "@/app_modules/_global/component";
-  MainColor,
-} from "@/app_modules/_global/color/color_pallet";
 import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
 import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
 import {
-  ComponentGlobal_WarningMaxUpload,
+  funGlobal_DeleteFileById,
-  maksimalUploadFile,
+  funGlobal_UploadToStorage,
-} from "@/app_modules/_global/component/waring_popup";
+} from "@/app_modules/_global/fun";
+import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
+import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
 import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
+import notifikasiToAdmin_funCreate from "@/app_modules/notifikasi/fun/create/create_notif_to_admin";
+import mqtt_client from "@/util/mqtt_client";
 import {
   AspectRatio,
   Button,
-  Center,
   FileButton,
+  Group,
   Image,
-  Paper,
   Stack,
   Text,
   TextInput,
   Textarea,
 } from "@mantine/core";
-import { IconCamera } from "@tabler/icons-react";
+import { IconCamera, IconUpload } from "@tabler/icons-react";
 import { useAtom } from "jotai";
 import _ from "lodash";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
-import { NotifPeringatan } from "../component/notifikasi/notif_peringatan";
 import { Donasi_funCreate } from "../fun/create/fun_create_donasi";
 import { gs_donasi_hot_menu, gs_donasi_tabs_posting } from "../global_state";
 import { MODEL_DONASI_TEMPORARY } from "../model/interface";
-import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
+
-import mqtt_client from "@/util/mqtt_client";
-import notifikasiToAdmin_funCreate from "@/app_modules/notifikasi/fun/create/create_notif_to_admin";
 export default function CreateCeritaPenggalangDonasi({
   dataTemporary,
   userId,
@@ -51,7 +50,7 @@ export default function CreateCeritaPenggalangDonasi({
   );
   const [donasiHotMenu, setDonasiHotMenu] = useAtom(gs_donasi_hot_menu);
 
-  const [create, setCreate] = useState({
+  const [data, setData] = useState({
     pembukaan: "",
     cerita: "",
     namaBank: "",
@@ -59,61 +58,77 @@ export default function CreateCeritaPenggalangDonasi({
   });
   const [temporary, setTemporary] = useState(dataTemporary);
   const [file, setFile] = useState<File | null>(null);
-  const [imageCerita, setImageCerita] = useState<any | null>();
+  const [img, setImg] = useState<any | null>();
 
   async function onCreate() {
-    if (_.values(create).includes("")) return NotifPeringatan("Lengkapin Data");
+    if (_.values(data).includes(""))
-    if (!file) return NotifPeringatan("Lengkapi Gambar");
+      return ComponentGlobal_NotifikasiPeringatan("Lengkapin Data");
-
-    const gambar = new FormData();
-    gambar.append("file", file as any);
 
     const body = {
       id: temporary.id,
       title: temporary.title,
       target: temporary.target,
-      imagesId: temporary.imagesId,
       donasiMaster_KategoriId: temporary.donasiMaster_KategoriId,
       donasiMaster_DurasiId: temporary.donasiMaster_DurasiId,
       authorId: userId,
-      namaBank: create.namaBank,
+      namaBank: data.namaBank,
-      rekening: create.rekening,
+      rekening: data.rekening,
+      imageId: temporary.imageId,
       CeritaDonasi: {
-        pembukaan: create.pembukaan,
+        pembukaan: data.pembukaan,
-        cerita: create.cerita,
+        cerita: data.cerita,
       },
     };
 
-    const res = await Donasi_funCreate(body as any, gambar);
+    try {
-    if (res.status === 201) {
+      setLoading(true);
-      const dataNotif: any = {
+      const uploadImage = await funGlobal_UploadToStorage({
-        appId: res.data?.id as any,
+        file: file as File,
-        status: res.data?.DonasiMaster_Status?.name as any,
+        dirId: DIRECTORY_ID.donasi_cerita_image,
-        userId: res.data?.authorId as any,
+      });
-        pesan: res.data?.title as any,
+      if (!uploadImage.success) {
-        kategoriApp: "DONASI",
+        setLoading(false);
-        title: "Donasi baru",
+        return ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
-      };
+      }
-      
+
-      const notif = await notifikasiToAdmin_funCreate({
+      const res = await Donasi_funCreate({
-        data: dataNotif as any,
+        data: body as any,
+        fileId: uploadImage.data.id,
       });
 
-      if (notif.status === 201) {
+      if (res.status === 201) {
-        mqtt_client.publish(
+        const dataNotif: any = {
-          "ADMIN",
+          appId: res.data?.id as any,
-          JSON.stringify({
+          status: res.data?.DonasiMaster_Status?.name as any,
-            count: 1,
+          userId: res.data?.authorId as any,
-          })
+          pesan: res.data?.title as any,
-        );
+          kategoriApp: "DONASI",
-        setLoading(true);
+          title: "Donasi baru",
-        setTabsPostingDonasi("Review");
+        };
-        setDonasiHotMenu(1);
+
-        ComponentGlobal_NotifikasiBerhasil(res.message);
+        const notif = await notifikasiToAdmin_funCreate({
-        router.push(RouterDonasi.main_galang_dana, { scroll: false });
+          data: dataNotif as any,
+        });
+
+        if (notif.status === 201) {
+          mqtt_client.publish(
+            "ADMIN",
+            JSON.stringify({
+              count: 1,
+            })
+          );
+          setTabsPostingDonasi("Review");
+          setDonasiHotMenu(1);
+          ComponentGlobal_NotifikasiBerhasil(res.message);
+          router.push(RouterDonasi.main_galang_dana, { scroll: false });
+        }
+        setLoading(false);
+      } else {
+        ComponentGlobal_NotifikasiGagal(res.message);
+        setLoading(false);
       }
-    } else {
+    } catch (error) {
-      ComponentGlobal_NotifikasiGagal(res.message);
+      console.log(error);
     }
   }
   return (
@@ -138,15 +153,15 @@ export default function CreateCeritaPenggalangDonasi({
               placeholder="Pembuka cerita"
               maxLength={300}
               onChange={(val) =>
-                setCreate({
+                setData({
-                  ...create,
+                  ...data,
                   pembukaan: val.target.value,
                 })
               }
             />
             <ComponentGlobal_InputCountDown
               maxInput={300}
-              lengthInput={create.pembukaan.length}
+              lengthInput={data.pembukaan.length}
             />
           </Stack>
 
@@ -165,32 +180,49 @@ export default function CreateCeritaPenggalangDonasi({
               placeholder="Ceritakan alasan mengapa harus membuat Penggalangan Dana"
               maxLength={300}
               onChange={(val) =>
-                setCreate({
+                setData({
-                  ...create,
+                  ...data,
                   cerita: val.target.value,
                 })
               }
             />
             <ComponentGlobal_InputCountDown
               maxInput={300}
-              lengthInput={create.cerita.length}
+              lengthInput={data.cerita.length}
             />
           </Stack>
 
-          <Stack spacing={"xs"}>
+          <Stack spacing={5}>
-            <Center>
+            <ComponentGlobal_BoxUploadImage>
+              {img ? (
+                <AspectRatio ratio={1 / 1} mah={265} mx={"auto"}>
+                  <Image
+                    style={{ maxHeight: 250, margin: "auto", padding: "5px" }}
+                    alt="Foto"
+                    height={250}
+                    src={img}
+                  />
+                </AspectRatio>
+              ) : (
+                <Stack justify="center" align="center" h={"100%"}>
+                  <IconUpload color="white" />
+                  <Text fz={10} fs={"italic"} c={"white"} fw={"bold"}>
+                    Upload Gambar
+                  </Text>
+                </Stack>
+              )}
+            </ComponentGlobal_BoxUploadImage>
+
+            {/* Upload Foto */}
+            <Group position="center">
               <FileButton
-                onChange={async (files: any | null) => {
+                onChange={async (files: any) => {
                   try {
                     const buffer = URL.createObjectURL(
                       new Blob([new Uint8Array(await files.arrayBuffer())])
                     );
-                    if (files.size > maksimalUploadFile) {
+                    setImg(buffer);
-                      ComponentGlobal_WarningMaxUpload({});
+                    setFile(files);
-                    } else {
-                      setImageCerita(buffer);
-                      setFile(files);
-                    }
                   } catch (error) {
                     console.log(error);
                   }
@@ -200,42 +232,17 @@ export default function CreateCeritaPenggalangDonasi({
                 {(props) => (
                   <Button
                     {...props}
-                    radius={"xl"}
+                    leftIcon={<IconCamera color="black" />}
-                    leftIcon={<IconCamera />}
+                    radius={50}
                     bg={MainColor.yellow}
                     color="yellow"
                     c={"black"}
                   >
-                    Upload
+                    Upload Gambar
                   </Button>
                 )}
               </FileButton>
-            </Center>
+            </Group>
-
-            {imageCerita ? (
-              <AspectRatio ratio={1 / 1} mah={300}>
-                <Paper
-                  style={{
-                    border: `2px solid ${AccentColor.blue}`,
-                    backgroundColor: AccentColor.darkblue,
-                    padding: "10px",
-                    borderRadius: "10px",
-                  }}
-                >
-                  <Image
-                    alt="Foto"
-                    src={imageCerita ? imageCerita : "/aset/no-img.png"}
-                    maw={200}
-                  />
-                </Paper>
-              </AspectRatio>
-            ) : (
-              <Center>
-                <Text fs={"italic"} fz={10} c={"white"}>
-                  Upload poster atau gambar penggalangan !
-                </Text>
-              </Center>
-            )}
           </Stack>
         </Stack>
 
@@ -252,8 +259,8 @@ export default function CreateCeritaPenggalangDonasi({
             label="Nama Bank"
             maxLength={50}
             onChange={(val) => {
-              setCreate({
+              setData({
-                ...create,
+                ...data,
                 namaBank: _.upperCase(val.target.value),
               });
             }}
@@ -269,8 +276,8 @@ export default function CreateCeritaPenggalangDonasi({
             label="Nomor rekening"
             maxLength={100}
             onChange={(val) => {
-              setCreate({
+              setData({
-                ...create,
+                ...data,
                 rekening: val.target.value,
               });
             }}
@@ -280,9 +287,7 @@ export default function CreateCeritaPenggalangDonasi({
           style={{
             transition: "0.5s",
           }}
-          disabled={
+          disabled={_.values(data).includes("") || file === null ? true : false}
-            _.values(create).includes("") || file === null ? true : false
-          }
           loaderPosition="center"
           loading={isLoading ? true : false}
           w={"100%"}

src/app_modules/donasi/create/create_donasi.tsx

@@ -4,32 +4,27 @@ import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import {
   AspectRatio,
   Button,
-  Center,
   FileButton,
+  Group,
   Image,
-  Paper,
   Select,
   Stack,
   Text,
   TextInput,
 } from "@mantine/core";
-import { IconCamera } from "@tabler/icons-react";
+import { IconCamera, IconUpload } from "@tabler/icons-react";
 import { useAtom } from "jotai";
 import { useRouter } from "next/navigation";
 
-import {
+import { DIRECTORY_ID } from "@/app/lib";
-  AccentColor,
+import { MainColor } from "@/app_modules/_global/color/color_pallet";
-  MainColor,
+import { ComponentGlobal_BoxUploadImage } from "@/app_modules/_global/component";
-} from "@/app_modules/_global/color/color_pallet";
 import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
-import {
+import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
-  ComponentGlobal_WarningMaxUpload,
+import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
-  maksimalUploadFile,
-} from "@/app_modules/_global/component/waring_popup";
 import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
 import _ from "lodash";
 import { useState } from "react";
-import { NotifPeringatan } from "../component/notifikasi/notif_peringatan";
 import Donasi_funCreateTemporary from "../fun/create/fun_create_donasi_temporary";
 import { gs_donasi_tabs_posting } from "../global_state";
 import { MODEL_DONASI_ALL_MASTER } from "../model/interface";
@@ -46,7 +41,7 @@ export default function CreateDonasi({
 
   const [kategori, setKategori] = useState(masterKategori);
   const [durasi, setDurasi] = useState(masterDurasi);
-  const [create, setCreate] = useState({
+  const [data, setData] = useState({
     kategoriId: "",
     title: "",
     target: "",
@@ -54,34 +49,48 @@ export default function CreateDonasi({
   });
   const [targetDana, setTargetDana] = useState("");
   const [file, setFile] = useState<File | null>(null);
-  const [imageDonasi, setImageDonasi] = useState<any | null>();
+  const [img, setImg] = useState<any | null>();
   const [tabsPostingDonasi, setTabsPostingDonasi] = useAtom(
     gs_donasi_tabs_posting
   );
 
   async function onCreate() {
+    setLoading(true);
     const body = {
-      donasiMaster_KategoriId: create.kategoriId,
+      donasiMaster_KategoriId: data.kategoriId,
-      donasiMaster_DurasiId: create.durasiId,
+      donasiMaster_DurasiId: data.durasiId,
-      title: create.title,
+      title: data.title,
       target: targetDana,
     };
 
-    if (_.values(body).includes("")) return NotifPeringatan("Lengkapin Data");
+    if (_.values(body).includes(""))
-    if (!file) return NotifPeringatan("Lengkapi Gambar");
+      return ComponentGlobal_NotifikasiPeringatan("Lengkapin Data");
 
-    const gambar = new FormData();
+    try {
-    gambar.append("file", file as any);
+      const uploadImage = await funGlobal_UploadToStorage({
+        file: file as File,
+        dirId: DIRECTORY_ID.donasi_image,
+      });
+      if (!uploadImage.success) {
+        setLoading(false);
+        return ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
+      }
 
-    await Donasi_funCreateTemporary(body as any, gambar).then((res) => {
+      const res = await Donasi_funCreateTemporary({
+        data: body as any,
+        fileId: uploadImage.data.id,
+      });
       if (res.status === 201) {
-        setLoading(true);
         setTabsPostingDonasi("Review");
         router.push(RouterDonasi.create_cerita_penggalang + `${res.donasiId}`);
+        setLoading(false);
       } else {
-        return ComponentGlobal_NotifikasiGagal(res.message);
+        ComponentGlobal_NotifikasiGagal(res.message);
+        setLoading(false);
       }
-    });
+    } catch (error) {
+      console.log(error);
+    }
   }
 
   return (
@@ -102,8 +111,8 @@ export default function CreateDonasi({
             label: e.name,
           }))}
           onChange={(val: string) =>
-            setCreate({
+            setData({
-              ...create,
+              ...data,
               kategoriId: val,
             })
           }
@@ -121,7 +130,7 @@ export default function CreateDonasi({
             placeholder="Contoh: Renovasi Masjid pada kampung, dll"
             maxLength={100}
             onChange={(val) => {
-              setCreate({ ...create, title: val.target.value });
+              setData({ ...data, title: val.target.value });
             }}
           />
           <TextInput
@@ -135,7 +144,7 @@ export default function CreateDonasi({
             withAsterisk
             label="Target Dana"
             placeholder="0"
-            value={create.target}
+            value={data.target}
             onChange={(val) => {
               // console.log(val.currentTarget.value, "nilai");
               const match = val.currentTarget.value
@@ -143,8 +152,8 @@ export default function CreateDonasi({
                 .match(/^[0-9]+$/);
 
               if (val.currentTarget.value === "")
-                return setCreate({
+                return setData({
-                  ...create,
+                  ...data,
                   target: 0 + "",
                 });
               if (!match?.[0]) return null;
@@ -153,8 +162,8 @@ export default function CreateDonasi({
               const target = Intl.NumberFormat("id-ID").format(+nilai);
 
               setTargetDana(nilai);
-              setCreate({
+              setData({
-                ...create,
+                ...data,
                 target,
               });
             }}
@@ -172,25 +181,41 @@ export default function CreateDonasi({
               value: e.id,
               label: e.name + " " + `hari`,
             }))}
-            onChange={(val: string) => setCreate({ ...create, durasiId: val })}
+            onChange={(val: string) => setData({ ...data, durasiId: val })}
           />
         </Stack>
 
         <Stack>
-          <Center>
+          <ComponentGlobal_BoxUploadImage>
+            {img ? (
+              <AspectRatio ratio={1 / 1} mah={265} mx={"auto"}>
+                <Image
+                  style={{ maxHeight: 250, margin: "auto", padding: "5px" }}
+                  alt="Foto"
+                  height={250}
+                  src={img}
+                />
+              </AspectRatio>
+            ) : (
+              <Stack justify="center" align="center" h={"100%"}>
+                <IconUpload color="white" />
+                <Text fz={10} fs={"italic"} c={"white"} fw={"bold"}>
+                  Upload Gambar
+                </Text>
+              </Stack>
+            )}
+          </ComponentGlobal_BoxUploadImage>
+
+          {/* Upload Foto */}
+          <Group position="center">
             <FileButton
-              onChange={async (files: any | null) => {
+              onChange={async (files: any) => {
                 try {
                   const buffer = URL.createObjectURL(
                     new Blob([new Uint8Array(await files.arrayBuffer())])
                   );
-
+                  setImg(buffer);
-                  if (files.size > maksimalUploadFile) {
+                  setFile(files);
-                    ComponentGlobal_WarningMaxUpload({});
-                  } else {
-                    setImageDonasi(buffer);
-                    setFile(files);
-                  }
                 } catch (error) {
                   console.log(error);
                 }
@@ -200,49 +225,24 @@ export default function CreateDonasi({
               {(props) => (
                 <Button
                   {...props}
-                  radius={"xl"}
+                  leftIcon={<IconCamera color="black" />}
-                  leftIcon={<IconCamera />}
+                  radius={50}
                   bg={MainColor.yellow}
                   color="yellow"
                   c={"black"}
                 >
-                  Upload
+                  Upload Gambar
                 </Button>
               )}
             </FileButton>
-          </Center>
+          </Group>
-          {imageDonasi ? (
-            <AspectRatio ratio={1 / 1} mah={300}>
-              <Paper
-                style={{
-                  border: `2px solid ${AccentColor.blue}`,
-                  backgroundColor: AccentColor.darkblue,
-                  padding: "10px",
-                  borderRadius: "10px",
-                }}
-              >
-                <Image
-                  alt="Foto"
-                  src={imageDonasi ? imageDonasi : "/aset/no-img.png"}
-                  maw={200}
-                />
-              </Paper>
-            </AspectRatio>
-          ) : (
-            <Center>
-              <Text fs={"italic"} fz={10} c={"white"}>
-                Upload poster atau gambar penggalangan !
-              </Text>
-            </Center>
-          )}
         </Stack>
+
         <Button
           style={{
             transition: "0.5s",
           }}
-          disabled={
+          disabled={_.values(data).includes("") || file === null ? true : false}
-            _.values(create).includes("") || file === null ? true : false
-          }
           loaderPosition="center"
           loading={isLoading ? true : false}
           my={"lg"}

src/app_modules/donasi/create/layout.tsx

@@ -12,7 +12,9 @@ export default function LayoutCreateDonasi({
   return (
     <>
       <UIGlobal_LayoutTamplate
-        header={<UIGlobal_LayoutHeaderTamplate title="Tambah Donasi" />}
+        header={
+          <UIGlobal_LayoutHeaderTamplate title="Tambah Donasi" hideButtonLeft />
+        }
       >
         {children}
       </UIGlobal_LayoutTamplate>

src/app_modules/donasi/detail/detail_main/cerita_penggalang/index.tsx

@@ -1,10 +1,9 @@
 "use client";
 
-import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import { AccentColor } from "@/app_modules/_global/color/color_pallet";
+import { ComponentGlobal_LoadImageLandscape } from "@/app_modules/_global/component";
 import { MODEL_CERITA_DONASI } from "@/app_modules/donasi/model/interface";
-import { Box, Image, Stack, Text } from "@mantine/core";
+import { Stack, Text } from "@mantine/core";
-import moment from "moment";
 import { useState } from "react";
 
 export default function CeritaPenggalangDonasi({
@@ -33,11 +32,8 @@ export default function CeritaPenggalangDonasi({
         </Text>
         <Text fw={"bold"}> #HaloOrangBaik</Text>
         <Text>{data.pembukaan}</Text>
-        <Image
+
-          radius={"sm"}
+        <ComponentGlobal_LoadImageLandscape fileId={data.imageId} />
-          alt="Foto"
-          src={RouterDonasi.api_image_cerita + `${data.imageCeritaDonasi.url}`}
-        />
         <Text>{data.cerita}</Text>
       </Stack>
     </>

src/app_modules/donasi/detail/detail_main/penggalang_dana/index.tsx

@@ -2,39 +2,24 @@
 
 import { pathAssetImage, RouterImagePreview } from "@/app/lib";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
-import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
-import {
-  AccentColor,
-  MainColor,
-} from "@/app_modules/_global/color/color_pallet";
 import {
   ComponentGlobal_CardStyles,
   ComponentGlobal_LoaderAvatar,
 } from "@/app_modules/_global/component";
 import ComponentDonasi_CardPublish from "@/app_modules/donasi/component/card_view/card_publish";
-import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
 import {
-  MODEL_DONASI,
+  MODEL_DONASI_INFO_PENGGALANG
-  MODEL_DONASI_INFO_PENGGALANG,
 } from "@/app_modules/donasi/model/interface";
 import { MODEL_USER } from "@/app_modules/home/model/interface";
 import {
   ActionIcon,
-  AspectRatio,
   Box,
-  Center,
-  Divider,
-  Grid,
   Group,
   Image,
-  Paper,
-  Progress,
-  SimpleGrid,
   Stack,
   Text,
-  Title,
+  Title
 } from "@mantine/core";
-import { useViewportSize } from "@mantine/hooks";
 import { IconBrandGmail, IconMoodSmile, IconPhone } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 import { useState } from "react";

src/app_modules/donasi/fun/create/fun_create_donasi.ts

@@ -1,26 +1,28 @@
 "use server";
 
-import fs from "fs";
 import prisma from "@/app/lib/prisma";
+import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
+import { revalidatePath } from "next/cache";
 import { MODEL_DONASI } from "../../model/interface";
 import { Donasi_funDeleteTemporaryCreate } from "../delete/fun_delete_temporary_create";
-import { v4 } from "uuid";
-import _ from "lodash";
-import { revalidatePath } from "next/cache";
-
-export async function Donasi_funCreate(req: MODEL_DONASI, file: FormData) {
-  const body = req;
 
+export async function Donasi_funCreate({
+  data,
+  fileId,
+}: {
+  data: MODEL_DONASI;
+  fileId: string;
+}) {
   const dataDonasi = await prisma.donasi.create({
     data: {
-      target: body.target,
+      target: data.target,
-      title: body.title,
+      title: data.title,
-      donasiMaster_DurasiId: body.donasiMaster_DurasiId,
+      donasiMaster_DurasiId: data.donasiMaster_DurasiId,
-      donasiMaster_KategoriId: body.donasiMaster_KategoriId,
+      donasiMaster_KategoriId: data.donasiMaster_KategoriId,
-      imagesId: body.imagesId,
+      authorId: data.authorId,
-      authorId: body.authorId,
+      namaBank: data.namaBank,
-      namaBank: body.namaBank,
+      rekening: data.rekening,
-      rekening: body.rekening,
+      imageId: data.imageId,
     },
     select: {
       id: true,
@@ -35,42 +37,19 @@ export async function Donasi_funCreate(req: MODEL_DONASI, file: FormData) {
   });
 
   if (!dataDonasi) return { status: 400, message: "Gagal disimpan" };
-  await Donasi_funDeleteTemporaryCreate(body.id);
+  await Donasi_funDeleteTemporaryCreate(data.id);
-
-  const dataImage: any = file.get("file");
-  const fileName = dataImage.name;
-  const fileExtension = _.lowerCase(dataImage.name.split(".").pop());
-  const fRandomName = v4(fileName) + "." + fileExtension;
-
-  const uploadImageCerita = await prisma.images.create({
-    data: {
-      url: fRandomName,
-    },
-    select: {
-      id: true,
-      url: true,
-    },
-  });
-
-  if (!uploadImageCerita)
-    return { status: 400, message: "Gagal upload gambar" };
-  const uploadFolder = Buffer.from(await dataImage.arrayBuffer());
-  fs.writeFileSync(
-    `./public/donasi/image_cerita/${uploadImageCerita.url}`,
-    uploadFolder
-  );
 
   const dataCerita = await prisma.donasi_Cerita.create({
     data: {
       donasiId: dataDonasi.id,
-      pembukaan: body.CeritaDonasi.pembukaan,
+      pembukaan: data.CeritaDonasi.pembukaan,
-      cerita: body.CeritaDonasi.cerita,
+      cerita: data.CeritaDonasi.cerita,
-      imagesId: uploadImageCerita.id,
+      imageId: fileId,
     },
   });
 
   if (!dataCerita) return { status: 400, message: "Gagal simpan data cerita" };
-  revalidatePath("/dev/donasi/main/galang_dana");
+  revalidatePath(RouterDonasi.penggalang_dana);
   return {
     data: dataDonasi,
     status: 201,

src/app_modules/donasi/fun/create/fun_create_donasi_temporary.ts

@@ -1,10 +1,7 @@
 "use server";
 
-import fs from "fs";
 import prisma from "@/app/lib/prisma";
-import { MODEL_DONASI, MODEL_DONASI_TEMPORARY } from "../../model/interface";
+import { MODEL_DONASI } from "../../model/interface";
-import _ from "lodash";
-import { v4 } from "uuid";
 
 interface Model_Temporary {
   kategoriId: "";
@@ -13,34 +10,13 @@ interface Model_Temporary {
   durasiId: "";
 }
 
-export default async function Donasi_funCreateTemporary(
+export default async function Donasi_funCreateTemporary({
-  data: MODEL_DONASI,
+  data,
-  file: FormData
+  fileId,
-) {
+}: {
-  // console.log(data, "ini data")
+  data: MODEL_DONASI;
-  // console.log(file, "ini file nya")
+  fileId: string;
-
+}) {
-  const dataImage: any = file.get("file");
-  const fileName = dataImage.name;
-  const fileExtension = _.lowerCase(dataImage.name.split(".").pop());
-  const fRandomName = v4(fileName) + "." + fileExtension;
-
-  const uploadTemporary = await prisma.images.create({
-    data: {
-      url: fRandomName,
-    },
-    select: {
-      id: true,
-      url: true,
-    },
-  });
-
-  if (!uploadTemporary) return { status: 400, message: "Gagal upload gambar" };
-  const uploadFolder = Buffer.from(await dataImage.arrayBuffer());
-  fs.writeFileSync(
-    `./public/donasi/image/${uploadTemporary.url}`,
-    uploadFolder
-  );
 
   const res = await prisma.donasi_TemporaryCreate.create({
     data: {
@@ -48,7 +24,7 @@ export default async function Donasi_funCreateTemporary(
       target: data.target,
       donasiMaster_KategoriId: data.donasiMaster_KategoriId,
       donasiMaster_DurasiId: data.donasiMaster_DurasiId,
-      imagesId: uploadTemporary.id,
+      imageId: fileId,
     },
   });
 

src/app_modules/donasi/fun/get/get_author_by_id.ts

@@ -21,6 +21,9 @@ export async function Donasi_getAuthorById(authorId: string) {
         },
       },
       Donasi: {
+        orderBy: {
+          createdAt: "desc",
+        },
         where: {
           donasiMaster_StatusDonasiId: "1",
         },
@@ -46,6 +49,7 @@ export async function Donasi_getAuthorById(authorId: string) {
           DonasiMaster_Ketegori: true,
           DonasiMaster_Durasi: true,
           DonasiMaster_Status: true,
+          imageId: true,
         },
       },
     },

src/app_modules/donasi/fun/get/get_cerita_penggalang.ts

@@ -13,6 +13,7 @@ export default async function Donasi_getCeritaByDonasiId(donasiId: string) {
       cerita: true,
       imageCeritaDonasi: true,
       createdAt: true,
+      imageId: true,
     },
   });
   return data;

src/app_modules/donasi/fun/get/get_list_beranda.tsx

@@ -17,28 +17,15 @@ export async function donasi_funGetAllPublish({ page }: { page: number }) {
       donasiMaster_StatusDonasiId: "1",
       active: true,
     },
-    select: {
+    include: {
-      id: true,
-      title: true,
-      target: true,
-      active: true,
-      createdAt: true,
-      updatedAt: true,
-      publishTime: true,
-      catatan: true,
-      progres: true,
-      terkumpul: true,
-      authorId: true,
-      imagesId: true,
-      donasiMaster_KategoriId: true,
-      donasiMaster_DurasiId: true,
-      donasiMaster_StatusDonasiId: true,
       Author: true,
-      imageDonasi: true,
       CeritaDonasi: true,
       DonasiMaster_Ketegori: true,
       DonasiMaster_Durasi: true,
       DonasiMaster_Status: true,
+      Donasi_Invoice: true,
+      Donasi_Kabar: true,
+      Donasi_PencairanDana: true,
     },
   });
 

src/app_modules/donasi/fun/get/get_one_donasi_by_id.ts

@@ -7,30 +7,16 @@ export async function Donasi_getOneById(donasiId: string) {
     where: {
       id: donasiId,
     },
-    select: {
+    include: {
-      id: true,
-      title: true,
-      target: true,
-      active: true,
-      createdAt: true,
-      updatedAt: true,
-      publishTime: true,
-      catatan: true,
-      authorId: true,
-      progres: true,
-      terkumpul: true,
-      imagesId: true,
-      namaBank: true,
-      rekening: true,
-      donasiMaster_KategoriId: true,
-      donasiMaster_DurasiId: true,
-      donasiMaster_StatusDonasiId: true,
       Author: true,
       imageDonasi: true,
       CeritaDonasi: true,
       DonasiMaster_Ketegori: true,
       DonasiMaster_Durasi: true,
       DonasiMaster_Status: true,
+      Donasi_Invoice: true,
+      Donasi_Kabar: true,
+      Donasi_PencairanDana: true,
     },
   });
 

src/app_modules/donasi/fun/get/get_temporary_create.ts

@@ -8,5 +8,6 @@ export async function Donasi_getTemporaryCreate(id: string) {
       id: id,
     },
   });
+  
   return data;
 }

src/app_modules/donasi/fun/get/status/get_all_status_publish.ts

@@ -33,6 +33,7 @@ export async function donasi_funGetAllStatusPublish({
       publishTime: true,
       DonasiMaster_Durasi: true,
       terkumpul: true,
+      imageId: true,
     },
   });
   return data;

src/app_modules/donasi/model/interface.ts

@@ -29,6 +29,7 @@ export interface MODEL_DONASI {
   DonasiMaster_Ketegori: MODEL_DONASI_ALL_MASTER;
   DonasiMaster_Durasi: MODEL_DONASI_ALL_MASTER;
   DonasiMaster_Status: MODEL_DONASI_ALL_MASTER;
+  imageId: string
 }
 
 export interface MODEL_CERITA_DONASI {
@@ -41,6 +42,7 @@ export interface MODEL_CERITA_DONASI {
   imagesId: string;
   imageCeritaDonasi: MODEL_IMAGES;
   donasiId: string;
+  imageId: string
 }
 
 export interface MODEL_DONASI_ALL_MASTER {
@@ -61,6 +63,7 @@ export interface MODEL_DONASI_TEMPORARY {
   imagesId: string;
   donasiMaster_KategoriId: string;
   donasiMaster_DurasiId: string;
+  imageId: string
 }
 
 export interface MODEL_DONASI_INFO_PENGGALANG {
@@ -85,6 +88,7 @@ export interface MODEL_DONASI_INVOICE {
   Donasi: MODEL_DONASI;
   DonasiMaster_Bank: MODEL_DONASI_NAMA_BANK;
   DonasiMaster_StatusInvoice: MODEL_DONASI_ALL_MASTER;
+  imageId: string
 }
 
 export interface MODEL_DONASI_NAMA_BANK {
@@ -115,6 +119,7 @@ export interface MODEL_DONASI_KABAR {
   imagesId: string;
   Donasi: MODEL_DONASI;
   ImagesKabar: MODEL_IMAGES;
+  imageId: string
 }
 
 export interface MODEL_DONASI_NOTIF {

src/app_modules/investasi/_component/detail/comp_box_daftar_berita.tsx

@@ -1,4 +1,7 @@
-import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  NEW_RouterInvestasi,
+  RouterInvestasi_OLD,
+} from "@/app/lib/router_hipmi/router_investasi";
 import { AccentColor } from "@/app_modules/_global/color";
 import { ActionIcon, Flex, Loader, Paper, Text } from "@mantine/core";
 import { IconFileDescription } from "@tabler/icons-react";
@@ -25,14 +28,13 @@ export function Investasi_ComponentBoxDaftarBerita({
         }}
         onClick={() => {
           setLoading(true);
-          router.push(
+          router.push(NEW_RouterInvestasi.daftar_berita({ id: investasiId }), {
-            NEW_RouterInvestasi.detail_prospektus({ id: investasiId }),
+            scroll: false,
-            { scroll: false }
+          });
-          );
         }}
       >
         <Flex direction={"column"} align={"center"} justify={"center"}>
-          <Text fz={12}>Berita</Text>
+          <Text fz={12}>Berita </Text>
           <ActionIcon radius={"xl"} variant="transparent" size={60}>
             {isLoading ? (
               <Loader color="yellow" />

src/app_modules/investasi/_component/detail/saham_saya/comp_detail_data.tsx

@@ -1,4 +1,3 @@
-import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
 import {
   ComponentGlobal_AvatarAndUsername,
   ComponentGlobal_CardStyles,
@@ -6,16 +5,13 @@ import {
 } from "@/app_modules/_global/component";
 import { MODEL_INVOICE_INVESTASI } from "@/app_modules/investasi/_lib/interface";
 import {
-  AspectRatio,
   Box,
   Grid,
-  Image,
   SimpleGrid,
   Stack,
   Text,
-  Title,
+  Title
 } from "@mantine/core";
-import { Investasi_ComponentStylesCard } from "../../comp_card_border_and_background";
 import { Investasi_ComponentBoxDaftarBerita } from "../comp_box_daftar_berita";
 import { Investasi_ComponentBoxDaftarDokumen } from "../comp_box_daftar_dokumen";
 import { Investasi_ComponentBoxProspektus } from "../comp_box_prospektus";

src/app_modules/investasi/_component/main/comp_card_beranda.tsx

@@ -1,4 +1,7 @@
-import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  NEW_RouterInvestasi,
+  RouterInvestasi_OLD,
+} from "@/app/lib/router_hipmi/router_investasi";
 import { Warna } from "@/app/lib/warna";
 import {
   AccentColor,
@@ -46,7 +49,9 @@ export function Investasi_ComponentCardBeranda({
         onClickHandler={() => {
           setLoadingDetail(true);
           setVisible(true);
-          router.push(RouterInvestasi_OLD.detail + `${data?.id}`);
+          router.push(NEW_RouterInvestasi.detail_main({ id: data.id }), {
+            scroll: false,
+          });
         }}
       >
         <Stack>
@@ -59,7 +64,9 @@ export function Investasi_ComponentCardBeranda({
             </Grid.Col>
             <Grid.Col span={6}>
               <Stack>
-                <Text fw={"bold"} align="center" lineClamp={2}>{data?.title}</Text>
+                <Text fw={"bold"} align="center" lineClamp={2}>
+                  {data?.title}
+                </Text>
 
                 <Progress
                   label={(+data?.progress).toFixed(2) + " %"}

src/app_modules/investasi/_component/main/comp_card_portofolio_publish.tsx

@@ -19,7 +19,10 @@ import { MODEL_INVESTASI } from "../../_lib/interface";
 import { Investasi_ComponentStylesCard } from "../comp_card_border_and_background";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
-import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
+import {
+  ComponentGlobal_CardLoadingOverlay,
+  ComponentGlobal_LoadImageCustom,
+} from "@/app_modules/_global/component";
 
 export function Investasi_ComponentCardPortofolioPublish({
   data,
@@ -34,7 +37,9 @@ export function Investasi_ComponentCardPortofolioPublish({
       <Investasi_ComponentStylesCard
         marginBottom={"15px"}
         onClickHandler={() => {
-          router.push(NEW_RouterInvestasi.detail_portofolio({ id: data?.id }));
+          router.push(NEW_RouterInvestasi.detail_main({ id: data?.id }), {
+            scroll: false,
+          });
           setVisible(true);
         }}
       >
@@ -53,14 +58,10 @@ export function Investasi_ComponentCardPortofolioPublish({
           </Grid.Col>
 
           <Grid.Col span={4}>
-            <AspectRatio ratio={16 / 9}>
+            <ComponentGlobal_LoadImageCustom
-              <Paper radius={"md"}>
+              height={80}
-                <Image
+              fileId={data.imageId}
-                  alt=""
+            />
-                  src={NEW_RouterInvestasi.api_gambar + `${data?.imagesId}`}
-                />
-              </Paper>
-            </AspectRatio>
           </Grid.Col>
         </Grid>
 

src/app_modules/investasi/_component/main/comp_card_saham_saya.tsx

@@ -87,18 +87,6 @@ export function Investasi_ComponentSahamSaya({
         </SimpleGrid>
         {visible && <ComponentGlobal_CardLoadingOverlay />}
       </Investasi_ComponentStylesCard>
-
-      {/* <Card
-        style={{
-          padding: "15px",
-          backgroundColor: AccentColor.darkblue,
-          border: `2px solid ${AccentColor.blue}`,
-          borderRadius: "10px",
-          color: "white",
-          marginBottom: "15px",
-        }}
-        onClick={}
-      ></Card> */}
     </>
   );
 }

src/app_modules/investasi/_fun/create/fun_create_berita.tsx

@@ -0,0 +1,45 @@
+"use server";
+
+import { prisma } from "@/app/lib";
+import _ from "lodash";
+import { Model_Berita_Investasi } from "../../_lib/interface";
+import { revalidatePath } from "next/cache";
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+
+export async function investasi_funCreateBerita({
+  data,
+  fileId,
+}: {
+  data: Model_Berita_Investasi | any;
+  fileId?: string;
+}) {
+  if (fileId != undefined) {
+    const createWithFile = await prisma.beritaInvestasi.create({
+      data: {
+        title: _.startCase(data.title),
+        deskripsi: data.deskripsi,
+        investasiId: data.investasiId,
+        imageId: fileId,
+      },
+    });
+
+    if (!createWithFile)
+      return { status: 400, message: "Gagal menambah berita" };
+
+    revalidatePath(NEW_RouterInvestasi.rekap_berita({ id: data.investasiId }));
+    return { status: 201, message: "Berhasil menambah berita" };
+  } else {
+    const createNoFile = await prisma.beritaInvestasi.create({
+      data: {
+        title: _.startCase(data.title),
+        deskripsi: data.deskripsi,
+        investasiId: data.investasiId,
+      },
+    });
+
+    if (!createNoFile) return { status: 400, message: "Gagal menambah berita" };
+
+    revalidatePath(NEW_RouterInvestasi.rekap_berita({ id: data.investasiId }));
+    return { status: 201, message: "Berhasil menambah berita " };
+  }
+}

src/app_modules/investasi/_fun/delete/fun_delete_berita.tsx

@@ -0,0 +1,23 @@
+"use server";
+
+import { prisma } from "@/app/lib";
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import { revalidatePath } from "next/cache";
+
+export async function investasi_funDeleteBerita({
+  beritaId,
+}: {
+  beritaId: string;
+}) {
+  const del = await prisma.beritaInvestasi.delete({
+    where: {
+      id: beritaId,
+    },
+  });
+
+  if (!del) return { status: 400, message: "Gagal hapus data" };
+  revalidatePath(
+    NEW_RouterInvestasi.rekap_berita({ id: del.investasiId as any })
+  );
+  return { status: 200, message: "Berhasil hapus data" };
+}

src/app_modules/investasi/_fun/get/fun_get_berita_by_id.tsx

@@ -0,0 +1,24 @@
+"use server";
+
+import { prisma } from "@/app/lib";
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import { revalidatePath } from "next/cache";
+
+export async function investasi_funGetBeritaById({
+  investasiId,
+}: {
+  investasiId: string;
+}) {
+  const data = prisma.beritaInvestasi.findMany({
+    orderBy: {
+      updatedAt: "desc",
+    },
+    where: {
+      investasiId: investasiId,
+      active: true,
+    },
+  });
+
+  revalidatePath(NEW_RouterInvestasi.rekap_berita({ id: investasiId }));
+  return data;
+}

src/app_modules/investasi/_fun/get/fun_get_one_berita_by_id.tsx

@@ -0,0 +1,18 @@
+"use server";
+
+import { prisma } from "@/app/lib";
+
+export async function investasi_funGetOneBeritaById({
+  beritaId,
+}: {
+  beritaId: any;
+}) {
+  const data = await prisma.beritaInvestasi.findFirst({
+    where: {
+      id: beritaId,
+    },
+  });
+
+
+  return data;
+}

src/app_modules/investasi/_fun/get/fun_get_one_investasi_by_id.ts

@@ -16,6 +16,7 @@ export async function investasi_funGetOneInvestasiById({
           Profile: true,
         },
       },
+      Investasi_Invoice: true,
       MasterStatusInvestasi: true,
       BeritaInvestasi: true,
       DokumenInvestasi: true,
@@ -24,7 +25,6 @@ export async function investasi_funGetOneInvestasiById({
       MasterPencarianInvestor: true,
       MasterPeriodeDeviden: true,
       MasterProgresInvestasi: true,
-      
     },
   });
 

src/app_modules/investasi/_fun/index.ts

@@ -14,10 +14,15 @@ import { investasi_funCreateDocument } from "./create/fun_create_document";
 import { investasi_funGetOneDocumentById } from "./get/fun_get_one_document_by_id";
 import { investasi_funUpdateDocument } from "./edit/fun_edit_document";
 import { investasi_funDeleteDokumenById } from "./delete/fun_delete_dokumen";
+import { investasi_funCreateBerita } from "./create/fun_create_berita";
+import { investasi_funGetBeritaById } from "./get/fun_get_berita_by_id";
+import { investasi_funGetOneBeritaById } from "./get/fun_get_one_berita_by_id";
+import { investasi_funDeleteBerita } from "./delete/fun_delete_berita";
 
 // Create
 export { investasi_funCreateNewInvestasi };
 export { investasi_funCreateDocument };
+export { investasi_funCreateBerita };
 
 // Get
 export { investasi_funGetOneInvestasiById };
@@ -29,6 +34,8 @@ export { investasi_funGetAllInvestasiNonPublishByUserId };
 export { investasi_funGetPortofolioByStatusId };
 export { investasi_funGetAllDocumentById };
 export { investasi_funGetOneDocumentById };
+export { investasi_funGetBeritaById };
+export { investasi_funGetOneBeritaById };
 
 // Update
 export { investasi_funUpdateInvestasi };
@@ -40,3 +47,4 @@ export { investasi_funUploadBuktiTransferById };
 
 // Delete
 export { investasi_funDeleteDokumenById };
+export { investasi_funDeleteBerita };

src/app_modules/investasi/_ui/create/ui_create_berita.tsx

@@ -0,0 +1,23 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewCreateBerita } from "../../_view";
+
+export function Investasi_UiCreateBerita({
+  investasiId,
+}: {
+  investasiId: string;
+}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Tambah Berita" />}
+      >
+        <Investasi_ViewCreateBerita investasiId={investasiId} />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_berita.tsx

@@ -0,0 +1,115 @@
+"use client";
+
+import { funGlobal_DeleteFileById } from "@/app_modules/_global/fun";
+import {
+  ComponentGlobal_NotifikasiBerhasil,
+  ComponentGlobal_NotifikasiGagal,
+  ComponentGlobal_NotifikasiPeringatan,
+} from "@/app_modules/_global/notif_global";
+import {
+  UIGlobal_DrawerCustom,
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+  UIGlobal_Modal
+} from "@/app_modules/_global/ui";
+import { ActionIcon, Button, Center, Stack, Text } from "@mantine/core";
+import { IconDotsVertical, IconTrash } from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { investasi_funDeleteBerita } from "../../_fun";
+import { Investasi_ViewDetailBerita } from "../../_view";
+
+export function Investasi_UiDetailBerita({ dataBerita }: { dataBerita: any }) {
+  const router = useRouter();
+  const [openDrawer, setOpenDrawer] = useState(false);
+  const [openModal, setOpenModal] = useState(false);
+  const [data, setData] = useState(dataBerita);
+
+  async function onDelete() {
+    const del = await investasi_funDeleteBerita({
+      beritaId: dataBerita.id,
+    });
+
+    if (del.status === 200) {
+      const deleteImage = await funGlobal_DeleteFileById({
+        fileId: data.imageId,
+      });
+
+      if (!deleteImage.success) {
+        ComponentGlobal_NotifikasiPeringatan("Gagal hapus gambar ");
+      }
+
+      ComponentGlobal_NotifikasiBerhasil(del.message);
+      setOpenModal(false);
+      router.back();
+    } else {
+      ComponentGlobal_NotifikasiGagal(del.message);
+    }
+  }
+
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={
+          <UIGlobal_LayoutHeaderTamplate
+            title="Detail Berita"
+            customButtonRight={
+              <ActionIcon
+                variant="transparent"
+                onClick={() => setOpenDrawer(true)}
+              >
+                <IconDotsVertical color="white" />
+              </ActionIcon>
+            }
+          />
+        }
+      >
+        <Investasi_ViewDetailBerita dataBerita={data} />
+      </UIGlobal_LayoutTamplate>
+
+      <UIGlobal_DrawerCustom
+        opened={openDrawer}
+        close={() => setOpenDrawer(false)}
+        component={
+          <Center>
+            <Stack
+              align="center"
+              spacing={"xs"}
+              onClick={() => {
+                setOpenDrawer(false);
+                setOpenModal(true);
+              }}
+            >
+              <ActionIcon variant="transparent">
+                <IconTrash color="red" />
+              </ActionIcon>
+              <Text c={"red"}>Hapus berita</Text>
+            </Stack>
+          </Center>
+        }
+      />
+
+      <UIGlobal_Modal
+        opened={openModal}
+        close={() => setOpenModal(false)}
+        title={"Anda yakin ingin menghapus berita ini ?"}
+        buttonKiri={
+          <Button radius="xl" onClick={() => setOpenModal(false)}>
+            Batal
+          </Button>
+        }
+        buttonKanan={
+          <Button
+            radius="xl"
+            color="red"
+            onClick={() => {
+              onDelete();
+            }}
+          >
+            Hapus
+          </Button>
+        }
+      />
+    </>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_daftar_berita.tsx

@@ -0,0 +1,21 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewDaftarBerita } from "../../_view";
+
+export function Investasi_UiDaftarBerita({
+  dataBerita,
+}: {
+  dataBerita: any[];
+}) {
+  return (
+    <UIGlobal_LayoutTamplate
+      header={<UIGlobal_LayoutHeaderTamplate title="Daftar Berita" />}
+    >
+      <Investasi_ViewDaftarBerita dataBerita={dataBerita} />
+    </UIGlobal_LayoutTamplate>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_detail_main.tsx

@@ -0,0 +1,79 @@
+"use client";
+
+import {
+  UIGlobal_Drawer,
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { ActionIcon } from "@mantine/core";
+import { IconCategoryPlus, IconDotsVertical } from "@tabler/icons-react";
+import { MODEL_INVESTASI } from "../../_lib/interface";
+import { Investasi_ViewDetailPublish } from "../../_view";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import {
+  NEW_RouterInvestasi,
+  RouterInvestasi_OLD,
+} from "@/app/lib/router_hipmi/router_investasi";
+import { IconDeviceIpadPlus } from "@tabler/icons-react";
+
+export function Investasi_UiDetailMain({
+  dataInvestasi,
+  userLoginId,
+}: {
+  dataInvestasi: MODEL_INVESTASI;
+  userLoginId: string;
+}) {
+  const router = useRouter();
+  const [openDrawer, setOpenDrawer] = useState(false);
+
+  const listPage = [
+    {
+      id: "1",
+      name: "Tambah & Edit Dokumen",
+      icon: <IconCategoryPlus />,
+      path: NEW_RouterInvestasi.rekap_dokumen({ id: dataInvestasi.id }),
+    },
+    {
+      id: "2",
+      name: "Tambah & Edit Berita",
+      icon: <IconDeviceIpadPlus />,
+      path: NEW_RouterInvestasi.rekap_berita({ id: dataInvestasi.id }),
+    },
+  ];
+
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={
+          <UIGlobal_LayoutHeaderTamplate
+            title="Detail "
+            customButtonRight={
+              userLoginId === dataInvestasi.authorId ? (
+                <ActionIcon
+                  variant="transparent"
+                  onClick={() => setOpenDrawer(true)}
+                >
+                  <IconDotsVertical color="white" />
+                </ActionIcon>
+              ) : (
+                <ActionIcon disabled variant="transparent" />
+              )
+            }
+          />
+        }
+      >
+        <Investasi_ViewDetailPublish
+          dataInvestasi={dataInvestasi}
+          userLoginId={userLoginId}
+        />
+      </UIGlobal_LayoutTamplate>
+
+      <UIGlobal_Drawer
+        opened={openDrawer}
+        close={() => setOpenDrawer(false)}
+        component={listPage}
+      />
+    </>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_detail_portofolio.tsx

@@ -13,20 +13,23 @@ import {
   IconEdit,
   IconFilePencil,
 } from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
 import { useState } from "react";
 import { MODEL_INVESTASI } from "../../_lib/interface";
 import {
   Investasi_ViewDetailDraft,
-  Investasi_ViewDetailPublish,
   Investasi_ViewDetailReject,
   Investasi_ViewDetailReview,
 } from "../../_view";
 
 export function Investasi_UiDetailPortofolio({
   data,
+  userLoginId,
 }: {
   data: MODEL_INVESTASI;
+  userLoginId: string;
 }) {
+  const router = useRouter();
   const [openDrawer, setOpenDrawer] = useState(false);
   const listPage = [
     {
@@ -86,9 +89,12 @@ export function Investasi_UiDetailPortofolio({
         />
       }
     >
-      {data.masterStatusInvestasiId === "1" && (
+      {/* {data.masterStatusInvestasiId === "1" && (
-        <Investasi_ViewDetailPublish dataInvestasi={data} />
+        <Investasi_ViewDetailPublish
-      )}
+          dataInvestasi={data}
+          userLoginId={userLoginId}
+        />
+      )} */}
 
       {data.masterStatusInvestasiId === "2" && (
         <Investasi_ViewDetailReview dataInvestasi={data} />

src/app_modules/investasi/_ui/detail/ui_rekap_berita.tsx

@@ -0,0 +1,63 @@
+"use client";
+
+import {
+  UIGlobal_Drawer,
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { ActionIcon } from "@mantine/core";
+import { IconCirclePlus, IconDotsVertical } from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { Investasi_ViewRekapBerita } from "../../_view";
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+
+export function Investasi_UiRekapBerita({
+  investasiId,
+  dataBerita,
+}: {
+  investasiId: string;
+  dataBerita: any[]
+}) {
+  const router = useRouter();
+  const [openDrawer, setOpenDrawer] = useState(false);
+
+  const listPage = [
+    {
+      id: "1",
+      name: "Tambah Berita",
+      icon: <IconCirclePlus />,
+      path: NEW_RouterInvestasi.create_berita({ id: investasiId }),
+    },
+  ];
+
+  return (
+    <UIGlobal_LayoutTamplate
+      header={
+        <UIGlobal_LayoutHeaderTamplate
+          title="Rekap Berita"
+          customButtonRight={
+            <ActionIcon
+              variant="transparent"
+              onClick={() => {
+                setOpenDrawer(true);
+              }}
+            >
+              <IconDotsVertical color="white" />
+            </ActionIcon>
+          }
+        />
+      }
+    >
+
+
+      <Investasi_ViewRekapBerita dataBerita={dataBerita} />
+
+      <UIGlobal_Drawer
+        opened={openDrawer}
+        close={() => setOpenDrawer(false)}
+        component={listPage}
+      />
+    </UIGlobal_LayoutTamplate>
+  );
+}

src/app_modules/investasi/_ui/index.ts

@@ -19,6 +19,11 @@ import { Investasi_UiEditInvestasi } from "./edit/ui_edit_investasi";
 import { Investasi_UiEditProspektus } from "./edit/ui_edit_prospektus";
 import { Investasi_UiCreateDocument } from "./create/ui_create_document";
 import { Investasi_UiRekapDokumen } from "./detail/ui_rekap_dokumen";
+import { Investasi_UiDetailMain } from "./detail/ui_detail_main";
+import { Investasi_UiDaftarBerita } from "./detail/ui_daftar_berita";
+import { Investasi_UiRekapBerita } from "./detail/ui_rekap_berita";
+import { Investasi_UiCreateBerita } from "./create/ui_create_berita";
+import { Investasi_UiDetailBerita } from "./detail/ui_berita";
 
 export { Investasi_UiProsesPembelian };
 export { Investasi_UiMetodePembayaran };
@@ -41,3 +46,8 @@ export { Investasi_UiEditInvestasi };
 export { Investasi_UiEditProspektus };
 export { Investasi_UiCreateDocument };
 export { Investasi_UiRekapDokumen };
+export { Investasi_UiDetailMain };
+export { Investasi_UiDaftarBerita };
+export { Investasi_UiRekapBerita };
+export { Investasi_UiCreateBerita };
+export { Investasi_UiDetailBerita };

src/app_modules/investasi/_view/create/view_create_berita.tsx

@@ -0,0 +1,206 @@
+import { AccentColor, MainColor } from "@/app_modules/_global/color";
+import {
+    ComponentGlobal_BoxInformation,
+    ComponentGlobal_BoxUploadImage,
+    ComponentGlobal_InputCountDown,
+} from "@/app_modules/_global/component";
+import {
+    ComponentGlobal_NotifikasiBerhasil,
+    ComponentGlobal_NotifikasiGagal,
+    ComponentGlobal_NotifikasiPeringatan,
+} from "@/app_modules/_global/notif_global";
+import {
+    AspectRatio,
+    Button,
+    Center,
+    FileButton,
+    Image,
+    Stack,
+    Text,
+    TextInput,
+    Textarea,
+} from "@mantine/core";
+import { IconCamera, IconUpload } from "@tabler/icons-react";
+
+import { DIRECTORY_ID } from "@/app/lib";
+import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
+import { Prisma } from "@prisma/client";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { investasi_funCreateBerita } from "../../_fun";
+
+export function Investasi_ViewCreateBerita({
+  investasiId,
+}: {
+  investasiId: string;
+}) {
+  const router = useRouter();
+  const [file, setFile] = useState<File | null>(null);
+  const [img, setImg] = useState<any | null>();
+  const [isLoading, setIsLoading] = useState(false);
+
+  const [data, setData] = useState<Prisma.BeritaInvestasiCreateArgs>({
+    data: {
+      title: "",
+      deskripsi: "",
+      investasiId: investasiId,
+    },
+  });
+
+  async function onCreate() {
+    if (data.data.title == "" || data.data.deskripsi == "")
+      return ComponentGlobal_NotifikasiPeringatan("Lengkapi data");
+
+    try {
+      setIsLoading(true);
+      if (file != null) {
+        const uploadFile = await funGlobal_UploadToStorage({
+          file: file as File,
+          dirId: DIRECTORY_ID.investasi_berita,
+        });
+
+        if (!uploadFile.success)
+          return ComponentGlobal_NotifikasiPeringatan("Gagal upload gambar");
+
+        const createWithFile = await investasi_funCreateBerita({
+          data: data.data as any,
+          fileId: uploadFile.data.id,
+        });
+
+        createWithFile.status === 201
+          ? (ComponentGlobal_NotifikasiBerhasil(createWithFile.message),
+            router.back())
+          : ComponentGlobal_NotifikasiGagal(createWithFile.message);
+      } else {
+        const createNoFile = await investasi_funCreateBerita({
+          data: data.data as any,
+        });
+
+        createNoFile.status === 201
+          ? (ComponentGlobal_NotifikasiBerhasil(createNoFile.message),
+            router.back())
+          : ComponentGlobal_NotifikasiGagal(createNoFile.message);
+      }
+    } catch (error) {
+      console.log(error);
+    } finally {
+      setIsLoading(false);
+    }
+  }
+
+  return (
+    <>
+      <Stack px={"sm"}>
+        <ComponentGlobal_BoxInformation informasi="Pengunggahan foto ke aplikasi bersifat opsional dan tidak diwajibkan, Anda dapat menyimpan berita tanpa mengunggah foto." />
+
+        <Stack spacing={5}>
+          <ComponentGlobal_BoxUploadImage>
+            {img ? (
+              <AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
+                <Image
+                  style={{ maxHeight: 250 }}
+                  alt="Foto"
+                  height={250}
+                  src={img}
+                />
+              </AspectRatio>
+            ) : (
+              <Stack justify="center" align="center" h={"100%"}>
+                <IconUpload color="white" />
+                <Text fz={10} fs={"italic"} c={"white"} fw={"bold"}>
+                  Upload Gambar
+                </Text>
+              </Stack>
+            )}
+          </ComponentGlobal_BoxUploadImage>
+
+          <Center>
+            <FileButton
+              onChange={async (files: any | null) => {
+                try {
+                  const buffer = URL.createObjectURL(
+                    new Blob([new Uint8Array(await files.arrayBuffer())])
+                  );
+                  setImg(buffer);
+                  setFile(files);
+                } catch (error) {
+                  console.log(error);
+                }
+              }}
+              accept="image/png,image/jpeg"
+            >
+              {(props) => (
+                <Button
+                  {...props}
+                  radius={"xl"}
+                  w={100}
+                  style={{
+                    backgroundColor: MainColor.yellow,
+                    border: `1px solid ${AccentColor.yellow}`,
+                  }}
+                >
+                  <IconCamera color="black" />
+                </Button>
+              )}
+            </FileButton>
+          </Center>
+        </Stack>
+
+        <TextInput
+          withAsterisk
+          placeholder="Masukan judul berita"
+          styles={{
+            label: {
+              color: "white",
+            },
+          }}
+          label="Judul berita"
+          onChange={(val) => {
+            setData({ data: { ...data.data, title: val.target.value } });
+          }}
+        />
+
+        <Stack spacing={5}>
+          <Textarea
+            withAsterisk
+            placeholder="Masukan deskripsi berita"
+            styles={{
+              label: {
+                color: "white",
+              },
+            }}
+            label="Deskripsi"
+            autosize
+            maxLength={500}
+            minRows={2}
+            maxRows={6}
+            onChange={(val) => {
+              setData({
+                data: { ...data.data, deskripsi: val.target.value },
+              });
+            }}
+          />
+          <ComponentGlobal_InputCountDown
+            lengthInput={data.data.deskripsi.length}
+            maxInput={500}
+          />
+        </Stack>
+
+        <Button
+          loaderPosition="center"
+          loading={isLoading}
+          my={"md"}
+          radius={50}
+          bg={MainColor.yellow}
+          color="yellow"
+          c={"black"}
+          onClick={() => {
+            onCreate();
+          }}
+        >
+          Simpan
+        </Button>
+      </Stack>
+    </>
+  );
+}

src/app_modules/investasi/_view/detail/portofolio/view_detai_publish.tsx

@@ -1,232 +0,0 @@
-"use client";
-
-import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
-import { AccentColor } from "@/app_modules/_global/color/color_pallet";
-import { MODEL_INVESTASI } from "@/app_modules/investasi/_lib/interface";
-import {
-  ActionIcon,
-  AspectRatio,
-  Box,
-  Flex,
-  Grid,
-  Group,
-  Image,
-  Paper,
-  Progress,
-  Stack,
-  Text,
-  Title,
-} from "@mantine/core";
-import {
-  IconBookDownload,
-  IconCircleCheck,
-  IconFileDescription,
-  IconSpeakerphone,
-} from "@tabler/icons-react";
-import moment from "moment";
-import { useRouter } from "next/navigation";
-import { useState } from "react";
-
-export default function Investasi_ViewDetailPublish({
-  dataInvestasi,
-}: {
-  dataInvestasi: MODEL_INVESTASI;
-}) {
-  const router = useRouter();
-  const [investasi, setInvestasi] = useState(dataInvestasi);
-
-  const listBox = [
-    {
-      id: 1,
-      name: "Prospektus",
-      icon: <IconBookDownload size={70} color="white" />,
-      route: RouterInvestasi_OLD.detail_prospektus,
-    },
-    {
-      id: 2,
-      name: "Dokumen",
-      icon: <IconFileDescription size={70} color="white" />,
-      route: RouterInvestasi_OLD.edit_dokumen,
-    },
-    {
-      id: 3,
-      name: "Berita",
-      icon: <IconSpeakerphone size={70} color="white" />,
-      route: RouterInvestasi_OLD.list_edit_berita,
-    },
-  ];
-
-  return (
-    <Stack
-      style={{
-        paddingInline: "15px",
-        paddingBlock: "15px",
-        backgroundColor: AccentColor.darkblue,
-        border: `2px solid ${AccentColor.blue}`,
-        borderRadius: "10px",
-        color: "white",
-        marginBottom: "15px",
-      }}
-    >
-      {Number(investasi.MasterPencarianInvestor.name) -
-        moment(new Date()).diff(new Date(investasi.countDown), "days") <=
-      0 ? (
-        <Group
-          position="center"
-          mb={"sm"}
-          style={{
-            color: "white",
-          }}
-        >
-          <IconCircleCheck color="green" />
-          <Text c={"green"}>Selesai</Text>
-        </Group>
-      ) : (
-        <Group
-          mb={"sm"}
-          position="center"
-          style={{
-            color: "white",
-          }}
-        >
-          <Text>
-            Sisa waktu :{" "}
-            {Number(investasi.MasterPencarianInvestor.name) -
-              moment(new Date()).diff(
-                new Date(investasi.countDown),
-                "days"
-              )}{" "}
-            hari
-          </Text>
-        </Group>
-      )}
-
-      <AspectRatio ratio={1 / 1} mx={"sm"} mah={250}>
-        <Image
-          alt=""
-          src={RouterInvestasi_OLD.api_gambar + `${investasi.imagesId}`}
-          radius={"sm"}
-          height={250}
-          width={"100%"}
-        />
-      </AspectRatio>
-
-      {/* Title dan Persentase */}
-      <Box mb={"md"}>
-        <Title align="center" order={3} mb={"xs"}>
-          {investasi.title}
-        </Title>
-        <Progress
-          label={
-            "" +
-            (
-              ((+investasi.totalLembar - +investasi.sisaLembar) /
-                +investasi.totalLembar) *
-              100
-            ).toFixed(1) +
-            "%"
-          }
-          value={
-            +(
-              ((+investasi.totalLembar - +investasi.sisaLembar) /
-                +investasi.totalLembar) *
-              100
-            ).toFixed(1)
-          }
-          color="teal"
-          size="xl"
-          radius="xl"
-        />
-      </Box>
-
-      {/* Rincian Data */}
-      <Grid p={"md"} mb={"md"}>
-        <Grid.Col span={6}>
-          <Stack>
-            <Box>
-              <Text>Dana Dibutuhkan</Text>
-              <Text>
-                Rp.{" "}
-                {new Intl.NumberFormat("id-ID", {
-                  maximumSignificantDigits: 10,
-                }).format(+investasi.targetDana)}
-              </Text>
-            </Box>
-            <Box>
-              <Text>Harga Per Lembar</Text>
-              <Text>
-                Rp.{" "}
-                {new Intl.NumberFormat("id-ID", {
-                  maximumSignificantDigits: 10,
-                }).format(+investasi.hargaLembar)}
-              </Text>
-            </Box>
-            <Box>
-              <Text>Jadwal Pembagian</Text>
-              <Text>{investasi.MasterPembagianDeviden.name} bulan </Text>
-            </Box>
-            <Box>
-              <Text>Pembagian Deviden</Text>
-              <Text>{investasi.MasterPeriodeDeviden.name}</Text>
-            </Box>
-          </Stack>
-        </Grid.Col>
-        <Grid.Col span={6}>
-          <Stack>
-            <Box>
-              <Text>ROI</Text>
-              <Text>{investasi.roi}%</Text>
-            </Box>
-            <Box>
-              <Text>Total Lembar</Text>
-              <Text>
-                {new Intl.NumberFormat("id-ID", {
-                  maximumSignificantDigits: 10,
-                }).format(+investasi.totalLembar)}{" "}
-                lembar
-              </Text>
-            </Box>
-            <Box>
-              <Text>Sisa Lembar</Text>
-              <Text>
-                {new Intl.NumberFormat("id-ID", {
-                  maximumSignificantDigits: 10,
-                }).format(+investasi.sisaLembar)}{" "}
-                lembar
-              </Text>
-            </Box>
-          </Stack>
-        </Grid.Col>
-      </Grid>
-
-      {/* List Box */}
-      <Group position="apart" px={"lg"}>
-        {listBox.map((e, i) => (
-          <Paper
-            key={i}
-            style={{
-              padding: "15px",
-              backgroundColor: AccentColor.blue,
-              border: `2px solid ${AccentColor.softblue}`,
-              borderRadius: "10px",
-              color: "white",
-            }}
-          >
-            <Flex direction={"column"} align={"center"} justify={"center"}>
-              <Text fz={12}>{e.name}</Text>
-              <ActionIcon
-                radius={"xl"}
-                // loading={isLoadingBox && e?.id === boxId ? true : false}
-                variant="transparent"
-                size={60}
-                onClick={() => router.push(e.route + `${investasi.id}`)}
-              >
-                {e.icon}
-              </ActionIcon>
-            </Flex>
-          </Paper>
-        ))}
-      </Group>
-    </Stack>
-  );
-}

src/app_modules/investasi/_view/detail/portofolio/view_detail_draft.tsx

@@ -1,16 +1,12 @@
 "use client";
 
-import {
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
-  NEW_RouterInvestasi,
-  RouterInvestasi_OLD,
-} from "@/app/lib/router_hipmi/router_investasi";
 import { MainColor } from "@/app_modules/_global/color/color_pallet";
 import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
 import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
 import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
 import { Investasi_ComponentDetailDataNonPublish } from "@/app_modules/investasi/_component";
 import { MODEL_INVESTASI } from "@/app_modules/investasi/_lib/interface";
-import { ComponentInvestasi_DetailDataNonPublish } from "@/app_modules/investasi/component/detail/x_detai_data_non_publish";
 import { investasi_funEditStatusById } from "@/app_modules/investasi/fun/edit/fun_edit_status_by_id";
 import { gs_investasi_status } from "@/app_modules/investasi/g_state";
 import notifikasiToAdmin_funCreate from "@/app_modules/notifikasi/fun/create/create_notif_to_admin";
@@ -27,7 +23,6 @@ export default function Investasi_ViewDetailDraft({
 }) {
   const router = useRouter();
   const [isLoading, setIsLoading] = useState(false);
-  const [activeTab, setActiveTab] = useAtom(gs_investasi_status);
 
   async function onAjukanReview() {
     const res = await investasi_funEditStatusById({
@@ -54,8 +49,7 @@ export default function Investasi_ViewDetailDraft({
 
         setIsLoading(true);
         ComponentGlobal_NotifikasiBerhasil("Review Berhasil Diajukan");
-        router.push(NEW_RouterInvestasi.portofolio({ id: dataInvestasi.id }));
+        router.push(NEW_RouterInvestasi.portofolio({ id: "2" }));
-        setActiveTab("Review");
       }
     } else {
       ComponentGlobal_NotifikasiGagal(res.message);

src/app_modules/investasi/_view/detail/portofolio/view_detail_publish.tsx

@@ -0,0 +1,221 @@
+"use client";
+
+import {
+  NEW_RouterInvestasi,
+  RouterInvestasi_OLD,
+} from "@/app/lib/router_hipmi/router_investasi";
+import { MainColor } from "@/app_modules/_global/color/color_pallet";
+import {
+  ComponentGlobal_AvatarAndUsername,
+  ComponentGlobal_CardStyles,
+  ComponentGlobal_LoadImageLandscape,
+} from "@/app_modules/_global/component";
+import {
+  Investasi_ComponentBoxDaftarBerita,
+  Investasi_ComponentBoxDaftarDokumen,
+  Investasi_ComponentBoxProgress,
+  Investasi_ComponentBoxProspektus,
+  Investasi_ComponentTitleAndValueInDetail,
+} from "@/app_modules/investasi/_component";
+import { MODEL_INVESTASI } from "@/app_modules/investasi/_lib/interface";
+import {
+  Box,
+  Button,
+  Center,
+  SimpleGrid,
+  Stack,
+  Text,
+  Title,
+} from "@mantine/core";
+import { useLocalStorage } from "@mantine/hooks";
+import {
+  IconBookDownload,
+  IconFileDescription,
+  IconSpeakerphone,
+} from "@tabler/icons-react";
+import _ from "lodash";
+import moment from "moment";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export default function Investasi_ViewDetailPublish({
+  dataInvestasi,
+  userLoginId,
+}: {
+  dataInvestasi: MODEL_INVESTASI;
+  userLoginId: string;
+}) {
+  const router = useRouter();
+  const [data, setData] = useState(dataInvestasi);
+  const [boxId, setBoxId] = useState(0);
+  const [isLoadingBox, setLoadingBox] = useState(false);
+  const [isLoadingButton, setLoadingButton] = useState(false);
+  const [total, setTotal] = useLocalStorage({
+    key: "total_investasi",
+    defaultValue: 0,
+  });
+  const [jumlah, setJumlah] = useLocalStorage({
+    key: "jumlah_investasi",
+    defaultValue: 0,
+  });
+  async function onSubmit() {
+    setLoadingButton(true);
+
+    //NEW
+    router.push(NEW_RouterInvestasi.pembelian + data.id, { scroll: false });
+    setTotal(0);
+    setJumlah(0);
+  }
+
+  return (
+    <Stack>
+      <Investasi_ComponentBoxProgress progress={data.progress} />
+
+      <ComponentGlobal_CardStyles>
+        <Stack spacing={"xl"}>
+          <ComponentGlobal_AvatarAndUsername
+            profile={data.author.Profile as any}
+          />
+          <ComponentGlobal_LoadImageLandscape fileId={data.imageId} />
+
+          {/* Title dan Persentase */}
+          <Center>
+            <Title order={3} align="center">
+              {_.startCase(data.title)}
+            </Title>
+          </Center>
+
+          {/* Rincian Data */}
+
+          <Stack>
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Investor"
+              value={<Text>{data.Investasi_Invoice.length} </Text>}
+            />
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Target Dana"
+              value={
+                <Text>
+                  Rp.{" "}
+                  {new Intl.NumberFormat("id-ID", {
+                    maximumSignificantDigits: 20,
+                  }).format(+data.targetDana)}{" "}
+                </Text>
+              }
+            />
+
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Harga Per Lembar"
+              value={
+                <Text>
+                  Rp.{" "}
+                  {new Intl.NumberFormat("id-ID", {
+                    maximumSignificantDigits: 10,
+                  }).format(+data.hargaLembar)}
+                </Text>
+              }
+            />
+
+            <Investasi_ComponentTitleAndValueInDetail
+              title={<Text fs={"italic"}>Return Of Invesment (RoI)</Text>}
+              value={<Text>{data.roi} %</Text>}
+            />
+
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Total Lembar"
+              value={
+                <Text>
+                  {new Intl.NumberFormat("id-ID", {
+                    maximumSignificantDigits: 10,
+                  }).format(+data.totalLembar)}{" "}
+                  lembar
+                </Text>
+              }
+            />
+
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Sisa Lembar"
+              value={
+                <Text>
+                  {new Intl.NumberFormat("id-ID", {
+                    maximumSignificantDigits: 10,
+                  }).format(+data.sisaLembar)}{" "}
+                  lembar
+                </Text>
+              }
+            />
+
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Jadwal Pembagian"
+              value={<Text>{data.MasterPembagianDeviden.name} Bulan </Text>}
+            />
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Pembagian Deviden"
+              value={<Text>{data.MasterPeriodeDeviden.name}</Text>}
+            />
+            <Investasi_ComponentTitleAndValueInDetail
+              title="Pencarian Investor"
+              value={<Text>{data.MasterPencarianInvestor.name} Hari </Text>}
+            />
+          </Stack>
+
+          {/* List Box */}
+          <SimpleGrid
+            cols={3}
+            breakpoints={[
+              { maxWidth: "62rem", cols: 3, spacing: "md" },
+              { maxWidth: "48rem", cols: 2, spacing: "sm" },
+              { maxWidth: "36rem", cols: 1, spacing: "sm" },
+            ]}
+          >
+            <Investasi_ComponentBoxProspektus
+              prospektusFileId={data.prospektusFileId}
+            />
+            <Investasi_ComponentBoxDaftarDokumen investasiId={data?.id} />
+            <Investasi_ComponentBoxDaftarBerita investasiId={data?.id} />
+          </SimpleGrid>
+        </Stack>
+      </ComponentGlobal_CardStyles>
+
+      <Box my={"md"}>
+        {data.sisaLembar === "0" ||
+        Number(data.MasterPencarianInvestor.name) -
+          moment(new Date()).diff(new Date(data.countDown), "days") <=
+          0 ? (
+          <Center mb={"md"}>
+            <Button disabled radius={50} variant="transparent">
+              Investasi Telah Ditutup
+            </Button>
+          </Center>
+        ) : (
+          <Box>
+            {userLoginId === data.authorId ? (
+              <Center mb={"md"}>
+                <Button disabled radius={50}>
+                  Investasi Ini Milik Anda
+                </Button>
+              </Center>
+            ) : (
+              <Center mb={"md"}>
+                <Button
+                  loaderPosition="center"
+                  loading={isLoadingButton}
+                  w={"100%"}
+                  radius={50}
+                  bg={MainColor.yellow}
+                  color="yellow"
+                  c={"black"}
+                  onClick={() => {
+                    onSubmit();
+                  }}
+                >
+                  Beli Saham
+                </Button>
+              </Center>
+            )}
+          </Box>
+        )}
+      </Box>
+    </Stack>
+  );
+}

src/app_modules/investasi/_view/detail/portofolio/view_detail_reject.tsx

@@ -10,7 +10,6 @@ import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_glo
 import UIGlobal_Modal from "@/app_modules/_global/ui/ui_modal";
 import { Investasi_ComponentDetailDataNonPublish } from "@/app_modules/investasi/_component";
 import { MODEL_INVESTASI } from "@/app_modules/investasi/_lib/interface";
-import { ComponentInvestasi_DetailDataNonPublish } from "@/app_modules/investasi/component/detail/x_detai_data_non_publish";
 import { investasi_funEditStatusById } from "@/app_modules/investasi/fun/edit/fun_edit_status_by_id";
 import funDeleteInvestasi from "@/app_modules/investasi/fun/fun_delete_investasi";
 import { gs_investasi_status } from "@/app_modules/investasi/g_state";
@@ -49,7 +48,7 @@ export default function Investasi_ViewDetailReject({
       if (res.status === 200) {
         ComponentGlobal_NotifikasiBerhasil(res.message);
         setOpenModal(false);
-        router.push(NEW_RouterInvestasi.portofolio({ id: dataInvestasi.id }));
+        router.push(NEW_RouterInvestasi.portofolio({ id: "3" }));
       } else {
         ComponentGlobal_NotifikasiGagal(res.message);
       }

src/app_modules/investasi/_view/detail/portofolio/view_detail_review.tsx

@@ -1,6 +1,9 @@
 "use client";
 
-import { NEW_RouterInvestasi, RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  NEW_RouterInvestasi,
+  RouterInvestasi_OLD,
+} from "@/app/lib/router_hipmi/router_investasi";
 import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
 import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
 import { Investasi_ComponentDetailDataNonPublish } from "@/app_modules/investasi/_component";
@@ -14,7 +17,6 @@ import { useAtom } from "jotai";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
 
-
 export default function Investasi_ViewDetailReview({
   dataInvestasi,
 }: {
@@ -22,8 +24,6 @@ export default function Investasi_ViewDetailReview({
 }) {
   const router = useRouter();
   const [isLoading, setLoading] = useState(false);
-
-  const [activeTab, setActiveTab] = useAtom(gs_investasi_status);
   const [data, setData] = useState<MODEL_INVESTASI>(dataInvestasi);
 
   async function onCancleReview() {
@@ -50,8 +50,7 @@ export default function Investasi_ViewDetailReview({
 
         setLoading(true);
         ComponentGlobal_NotifikasiBerhasil("Review Dibatalkan");
-        setActiveTab("Draft");
+        router.push(NEW_RouterInvestasi.portofolio({ id: "3" }));
-        router.push(NEW_RouterInvestasi.portofolio({id: data.id}));
       }
     } else {
       ComponentGlobal_NotifikasiPeringatan(res.message);

src/app_modules/investasi/_view/detail/view_berita.tsx

@@ -0,0 +1,37 @@
+import {
+  ComponentGlobal_CardStyles,
+  ComponentGlobal_LoadImageLandscape,
+} from "@/app_modules/_global/component";
+import { Stack, Text, Title } from "@mantine/core";
+import { Prisma } from "@prisma/client";
+import { useState } from "react";
+
+export function Investasi_ViewDetailBerita({
+  dataBerita,
+}: {
+  dataBerita: any;
+}) {
+  const [data, setData] =
+    useState<Prisma.BeritaInvestasiGetPayload<{}>>(dataBerita);
+
+  return (
+    <>
+      <ComponentGlobal_CardStyles>
+        <Stack>
+          {data.imageId == null ? (
+            ""
+          ) : (
+            <ComponentGlobal_LoadImageLandscape fileId={data.imageId} />
+          )}
+
+          <Title order={4} align="center">
+            {" "}
+            {data.title}
+          </Title>
+
+          <Text>{data.deskripsi}</Text>
+        </Stack>
+      </ComponentGlobal_CardStyles>
+    </>
+  );
+}

src/app_modules/investasi/_view/detail/view_daftar_berita.tsx

@@ -0,0 +1,45 @@
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  ComponentGlobal_CardStyles,
+  ComponentGlobal_CardLoadingOverlay,
+} from "@/app_modules/_global/component";
+import { Box, Title } from "@mantine/core";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export function Investasi_ViewDaftarBerita({
+  dataBerita,
+}: {
+  dataBerita: any[];
+}) {
+  const router = useRouter();
+  const [data, setData] = useState(dataBerita);
+  const [visible, setVisible] = useState(false);
+  const [dataId, setDataId] = useState("");
+
+  return (
+    <>
+      <Box>
+        {data.map((e, i) => (
+          <ComponentGlobal_CardStyles
+            key={i}
+            onClickHandler={() => {
+              router.push(NEW_RouterInvestasi.berita({ id: e.id }), {
+                scroll: false,
+              });
+              setVisible(true);
+              setDataId(e.id);
+            }}
+          >
+            <Title order={6} lineClamp={1}>
+              {e.title}
+            </Title>
+            {visible && dataId === e.id && (
+              <ComponentGlobal_CardLoadingOverlay />
+            )}
+          </ComponentGlobal_CardStyles>
+        ))}
+      </Box>
+    </>
+  );
+}

src/app_modules/investasi/_view/detail/view_daftar_dokemen.tsx

@@ -1,14 +1,12 @@
-import { ComponentGlobal_BoxInformation } from "@/app_modules/_global/component";
 import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
 import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
 import { Box, Center, Stack } from "@mantine/core";
-import { data } from "autoprefixer";
 import _ from "lodash";
 import { ScrollOnly } from "next-scroll-loader";
-import { investasi_funGetAllDocumentById } from "../../_fun";
 import { useState } from "react";
-import { MODEL_INVESTASI_DOKUMEN } from "../../_lib/interface";
 import { Investasi_ComponentCardDaftarDocument } from "../../_component";
+import { investasi_funGetAllDocumentById } from "../../_fun";
+import { MODEL_INVESTASI_DOKUMEN } from "../../_lib/interface";
 
 export function Investasi_ViewDaftarDokumen({
   dataDokumen,

src/app_modules/investasi/_view/detail/view_detail_main.tsx

@@ -0,0 +1,11 @@
+export function Investasi_ViewDetailMain({
+    dataInvestasi,
+}: {
+    dataInvestasi: any;
+}) {
+    return (
+        <>
+            data disni
+        </>
+    );
+}

src/app_modules/investasi/_view/detail/view_rekap_berita.tsx

@@ -0,0 +1,45 @@
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  ComponentGlobal_CardLoadingOverlay,
+  ComponentGlobal_CardStyles,
+} from "@/app_modules/_global/component";
+import { Box, Group, Title } from "@mantine/core";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export function Investasi_ViewRekapBerita({
+  dataBerita,
+}: {
+  dataBerita: any[];
+}) {
+  const router = useRouter();
+  const [data, setData] = useState(dataBerita);
+  const [visible, setVisible] = useState(false);
+  const [dataId, setDataId] = useState("");
+
+  return (
+    <>
+      <Box>
+        {data.map((e, i) => (
+          <ComponentGlobal_CardStyles
+            key={i}
+            onClickHandler={() => {
+              router.push(NEW_RouterInvestasi.berita({ id: e.id }), {
+                scroll: false,
+              });
+              setVisible(true);
+              setDataId(e.id);
+            }}
+          >
+            <Title order={6} lineClamp={1}>
+              {e.title}
+            </Title>
+            {visible && dataId === e.id && (
+              <ComponentGlobal_CardLoadingOverlay />
+            )}
+          </ComponentGlobal_CardStyles>
+        ))}
+      </Box>
+    </>
+  );
+}

src/app_modules/investasi/_view/index.ts

@@ -10,7 +10,7 @@ import { Investasi_ViewInvoice } from "./transaksi/view_invoice";
 import { Investasi_ViewMetodePembayaran } from "./transaksi/view_metode_pembayaran";
 import { Investasi_ViewProsesPembelian } from "./transaksi/view_proses_pembelian";
 import { Investasi_ViewProsesTransaksi } from "./transaksi/view_proses_transaksi";
-import Investasi_ViewDetailPublish from "./detail/portofolio/view_detai_publish";
+import Investasi_ViewDetailPublish from "./detail/portofolio/view_detail_publish";
 import Investasi_ViewDetailReview from "./detail/portofolio/view_detail_review";
 import Investasi_ViewDetailDraft from "./detail/portofolio/view_detail_draft";
 import Investasi_ViewDetailReject from "./detail/portofolio/view_detail_reject";
@@ -21,6 +21,11 @@ import { Investasi_ViewEditInvestasi } from "./edit/view_edit_investasi";
 import { Investasi_ViewEditProspektus } from "./edit/view_edit_prospektus";
 import { Investasi_ViewCreateDocument } from "./create/view_create_document";
 import { Investasi_ViewRekapDokumen } from "./detail/view_rekap_dokumen";
+import { Investasi_ViewDetailMain } from "./detail/view_detail_main";
+import { Investasi_ViewRekapBerita } from "./detail/view_rekap_berita";
+import { Investasi_ViewDaftarBerita } from "./detail/view_daftar_berita";
+import { Investasi_ViewCreateBerita } from "./create/view_create_berita";
+import { Investasi_ViewDetailBerita } from "./detail/view_berita";
 
 export { Investasi_ViewProsesPembelian };
 export { Investasi_ViewMetodePembayaran };
@@ -44,3 +49,8 @@ export { Investasi_ViewEditInvestasi };
 export { Investasi_ViewEditProspektus };
 export { Investasi_ViewCreateDocument };
 export { Investasi_ViewRekapDokumen };
+export { Investasi_ViewDetailMain };
+export { Investasi_ViewRekapBerita };
+export { Investasi_ViewDaftarBerita };
+export { Investasi_ViewCreateBerita };
+export { Investasi_ViewDetailBerita };

src/app_modules/investasi/create/view.tsx

@@ -25,7 +25,12 @@ import {
   Text,
   TextInput,
 } from "@mantine/core";
-import { IconCamera, IconCircleCheck, IconFileTypePdf, IconUpload } from "@tabler/icons-react";
+import {
+  IconCamera,
+  IconCircleCheck,
+  IconFileTypePdf,
+  IconUpload,
+} from "@tabler/icons-react";
 import _ from "lodash";
 import { useState } from "react";
 import { Investasi_ComponentButtonCreateNewInvestasi } from "../_component";
@@ -106,14 +111,9 @@ export default function InvestasiCreate({
                   const buffer = URL.createObjectURL(
                     new Blob([new Uint8Array(await files.arrayBuffer())])
                   );
-                  // console.log(files.size);
 
-                  if (files.size > maksimalUploadFile) {
+                  setImg(buffer);
-                    ComponentGlobal_WarningMaxUpload({});
+                  setFileImage(files);
-                  } else {
-                    setImg(buffer);
-                    setFileImage(files);
-                  }
                 } catch (error) {
                   console.log(error);
                 }
@@ -161,34 +161,6 @@ export default function InvestasiCreate({
             )}
           </ComponentGlobal_CardStyles>
 
-          {/* {!pdf ? (
-            <Paper
-              w={"100%"}
-              style={{
-                border: `2px solid gray`,
-                backgroundColor: "gray.1",
-                padding: "10px",
-                borderRadius: "10px",
-                color: "gray",
-              }}
-            >
-              <Text>Upload File Prospektus</Text>
-            </Paper>
-          ) : (
-            <Paper
-              w={"100%"}
-              style={{
-                border: `2px solid ${AccentColor.softblue}`,
-                backgroundColor: AccentColor.blue,
-                padding: "10px",
-                borderRadius: "10px",
-                color: "white",
-              }}
-            >
-              <Text lineClamp={1}>{pdf.name}</Text>
-            </Paper>
-          )} */}
-          {/* {JSON.stringify(filePdf)} */}
           <Group position="center">
             <FileButton
               accept={"application/pdf"}

src/app_modules/investasi/create_berita/view.tsx

@@ -50,11 +50,11 @@ export default function CreateBeritaInvestasi({
     const fd = new FormData();
     fd.append("file", fl);
 
-    await funCreateBeritaInvestasi(fd, body as any).then((res) => {
+    // await funCreateBeritaInvestasi(fd, body as any).then((res) => {
-      res.status === 201
+    //   res.status === 201
-        ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back())
+    //     ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back())
-        : ComponentGlobal_NotifikasiGagal(res.message);
+    //     : ComponentGlobal_NotifikasiGagal(res.message);
-    });
+    // });
 
     // router.back();
     // toast("Berita tersimpan");

src/app_modules/investasi/fun/fun_create_berita.ts

@@ -1,12 +1,11 @@
 "use server";
 
-import _ from "lodash";
-import { MODEL_INVESTASI } from "../_lib/interface";
-import { v4 } from "uuid";
 import prisma from "@/app/lib/prisma";
-import fs from "fs";
-import { revalidatePath } from "next/cache";
 import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
+import fs from "fs";
+import _ from "lodash";
+import { revalidatePath } from "next/cache";
+import { v4 } from "uuid";
 
 export default async function funCreateBeritaInvestasi(
   formData: FormData,
@@ -34,8 +33,8 @@ export default async function funCreateBeritaInvestasi(
       message: "File Kosong",
     };
 
-  const upFolder = Buffer.from(await file.arrayBuffer());
+  // const upFolder = Buffer.from(await file.arrayBuffer());
-  fs.writeFileSync(`./public/investasi/${upload.url}`, upFolder);
+  // fs.writeFileSync(`./public/investasi/${upload.url}`, upFolder);
 
   const createBerita = await prisma.beritaInvestasi.create({
     data: {