Donasi Info Admni

# feat
- info admin
- hapus admin
## Issue: Loading data belum untuk versi alfa

prisma/schema.prisma

@@ -25,6 +25,7 @@ model User {
   TransaksiInvestasi TransaksiInvestasi[]
   Donasi             Donasi[]
   Donasi_Invoice     Donasi_Invoice[]
+  Donasi_Notif       Donasi_Notif[]
 }
 
 model MasterUserRole {
@@ -77,6 +78,8 @@ model Images {
   CeritaDonasi           Donasi_Cerita[]
   Donasi_TemporaryCreate Donasi_TemporaryCreate[]
   Donasi_Kabar           Donasi_Kabar[]
+  Donasi_PencairanDana   Donasi_PencairanDana[]
+  Donasi_Invoice         Donasi_Invoice[]
 }
 
 model Katalog {
@@ -275,18 +278,22 @@ model MasterStatusTransaksiInvestasi {
   TransaksiInvestasi TransaksiInvestasi[]
 }
 
-// -------------------- DONASI --------------------- //
+/// ---------------------------------------- DONASI ----------------------------------------- //
 model Donasi {
-  id          String    @id @default(cuid())
-  title       String
-  target      String
-  active      Boolean   @default(true)
-  createdAt   DateTime  @default(now())
-  updatedAt   DateTime  @updatedAt
-  publishTime DateTime?
-  catatan     String?
-  progres     String?   @default("0")
-  terkumpul   String?   @default("0")
+  id                 String    @id @default(cuid())
+  title              String
+  target             String
+  active             Boolean   @default(true)
+  createdAt          DateTime  @default(now())
+  updatedAt          DateTime  @updatedAt
+  publishTime        DateTime?
+  catatan            String?
+  progres            String?   @default("0")
+  terkumpul          String?   @default("0")
+  namaBank           String?
+  rekening           String?
+  akumulasiPencairan Int?      @default(0)
+  totalPencairan     Int?      @default(0)
 
   Author                      User?                      @relation(fields: [authorId], references: [id])
   authorId                    String?
@@ -301,6 +308,7 @@ model Donasi {
   donasiMaster_StatusDonasiId String?                    @default("2")
   Donasi_Invoice              Donasi_Invoice[]
   Donasi_Kabar                Donasi_Kabar[]
+  Donasi_PencairanDana        Donasi_PencairanDana[]
 }
 
 model Donasi_TemporaryCreate {
@@ -395,6 +403,8 @@ model Donasi_Invoice {
   donasiMaster_StatusInvoiceId String?                     @default("3")
   Author                       User?                       @relation(fields: [authorId], references: [id])
   authorId                     String?
+  Images                       Images?                     @relation(fields: [imagesId], references: [id])
+  imagesId                     String?
 }
 
 model Donasi_Kabar {
@@ -405,8 +415,36 @@ model Donasi_Kabar {
   createdAt DateTime @default(now())
   updatedAt DateTime @updatedAt
 
-  Donasi      Donasi? @relation(fields: [donasiId], references: [id])
+  Donasi       Donasi?        @relation(fields: [donasiId], references: [id])
+  donasiId     String?
+  ImagesKabar  Images?        @relation(fields: [imagesId], references: [id])
+  imagesId     String?
+  Donasi_Notif Donasi_Notif[]
+}
+
+model Donasi_Notif {
+  id        String   @id @default(cuid())
+  isRead    Boolean  @default(false)
+  active    Boolean  @default(true)
+  createdAt DateTime @default(now())
+  updatedAt DateTime @updatedAt
+
+  User           User?         @relation(fields: [userId], references: [id])
+  userId         String?
+  Donasi_Kabar   Donasi_Kabar? @relation(fields: [donasi_KabarId], references: [id])
+  donasi_KabarId String?
+}
+
+model Donasi_PencairanDana {
+  id          String   @id @default(cuid())
+  nominalCair Int
+  title       String
+  deskripsi   String
+  active      Boolean  @default(true)
+  createdAt   DateTime @default(now())
+  updatedAt   DateTime @updatedAt
+  Donasi      Donasi?  @relation(fields: [donasiId], references: [id])
   donasiId    String?
-  ImagesKabar Images? @relation(fields: [imagesId], references: [id])
+  Images      Images?  @relation(fields: [imagesId], references: [id])
   imagesId    String?
 }

src/app/api/donasi/gambar_bukti_transfer/[id]/route.ts

@@ -0,0 +1,32 @@
+import prisma from "@/app/lib/prisma";
+import fs from "fs";
+import { NextRequest, NextResponse } from "next/server";
+
+export async function GET(
+  req: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  const get = await prisma.images.findUnique({
+    where: {
+      id: params.id,
+    },
+    select: {
+      url: true,
+    },
+  });
+
+  if (!fs.existsSync(`./public/donasi/invoice/${get?.url}`)) {
+    const notFile = fs.readFileSync("./public/aset/global/no_img.png");
+    return new NextResponse(notFile, {
+      headers: {
+        "Content-Type": "image/png",
+      },
+    });
+  }
+  const file = fs.readFileSync(`./public/donasi/invoice/${get?.url}`);
+  return new NextResponse(file, {
+    headers: {
+      "Content-Type": "image/png",
+    },
+  });
+}

src/app/api/donasi/gambar_pencairan/[id]/route.ts

@@ -0,0 +1,34 @@
+import prisma from "@/app/lib/prisma";
+import fs from "fs";
+import { NextRequest, NextResponse } from "next/server";
+
+export async function GET(
+  req: NextRequest,
+  { params }: { params: { id: string } }
+) {
+
+  const get = await prisma.images.findUnique({
+    where: {
+      id: params.id,
+    },
+    select: {
+      url: true,
+    },
+  });
+
+
+  if (!fs.existsSync(`./public/donasi/pencairan/${get?.url}`)) {
+    const notFile = fs.readFileSync("./public/aset/global/no_img.png");
+    return new NextResponse(notFile, {
+      headers: {
+        "Content-Type": "image/png",
+      },
+    });
+  }
+  const file = fs.readFileSync(`./public/donasi/pencairan/${get?.url}`);
+  return new NextResponse(file, {
+    headers: {
+      "Content-Type": "image/png",
+    },
+  });
+}

src/app/dev/admin/donasi/detail/publish/[id]/page.tsx

@@ -1,17 +1,24 @@
 import { AdminDonasi_DetailPublish } from "@/app_modules/admin/donasi";
 import { AdminDonasi_funCountDonatur } from "@/app_modules/admin/donasi/fun/count/fun_count_donatur";
 import { AdminDonasi_getListDonatur } from "@/app_modules/admin/donasi/fun/get/get_list_donatur_by_id";
-import { AdminDonasi_getById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
-
-export default async function Page({params}: {params: {id: string}}) {
-const dataPublish = await AdminDonasi_getById(params.id)
-const listDonatur = await AdminDonasi_getListDonatur(params.id) 
-const countDonatur = await AdminDonasi_funCountDonatur(params.id)
+import { AdminDonasi_getListPencairanDana } from "@/app_modules/admin/donasi/fun/get/get_list_pencairan_dana_by_id";
+import { AdminDonasi_getOneById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
 
+export default async function Page({ params }: { params: { id: string } }) {
+  const dataPublish = await AdminDonasi_getOneById(params.id);
+  const listDonatur = await AdminDonasi_getListDonatur(params.id);
+  const countDonatur = await AdminDonasi_funCountDonatur(params.id);
+  const listPencairan = await AdminDonasi_getListPencairanDana(params.id);
+  // console.log(listDonatur)
 
   return (
     <>
-      <AdminDonasi_DetailPublish dataPublish={dataPublish as any} listDonatur={listDonatur} countDonatur={countDonatur} />
+      <AdminDonasi_DetailPublish
+        dataPublish={dataPublish as any}
+        listDonatur={listDonatur}
+        countDonatur={countDonatur}
+        listPencairan={listPencairan as any}
+      />
     </>
   );
 }

src/app/dev/admin/donasi/detail/reject/[id]/page.tsx

@@ -1,8 +1,8 @@
 import { AdminDonasi_DetailReject } from "@/app_modules/admin/donasi";
-import { AdminDonasi_getById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
+import { AdminDonasi_getOneById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
 
 export default async function Page({ params }: { params: { id: string } }) {
-  const dataReject = await AdminDonasi_getById(params.id);
+  const dataReject = await AdminDonasi_getOneById(params.id);
 
   return (
     <>

src/app/dev/admin/donasi/detail/review/[id]/page.tsx

@@ -1,9 +1,9 @@
 import { AdminDonasi_DetailReview } from "@/app_modules/admin/donasi";
-import { AdminDonasi_getById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
+import { AdminDonasi_getOneById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
 
 export default async function Page({params}: {params: {id: string}}) {
     // console.log(params.id)
-    const dataReview = await AdminDonasi_getById(params.id)
+    const dataReview = await AdminDonasi_getOneById(params.id)
     // console.log(dataReview)
     return <AdminDonasi_DetailReview dataReview={dataReview as any}/>
 }

src/app/dev/admin/donasi/pencairan_dana/[id]/page.tsx

@@ -0,0 +1,6 @@
+import { AdminDonasi_PencairanDana } from "@/app_modules/admin/donasi";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  let donasiId = params.id;
+  return <AdminDonasi_PencairanDana donasiId={donasiId} />;
+}

src/app/dev/admin/donasi/proses_transaksi/[id]/page.tsx

@@ -1,4 +1,5 @@
-import AdminDonasi_ProsesTransaksi from "@/app_modules/admin/donasi/detail_table/publish/proses_transaksi";
+
+import { AdminDonasi_ProsesTransaksi } from "@/app_modules/admin/donasi";
 import { AdminDonasi_getListStatusInvoiceProses } from "@/app_modules/admin/donasi/fun/get/get_list_status_invoice_proses";
 
 export default async function Page({params}: {params: {id: string}}) {

src/app/dev/admin/donasi/table/publish/page.tsx

@@ -1,5 +1,5 @@
 import { AdminDonasi_TablePublish } from "@/app_modules/admin/donasi";
-import { AdminDonasi_getByStatus } from "@/app_modules/admin/donasi/fun/get/get_donasi_by_status";
+import { AdminDonasi_getByStatus } from "@/app_modules/admin/donasi/fun/get/get_list_donasi_by_status";
 
 export default async function Page() {
     const listPublish = await AdminDonasi_getByStatus("1")

src/app/dev/admin/donasi/table/reject/page.tsx

@@ -1,5 +1,5 @@
 import { AdminDonasi_TableReject } from "@/app_modules/admin/donasi";
-import { AdminDonasi_getByStatus } from "@/app_modules/admin/donasi/fun/get/get_donasi_by_status";
+import { AdminDonasi_getByStatus } from "@/app_modules/admin/donasi/fun/get/get_list_donasi_by_status";
 
 export default async function Page() {
     const dataReject = await AdminDonasi_getByStatus("4")

src/app/dev/admin/donasi/table/review/page.tsx

@@ -1,5 +1,5 @@
 import { AdminDonasi_TableReview } from "@/app_modules/admin/donasi";
-import { AdminDonasi_getByStatus } from "@/app_modules/admin/donasi/fun/get/get_donasi_by_status";
+import { AdminDonasi_getByStatus } from "@/app_modules/admin/donasi/fun/get/get_list_donasi_by_status";
 import { getToken_UserId } from "@/app_modules/fun/get_user_token";
 
 export default async function Page() {

src/app/dev/donasi/create/cerita_penggalang/[id]/layout.tsx

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

src/app/dev/donasi/detail/detail_kabar/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { DetailKabarDonasi } from "@/app_modules/donasi";
+import { Donasi_getOneKabar } from "@/app_modules/donasi/fun/get/get_one_kabar";
+
+export default async function Page({params}: {params: {id: string}}) {
+
+    let kabarId = params.id
+    const dataDonasi = await Donasi_getOneKabar(kabarId)
+
+    return <DetailKabarDonasi dataDonasi={dataDonasi as any}/>
+}

src/app/dev/donasi/detail/detail_kabar/page.tsx

@@ -1,5 +0,0 @@
-import { DetailKabarDonasi } from "@/app_modules/donasi";
-
-export default async function Page() {
-    return <DetailKabarDonasi/>
-}

src/app/dev/donasi/detail/detail_main/[id]/page.tsx

@@ -1,16 +1,17 @@
 import { DetailMainDonasi } from "@/app_modules/donasi";
 import { Donasi_getCountDonatur } from "@/app_modules/donasi/fun/count/get_count_donatur";
 import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id";
+import { getToken_UserId } from "@/app_modules/fun/get_user_token";
 
 export default async function Page({ params }: { params: { id: string } }) {
   let donasiId = params.id;
   const dataDonasi = await Donasi_getOneById(donasiId);
   const countDonatur = await Donasi_getCountDonatur(donasiId)
-
+  const userLoginId = await getToken_UserId();
 
   return (
     <>
-      <DetailMainDonasi dataDonasi={dataDonasi as any} countDonatur={countDonatur} />
+      <DetailMainDonasi dataDonasi={dataDonasi as any} countDonatur={countDonatur} userLoginId={userLoginId}/>
     </>
   );
 }

src/app/dev/donasi/detail/detail_notif/[id]/layout.tsx

@@ -0,0 +1,22 @@
+import prisma from "@/app/lib/prisma";
+import { LayoutDonasi_DetailNotif } from "@/app_modules/donasi";
+import { Donasi_getOneKabar } from "@/app_modules/donasi/fun/get/get_one_kabar";
+import React from "react";
+
+export default async function Layout({
+  children,
+  params,
+}: {
+  children: React.ReactNode;
+  params: { id: string };
+}) {
+  let kabarId = params.id;
+  const dataKabar = await Donasi_getOneKabar(kabarId);
+  const donasiId =  dataKabar?.donasiId
+
+  return (
+    <>
+      <LayoutDonasi_DetailNotif donasiId={donasiId as any}>{children}</LayoutDonasi_DetailNotif>
+    </>
+  );
+}

src/app/dev/donasi/detail/detail_notif/[id]/page.tsx

@@ -0,0 +1,9 @@
+import { Donasi_DetailNotif } from "@/app_modules/donasi";
+import { Donasi_getOneKabar } from "@/app_modules/donasi/fun/get/get_one_kabar";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  let kabarId = params.id;
+  const dataKabar = await Donasi_getOneKabar(kabarId);
+
+  return <Donasi_DetailNotif dataKabar={dataKabar as any} />;
+}

src/app/dev/donasi/detail/detail_publish/[id]/page.tsx

@@ -1,14 +1,18 @@
 import { DetailPublishDonasi } from "@/app_modules/donasi";
 import { Donasi_getCountDonatur } from "@/app_modules/donasi/fun/count/get_count_donatur";
 import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id";
+import { getToken_UserId } from "@/app_modules/fun/get_user_token";
 
 export default async function Page({ params }: { params: { id: string } }) {
   const dataPublish = await Donasi_getOneById(params.id);
   const countDonatur= await Donasi_getCountDonatur(params.id)
+  const userLoginId = await getToken_UserId();
+
+  console.log(userLoginId)
 
   return (
     <>
-      <DetailPublishDonasi dataPublish={dataPublish as any} countDonatur={countDonatur} />
+      <DetailPublishDonasi dataPublish={dataPublish as any} countDonatur={countDonatur} userLoginId={userLoginId}/>
     </>
   );
 }

src/app/dev/donasi/edit/edit_rekening/[id]/layout.tsx

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

src/app/dev/donasi/edit/edit_rekening/[id]/page.tsx

@@ -0,0 +1,17 @@
+import { Donasi_EditRekening } from "@/app_modules/donasi";
+import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  let donasiId = params.id;
+  const data = await Donasi_getOneById(donasiId);
+  const dataDonasi = {
+    id: data?.id,
+    namaBank: data?.namaBank,
+    rekening: data?.rekening,
+  };
+  return (
+    <>
+      <Donasi_EditRekening dataDonasi={dataDonasi as any} />
+    </>
+  );
+}

src/app/dev/donasi/main/layout.tsx

@@ -1,8 +1,23 @@
 import { LayoutDonasi } from "@/app_modules/donasi";
+import { Donasi_getNotifByUserId } from "@/app_modules/donasi/fun/get/get_notif_by_user_id";
+import { getToken_UserId } from "@/app_modules/fun/get_user_token";
 import React from "react";
 
-export default async function Layout({children}: {children: React.ReactNode}) {
-    return <>
-    <LayoutDonasi>{children}</LayoutDonasi>
+export default async function Layout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  const userId = await getToken_UserId();
+  // const dataDonasi = await DOnasi_getList
+  const isRead = await Donasi_getNotifByUserId(userId).then((res) => res.map((val) => val.isRead))
+  // console.log(isRead)
+
+  return (
+    <>
+      <LayoutDonasi userId={userId} isRead={isRead as any}>
+        {children}
+      </LayoutDonasi>
     </>
-}
+  );
+}

src/app/dev/donasi/notif_page/[id]/page.tsx

@@ -1,9 +1,14 @@
 import { Donasi_NotifPage } from "@/app_modules/donasi";
+import { Donasi_getNotifByUserId } from "@/app_modules/donasi/fun/get/get_notif_by_user_id";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  let userId = params.id;
+  const dataNotif = await Donasi_getNotifByUserId(userId);
+// console.log(dataNotif)
 
-export default async function Page() {
   return (
     <>
-      <Donasi_NotifPage />
+      <Donasi_NotifPage dataNotif={dataNotif as any} />
     </>
   );
 }

src/app/dev/donasi/pencairan_dana/[id]/page.tsx

@@ -0,0 +1,25 @@
+import { PencairanDanaDonasi } from "@/app_modules/donasi";
+import ComponentDonasi_LoaderOverlay from "@/app_modules/donasi/component/loader_overlay";
+import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
+import { Donasi_getListPencairanDanaById } from "@/app_modules/donasi/fun/get/get_list_pencairan_dana_by_id";
+import { Donasi_getTotalPencairanDanaById } from "@/app_modules/donasi/fun/get/get_pencairan_dana_by_id";
+import { getToken_UserId } from "@/app_modules/fun/get_user_token";
+import { Loader } from "@mantine/core";
+
+export default async function Page({ params }: { params: { id: string } }) {
+  let donasiId = params.id;
+  const totalAkumulasi = await Donasi_getTotalPencairanDanaById(donasiId);
+  const listPencairan = await Donasi_getListPencairanDanaById(donasiId);
+  
+
+  // if (authorId != totalAkumulasi?.authorId) return <><NotifPeringatan /></>
+  
+  return (
+    <>
+      <PencairanDanaDonasi
+        totalAkumulasi={totalAkumulasi as any}
+        listPencairan={listPencairan as any}
+      />
+    </>
+  );
+}

src/app/dev/donasi/pencairan_dana/page.tsx

@@ -1,9 +0,0 @@
-import { PencairanDanaDonasi } from "@/app_modules/donasi";
-
-export default async function Page() {
-  return (
-    <>
-      <PencairanDanaDonasi />
-    </>
-  );
-}

src/app/lib/router_hipmi/router_admin.ts

@@ -15,6 +15,10 @@ export const RouterAdminInvestasi = {
 };
 
 export const RouterAdminDonasi = {
+
+  api_gambar_bukti_transfer: "/api/donasi/gambar_bukti_transfer/",
+
+
   main_donasi: "/dev/admin/donasi/main",
   // table
   table_publish: "/dev/admin/donasi/table/publish",
@@ -28,7 +32,10 @@ export const RouterAdminDonasi = {
   detail_reject: "/dev/admin/donasi/detail/reject/",
 
   // proses
-  proses_transaksi: "/dev/admin/donasi/proses_transaksi/"
+  proses_transaksi: "/dev/admin/donasi/proses_transaksi/",
+  pencairan_dana :"/dev/admin/donasi/pencairan_dana/",
+
+
 
 
 

src/app/lib/router_hipmi/router_donasi.ts

@@ -5,7 +5,7 @@ export const RouterDonasi = {
   api_image: "/api/donasi/image/",
   api_image_cerita: "/api/donasi/image_cerita/",
   api_gambar_kabar: "/api/donasi/gambar_kabar/",
-
+  api_gambar_pencairan: "/api/donasi/gambar_pencairan/",
 
   //main
   main_beranda: "/dev/donasi/main/beranda",
@@ -13,7 +13,7 @@ export const RouterDonasi = {
   main_donasi_saya: "/dev/donasi/main/donasi_saya",
 
   // create
-  create_donasi: "/dev/donasi/create_donasi",
+  create_donasi: "/dev/donasi/create/create_donasi",
   create_cerita_penggalang: "/dev/donasi/create/cerita_penggalang/",
   create_kabar: "/dev/donasi/create/create_kabar/",
 
@@ -21,34 +21,33 @@ export const RouterDonasi = {
   update_kabar: "/dev/donasi/edit/update_kabar/",
   edit_donasi: "/dev/donasi/edit/edit_donasi/",
   edit_cerita_penggalang: "/dev/donasi/edit/edit_cerita/",
+  edit_rekening: "/dev/donasi/edit/edit_rekening/",
 
   //pop up
   page_pop_up_create: "/dev/donasi/page_pop_up/create",
 
   //detail
   detail_main: "/dev/donasi/detail/detail_main/",
-  detail_kabar: "/dev/donasi/detail/detail_kabar",
+  detail_kabar: "/dev/donasi/detail/detail_kabar/",
   detail_publish: "/dev/donasi/detail/detail_publish/",
   detail_review: "/dev/donasi/detail/detail_review/",
   detail_draft: "/dev/donasi/detail/detail_draft/",
   detail_reject: "/dev/donasi/detail/detail_reject/",
   detail_donasi_saya: "/dev/donasi/detail/detail_donasi_saya/",
+  detail_notif: "/dev/donasi/detail/detail_notif/",
 
   //alur donasi
   donatur: "/dev/donasi/donatur/",
   kabar: "/dev/donasi/kabar/",
-  pencairan_dana: "/dev/donasi/pencairan_dana",
+  pencairan_dana: "/dev/donasi/pencairan_dana/",
   penggalang_dana: "/dev/donasi/penggalang_dana/",
   cerita_penggalang: "/dev/donasi/cerita_penggalang/",
   list_kabar: "/dev/donasi/list_kabar/",
-  notif_page:"/dev/donasi/notif_page/",
-  
+  notif_page: "/dev/donasi/notif_page/",
+
   // proses donasi
   masukan_donasi: "/dev/donasi/proses_donasi/masukan_donasi/",
   metode_pembayaran: "/dev/donasi/proses_donasi/metode_pembayaran/",
   invoice: "/dev/donasi/proses_donasi/invoice/",
   proses_transaksi: "/dev/donasi/proses_donasi/proses_transaksi/",
-
-
-
 };

src/app_modules/admin/donasi/component/tombol_kembali.tsx

@@ -4,7 +4,7 @@ import { Group, Button } from "@mantine/core";
 import { IconChevronLeft } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 
-export default function AdminDonasi_TombolKembali() {
+export default function ComponentAdminDonasi_TombolKembali() {
   const router = useRouter();
   return (
     <>

src/app_modules/admin/donasi/detail_table/detail_reject.tsx

@@ -7,16 +7,23 @@ import {
   Divider,
   Group,
   Image,
+  Modal,
   Paper,
   SimpleGrid,
   Stack,
   Text,
+  Textarea,
   Title,
 } from "@mantine/core";
 import { useState } from "react";
-import AdminDonasi_TombolKembali from "../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
+import { useDisclosure } from "@mantine/hooks";
+import { AdminDonasi_funUpdateCatatanReject } from "../fun/update/fun_update_catatan_reject";
+import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
+import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
+import { AdminDonasi_getOneById } from "../fun/get/get_one_by_id";
 
 export default function AdminDonasi_DetailReject({
   dataReject,
@@ -28,7 +35,11 @@ export default function AdminDonasi_DetailReject({
   return (
     <>
       <Stack>
-        <ButtonOnHeader />
+        <ButtonOnHeader
+          catatan={donasi.catatan}
+          donasiId={donasi.id}
+          setDonasi={setDonasi}
+        />
         <SimpleGrid
           cols={2}
           spacing="lg"
@@ -46,18 +57,61 @@ export default function AdminDonasi_DetailReject({
   );
 }
 
-function ButtonOnHeader() {
+function ButtonOnHeader({
+  catatan,
+  donasiId,
+  setDonasi,
+}: {
+  catatan: string;
+  donasiId: string;
+  setDonasi: any;
+}) {
+  const [catat, setCatat] = useState(catatan);
+  const [opened, { open, close }] = useDisclosure(false);
+
+  async function onUpdate() {
+    await AdminDonasi_funUpdateCatatanReject(donasiId, catat).then(
+      async (res) => {
+        if (res.status === 200) {
+          NotifBerhasil(res.message);
+          close();
+          await AdminDonasi_getOneById(donasiId).then((res) => setDonasi(res));
+        } else {
+          NotifGagal(res.message);
+        }
+      }
+    );
+  }
+
   return (
     <>
       <Stack>
         <Group position="apart">
-          <AdminDonasi_TombolKembali />
-          <Button radius={"xl"} bg={"orange"} color="orange">
+          <ComponentAdminDonasi_TombolKembali />
+          <Button radius={"xl"} bg={"orange"} color="orange" onClick={open}>
             Tambah catatan
           </Button>
         </Group>
         <Divider />
       </Stack>
+      <Modal
+        opened={opened}
+        onClose={close}
+        centered
+        title="Tambah catatan penolakan"
+      >
+        <Stack>
+          <Textarea
+            value={catat}
+            onChange={(val) => setCatat(val.target.value)}
+          />
+          <Group position="right">
+            <Button radius="xl" onClick={() => onUpdate()}>
+              Simpan
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
     </>
   );
 }

src/app_modules/admin/donasi/detail_table/detail_review.tsx

@@ -16,7 +16,7 @@ import {
   Textarea,
   Title,
 } from "@mantine/core";
-import AdminDonasi_TombolKembali from "../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
 import {
@@ -95,7 +95,7 @@ function ButtonOnHeader({ donasi }: { donasi: MODEL_DONASI }) {
   return (
     <>
       <Group position="apart">
-        <AdminDonasi_TombolKembali />
+        <ComponentAdminDonasi_TombolKembali />
         <Group>
           <Button
             radius={"xl"}

src/app_modules/admin/donasi/detail_table/publish/detail_publish.tsx

@@ -10,17 +10,20 @@ import {
   Grid,
   Group,
   Image,
+  Modal,
   Pagination,
   Paper,
   Progress,
   ScrollArea,
   SimpleGrid,
+  Spoiler,
   Stack,
   Table,
   Text,
+  TextInput,
   Title,
 } from "@mantine/core";
-import AdminDonasi_TombolKembali from "../../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../../component/tombol_kembali";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import {
   IconClover,
@@ -32,44 +35,50 @@ import moment from "moment";
 import {
   MODEL_DONASI,
   MODEL_DONASI_INVOICE,
+  MODEL_DONASI_PENCAIRAN_DANA,
 } from "@/app_modules/donasi/model/interface";
 import { useState } from "react";
 import { RouterAdminDonasi } from "@/app/lib/router_hipmi/router_admin";
 import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
 import _ from "lodash";
 import { useRouter } from "next/navigation";
-import { useInterval, useShallowEffect } from "@mantine/hooks";
+import { useDisclosure, useInterval, useShallowEffect } from "@mantine/hooks";
 import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id";
+import { AdminDonasi_getOneById } from "../../fun/get/get_one_by_id";
 
 export default function AdminDonasi_DetailPublish({
   dataPublish,
   listDonatur,
   countDonatur,
+  listPencairan,
 }: {
   dataPublish: MODEL_DONASI;
   listDonatur: any[];
   countDonatur: number;
+  listPencairan: MODEL_DONASI_PENCAIRAN_DANA[];
 }) {
   const [donasi, setDonasi] = useState(dataPublish);
   const [donatur, setDoanutur] = useState(listDonatur);
   const interval = useInterval(() => reloadData(donasi.id), 5000);
+  const [pencairan, setPencairan] = useState(listPencairan);
 
   useShallowEffect(() => {
     interval.start();
   }, []);
 
   async function reloadData(donasiId: string) {
-    const data = await Donasi_getOneById(donasiId);
-   setDonasi(data as any)
+    const data = await AdminDonasi_getOneById(donasiId);
+    setDonasi(data as any);
     return data;
   }
   return (
     <>
-      {/* <pre>{JSON.stringify(donatur.map((e) => e), null, 2)}</pre> */}
+      {/* <pre>{JSON.stringify(pencairan, null, 2)}</pre> */}
       <Stack>
-        <AdminDonasi_TombolKembali />
+        <ComponentAdminDonasi_TombolKembali />
         <TampilanDetailDonasi donasi={donasi} countDonatur={countDonatur} />
         <TampilanListDonatur donatur={donatur} donasi={donasi} />
+        <TampilanListPencairan pencairan={pencairan} />
       </Stack>
     </>
   );
@@ -82,14 +91,16 @@ function TampilanDetailDonasi({
   donasi: MODEL_DONASI;
   countDonatur: number;
 }) {
+  const [opened, { open, close }] = useDisclosure(false);
+  const router = useRouter();
   return (
     <>
       <Paper radius={"md"} p={"md"}>
         <Stack>
           <Grid>
-            <Grid.Col span={6}>
+            <Grid.Col md={6} lg={4}>
               <AspectRatio ratio={16 / 9}>
-                <Paper radius={"md"}>
+                <Paper radius={"md"} h={{ lg: 200, md: 200, sm: 200 }}>
                   <Image
                     alt="Foto"
                     src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
@@ -97,52 +108,134 @@ function TampilanDetailDonasi({
                 </Paper>
               </AspectRatio>
             </Grid.Col>
-            <Grid.Col span={6}>
-              <Stack spacing={7}>
-                <Title order={4}>{donasi.title}</Title>
-                <Text fz={"xs"}>
-                  Durasi: {donasi.DonasiMaster_Durasi.name} hari
-                </Text>
+            <Grid.Col md={6} lg={4}>
+              <Paper withBorder p={"sm"} mah={250} h={250}>
+                <Stack spacing={5}>
+                  <Title order={4}>{donasi.title}</Title>
+                  <Group>
+                    <Text fz={"xs"}>Penggalang Dana</Text>
+                    <Title order={5} c="blue">
+                      {donasi.Author.username}
+                    </Title>
+                  </Group>
+                  <Group>
+                    <Text fz={12}>Durasi</Text>
+                    <Title order={5} c="blue">
+                      {donasi.DonasiMaster_Durasi.name} hari
+                    </Title>
+                  </Group>
 
-                <Group>
-                  <Text fz={12}>Dana dibutuhkan</Text>
-                  <Title order={5} c="blue">
-                    <TampilanRupiahDonasi nominal={+donasi.target} />
-                  </Title>
-                </Group>
-                <Group>
-                  <Text fz={12}>Kategori</Text>
-                  <Title order={5} c="blue">
-                    {donasi.DonasiMaster_Ketegori.name}
-                  </Title>
-                </Group>
-                <Group>
-                  <Text fz={12}>Total donatur</Text>
-                  <Title order={5} c="blue">
-                    {countDonatur}
-                  </Title>
-                </Group>
-                <Group>
-                  <Text fz={12}>Progres</Text>
-                  <Title order={5} c="blue">
-                    {donasi.progres} %
-                  </Title>
-                </Group>
-                <Group>
-                  <Text fz={12}>Dana terkumpul</Text>
-                  <Title order={5} c="blue">
-                    <TampilanRupiahDonasi nominal={+donasi.terkumpul} />
-                  </Title>
-                </Group>
-              </Stack>
+                  <Group>
+                    <Text fz={12}>Dana dibutuhkan</Text>
+                    <Title order={5} c="blue">
+                      <TampilanRupiahDonasi nominal={+donasi.target} />
+                    </Title>
+                  </Group>
+                  <Group>
+                    <Text fz={12}>Kategori</Text>
+                    <Title order={5} c="blue">
+                      {donasi.DonasiMaster_Ketegori.name}
+                    </Title>
+                  </Group>
+                  <Group>
+                    <Text fz={12}>Total donatur</Text>
+                    <Title order={5} c="blue">
+                      {countDonatur}
+                    </Title>
+                  </Group>
+                  <Group>
+                    <Text fz={12}>Progres</Text>
+                    <Title order={5} c="blue">
+                      {donasi.progres} %
+                    </Title>
+                  </Group>
+                  <Group>
+                    <Text fz={12}>Dana terkumpul</Text>
+                    <Title order={5} c="blue">
+                      <TampilanRupiahDonasi nominal={+donasi.terkumpul} />
+                    </Title>
+                  </Group>
+                  {/* <Button w={200} bg={"green.5"} color="green">Pencairan Dana</Button> */}
+                </Stack>
+              </Paper>
+            </Grid.Col>
+
+            <Grid.Col md={6} lg={4}>
+              <Paper withBorder p={"sm"} mah={250} h={250}>
+                <Stack spacing={"xl"}>
+                  <Center>
+                    <Title order={4}>Pencairan Dana</Title>
+                  </Center>
+                  <Grid>
+                    <Grid.Col span={"auto"}>
+                      <Stack spacing={0}>
+                        <Text fz={"xs"}>Total Dana Dicairkan</Text>
+                        <Title>
+                          <TampilanRupiahDonasi
+                            nominal={donasi.totalPencairan}
+                            fontSize={14}
+                          />
+                        </Title>
+                      </Stack>
+                    </Grid.Col>
+                    <Grid.Col span={"auto"}>
+                      <Stack spacing={0}>
+                        <Text fz={"xs"}>Bank Tujuan</Text>
+                        <Title order={6}>{donasi.namaBank}</Title>
+                      </Stack>
+                    </Grid.Col>
+                  </Grid>
+                  <Grid>
+                    <Grid.Col span={"auto"}>
+                      <Stack spacing={0}>
+                        <Text fz={"xs"}>Akumulasi Pencairan</Text>
+                        <Title order={6}>
+                          {donasi.akumulasiPencairan} Kali
+                        </Title>
+                      </Stack>
+                    </Grid.Col>
+                    <Grid.Col span={"auto"}>
+                      <Stack spacing={0}>
+                        <Text fz={"xs"}>Nomor Rekening</Text>
+                        <Title order={6}>{donasi.rekening}</Title>
+                      </Stack>
+                    </Grid.Col>
+                  </Grid>
+
+                  <Button
+                    radius={"xl"}
+                    onClick={() =>
+                      router.push(
+                        RouterAdminDonasi.pencairan_dana + `${donasi.id}`
+                      )
+                    }
+                  >
+                    Cairkan Dana
+                  </Button>
+                </Stack>
+              </Paper>
             </Grid.Col>
           </Grid>
         </Stack>
       </Paper>
+      <Modal opened={opened} onClose={close} centered>
+        <PencairanDana />
+      </Modal>
     </>
   );
 }
 
+function PencairanDana() {
+  return (
+    <>
+      <Stack>
+        <TextInput label="Masukan nominal" />
+      </Stack>
+    </>
+  );
+}
+
+//######################## LIST DONATUR #####################//
 function TampilanListDonatur({
   donatur,
   donasi,
@@ -220,3 +313,94 @@ function TampilanListDonatur({
     </>
   );
 }
+
+//######################## LIST PENCAIRAN #####################//
+function TampilanListPencairan({
+  pencairan,
+}: {
+  pencairan: MODEL_DONASI_PENCAIRAN_DANA[];
+}) {
+  const [opened, { open, close }] = useDisclosure(false);
+  const [gambarId, setGambarId] = useState("");
+
+  const rowTable = pencairan.map((e) => (
+    <tr key={e.id}>
+      <td>
+        <TampilanRupiahDonasi nominal={e.nominalCair} />
+      </td>
+      <td>{moment(e.createdAt).format("ll")}</td>
+      <td>
+        <Text>{e.title}</Text>
+      </td>
+      <td width={500}>
+        <Box w={"100%"}>
+          <Spoiler hideLabel="Sembunyikan" maxHeight={70} showLabel="Lihat">
+            {e.deskripsi}
+          </Spoiler>
+        </Box>
+      </td>
+      <td>
+        {
+          <Box>
+            <Center>
+              <Button
+                radius={"xl"}
+                compact
+                bg={"green"}
+                color="green"
+                onClick={() => {
+                  open();
+                  setGambarId(e.imagesId);
+                }}
+              >
+                Detail
+              </Button>
+            </Center>
+          </Box>
+        }
+      </td>
+    </tr>
+  ));
+
+  return (
+    <>
+      <Modal opened={opened} onClose={close} centered>
+        <AspectRatio ratio={9 / 16}>
+          <Image
+            src={RouterDonasi.api_gambar_pencairan + `${gambarId}`}
+            alt="Foto"
+          />
+        </AspectRatio>
+      </Modal>
+
+      <Stack p={"md"}>
+        <Title order={3}>Rincian Pencairan Dana</Title>
+        {/* <pre>{JSON.stringify(pencairan, null, 2)}</pre> */}
+        {_.isEmpty(pencairan) ? (
+          <Paper bg={"gray.1"} p={"xs"}>
+            <Center>BELUM ADA PENCAIRAN DANA</Center>
+          </Paper>
+        ) : (
+          <Paper withBorder p={"xs"}>
+            <Table horizontalSpacing={"md"} verticalSpacing={"md"}>
+              <thead>
+                <tr>
+                  <th>Nominal</th>
+                  <th>Tanggal</th>
+                  <th>Judul</th>
+                  <th>
+                    <Center>Deskripsi</Center>
+                  </th>
+                  <th>
+                    <Center>Bukti Transfer</Center>
+                  </th>
+                </tr>
+              </thead>
+              <tbody>{rowTable}</tbody>
+            </Table>
+          </Paper>
+        )}
+      </Stack>
+    </>
+  );
+}

src/app_modules/admin/donasi/detail_table/publish/pencairan_dana.tsx

@@ -0,0 +1,196 @@
+"use client";
+
+import {
+  AspectRatio,
+  Button,
+  Center,
+  FileButton,
+  Image,
+  NumberInput,
+  Paper,
+  Stack,
+  TextInput,
+  Textarea,
+  Title,
+} from "@mantine/core";
+import ComponentAdminDonasi_TombolKembali from "../../component/tombol_kembali";
+import { useState } from "react";
+import { IconCamera } from "@tabler/icons-react";
+import ComponentDonasi_NotedBox from "@/app_modules/donasi/component/noted_box";
+import { useRouter } from "next/navigation";
+import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
+import { MODEL_DONASI_PENCAIRAN_DANA } from "@/app_modules/donasi/model/interface";
+import _ from "lodash";
+import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
+import { AdminDonasi_funCreatePencairanDana } from "../../fun/create/fun_create_pencairan_dana";
+import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
+import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
+import { AdminDonasi_AkumulasiPencairanById } from "../../fun/update/fun_update_akumulasi_pencairan";
+
+export default function AdminDonasi_PencairanDana({
+  donasiId,
+}: {
+  donasiId: string;
+}) {
+  const router = useRouter();
+  const [file, setFile] = useState<File | null>(null);
+  const [images, setImages] = useState<any | null>();
+  const [value, setValue] = useState({
+    title: "",
+    deskripsi: "",
+    nilai: "",
+  });
+  return (
+    <>
+      <Stack>
+        <ComponentAdminDonasi_TombolKembali />
+        <Center>
+          <Paper
+            p={"md"}
+            w={{ base: 200, sm: 200, md: 300, lg: 400 }}
+            withBorder
+          >
+            <Center mb={"lg"}>
+              <Title order={5}>Form Pencairan Dana</Title>
+            </Center>
+            <Stack>
+              <TextInput
+                withAsterisk
+                type="number"
+                placeholder="Masukan jumlah nominal"
+                label="Nominal"
+                onChange={(val) => {
+                  setValue({
+                    ...value,
+                    nilai: val.target.value,
+                  });
+                }}
+              />
+              <TextInput
+                withAsterisk
+                placeholder="Masukan judul"
+                label="Judul"
+                onChange={(val: any) => {
+                  setValue({
+                    ...value,
+                    title: val.target.value,
+                  });
+                }}
+              />
+              <Textarea
+                withAsterisk
+                placeholder="Masukan deskripsi"
+                label="Deskripsi"
+                onChange={(val: any) => {
+                  setValue({
+                    ...value,
+                    deskripsi: val.target.value,
+                  });
+                }}
+              />
+
+              <ComponentDonasi_NotedBox informasi="Wajib menyertakan bukti transfer" />
+              <Stack>
+                <Center>
+                  <FileButton
+                    onChange={async (files: any | null) => {
+                      try {
+                        const buffer = URL.createObjectURL(
+                          new Blob([new Uint8Array(await files.arrayBuffer())])
+                        );
+                        // console.log(buffer, "ini buffer");
+                        // console.log(files, " ini file");
+                        setImages(buffer);
+                        setFile(files);
+                      } catch (error) {
+                        console.log(error);
+                      }
+                    }}
+                    accept="image/png,image/jpeg"
+                  >
+                    {(props) => (
+                      <Button
+                        {...props}
+                        radius={"xl"}
+                        variant="outline"
+                        w={150}
+                        leftIcon={<IconCamera />}
+                        compact
+                      >
+                        Upload
+                      </Button>
+                    )}
+                  </FileButton>
+                </Center>
+                {images ? (
+                  <AspectRatio ratio={9 / 16}>
+                    <Paper radius={"md"} withBorder>
+                      <Image
+                        alt="Foto"
+                        src={images}
+                      />
+                    </Paper>
+                  </AspectRatio>
+                ) : (
+                  ""
+                )}
+              </Stack>
+              <Button
+                radius={"xl"}
+                mt={"lg"}
+                onClick={
+                  () => onSave(router, value, donasiId, file as any)
+                  // console.log(value)
+                }
+              >
+                Simpan
+              </Button>
+            </Stack>
+          </Paper>
+        </Center>
+      </Stack>
+    </>
+  );
+}
+
+async function onSave(
+  router: AppRouterInstance,
+  value: any,
+  donasiId: string,
+  file: FormData
+) {
+  const body = {
+    donasiId: donasiId,
+    nominalCair: value.nilai,
+    title: value.title,
+    deskripsi: value.deskripsi,
+  };
+
+  //   console.log(body);
+
+  if (_.values(body).includes("")) return NotifPeringatan("Lengkapi Data");
+  if (!file) return NotifPeringatan("Lampirkan Bukti Transfer");
+
+  const gambar = new FormData();
+  gambar.append("file", file as any);
+
+  await AdminDonasi_funCreatePencairanDana(body as any, gambar).then(
+    async (res) => {
+      if (res.status === 200) {
+        await AdminDonasi_AkumulasiPencairanById(
+          body.donasiId as any,
+          body.nominalCair as any
+        ).then((res) => {
+          if (res.status === 200) {
+            NotifBerhasil(res.message);
+            router.back();
+          } else {
+            NotifGagal(res.message);
+          }
+        });
+      } else {
+        NotifGagal(res.message);
+      }
+    }
+  );
+}

src/app_modules/admin/donasi/detail_table/publish/proses_transaksi.tsx

@@ -2,18 +2,21 @@
 
 import {
   ActionIcon,
+  AspectRatio,
   Box,
   Button,
   Center,
   Group,
   HoverCard,
+  Image,
+  Modal,
   Paper,
   Stack,
   Table,
   Text,
   Title,
 } from "@mantine/core";
-import AdminDonasi_TombolKembali from "../../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../../component/tombol_kembali";
 import { MODEL_DONASI_INVOICE } from "@/app_modules/donasi/model/interface";
 import { useState } from "react";
 import moment from "moment";
@@ -24,15 +27,17 @@ import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_b
 import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
 import { AdminDonasi_getListStatusInvoiceProses } from "../../fun/get/get_list_status_invoice_proses";
 import { AdminDonasi_funUpdateProgresDanTerkumpul } from "../../fun/update/fun_update_progres_dan_terkumpul";
+import { useDisclosure } from "@mantine/hooks";
+import { RouterAdminDonasi } from "@/app/lib/router_hipmi/router_admin";
 
 export default function AdminDonasi_ProsesTransaksi({
   listProses,
 }: {
   listProses: MODEL_DONASI_INVOICE[];
 }) {
-  const [invoice, setInvoice] = useState<MODEL_DONASI_INVOICE[] | any[]>(
-    listProses
-  );
+  const [invoice, setInvoice] = useState<MODEL_DONASI_INVOICE[]>(listProses);
+  const [opened, { open, close }] = useDisclosure(false);
+  const [imageId, setImageId] = useState("");
 
   async function onClick(invoice: MODEL_DONASI_INVOICE) {
     let nominal: number = +invoice.nominal;
@@ -50,7 +55,7 @@ export default function AdminDonasi_ProsesTransaksi({
             if (res.status === 200) {
               await AdminDonasi_getListStatusInvoiceProses(
                 invoice.Donasi.id
-              ).then((res) => {
+              ).then((res: any) => {
                 setInvoice(res);
               });
             } else {
@@ -79,6 +84,20 @@ export default function AdminDonasi_ProsesTransaksi({
           <Button
             radius={"xl"}
             variant="outline"
+            onClick={() => {
+              open();
+              setImageId(e.imagesId);
+            }}
+          >
+            Lihat
+          </Button>
+        </Center>
+      </td>
+      <td>
+        <Center>
+          <Button
+            radius={"xl"}
+            variant="filled"
             color="green"
             onClick={() => onClick(e)}
           >
@@ -91,9 +110,12 @@ export default function AdminDonasi_ProsesTransaksi({
 
   return (
     <>
+      <Modal opened={opened} onClose={close} centered>
+        <ModalBuktiTransfer imageId={imageId} />
+      </Modal>
       {/* <pre>{JSON.stringify(invoice, null, 2)}</pre>  */}
       <Stack>
-        <AdminDonasi_TombolKembali />
+        <ComponentAdminDonasi_TombolKembali />
         <Stack>
           <HeaderPage />
 
@@ -107,6 +129,9 @@ export default function AdminDonasi_ProsesTransaksi({
                     <Center>Metode Pembayaran</Center>
                   </th>
                   <th>Tanggal</th>
+                  <th>
+                    <Center>Bukti Transfer</Center>
+                  </th>
                   <th>
                     <Center>Aksi</Center>
                   </th>
@@ -151,3 +176,16 @@ function HeaderPage() {
     </>
   );
 }
+
+function ModalBuktiTransfer({ imageId }: { imageId: string }) {
+  return (
+    <>
+      <AspectRatio ratio={9 / 16}>
+        <Image
+          alt="Foto"
+          src={RouterAdminDonasi.api_gambar_bukti_transfer + `${imageId}`}
+        />
+      </AspectRatio>
+    </>
+  );
+}

src/app_modules/admin/donasi/fun/create/fun_create_pencairan_dana.tsx

@@ -0,0 +1,52 @@
+"use server";
+
+import prisma from "@/app/lib/prisma";
+import { MODEL_DONASI_PENCAIRAN_DANA } from "@/app_modules/donasi/model/interface";
+import _ from "lodash";
+import { v4 } from "uuid";
+import fs from "fs";
+import { revalidatePath } from "next/cache";
+
+export async function AdminDonasi_funCreatePencairanDana(
+  req: MODEL_DONASI_PENCAIRAN_DANA,
+  gambar: FormData
+) {
+  const dataImage: any = gambar.get("file");
+  const fileName = dataImage.name;
+  const fileExtension = _.lowerCase(dataImage.name.split(".").pop());
+  const fRandomName = v4(fileName) + "." + fileExtension;
+
+  const uploadBukti = await prisma.images.create({
+    data: {
+      url: fRandomName,
+    },
+    select: {
+      id: true,
+      url: true,
+    },
+  });
+
+  if (!uploadBukti) return { status: 400, message: "Gagal upload gambar" };
+  const uploadFolder = Buffer.from(await dataImage.arrayBuffer());
+  fs.writeFileSync(
+    `./public/donasi/pencairan/${uploadBukti.url}`,
+    uploadFolder
+  );
+
+  const createPencairan = await prisma.donasi_PencairanDana.create({
+    data: {
+      nominalCair: +req.nominalCair,
+      deskripsi: req.deskripsi,
+      title: req.title,
+      donasiId: req.donasiId,
+      imagesId: uploadBukti.id
+    },
+  });
+
+  if (!createPencairan) return { status: 400, message: "Gagal membuat data" };
+  revalidatePath("/dev/admin/donasi/detail/publish");
+  return {
+    status: 200,
+    message: "Berhasil",
+  };
+}

src/app_modules/admin/donasi/fun/get/get_list_donasi_by_status.ts

@@ -4,7 +4,10 @@ import prisma from "@/app/lib/prisma";
 
 export async function AdminDonasi_getByStatus(status: string) {
   if (status === "1") {
-    const getReview = await prisma.donasi.findMany({
+    const getPublish = await prisma.donasi.findMany({
+      orderBy: {
+        createdAt: "desc",
+      },
       where: {
         donasiMaster_StatusDonasiId: "1",
       },
@@ -12,24 +15,25 @@ export async function AdminDonasi_getByStatus(status: string) {
         id: true,
         title: true,
         target: true,
-        active: true,
-        createdAt: true,
-        updatedAt: true,
-        publishTime: true,
+        // active: true,
+        // createdAt: true,
+        // updatedAt: true,
+        // publishTime: true,
         authorId: true,
-        imagesId: true,
-        donasiMaster_KategoriId: true,
-        donasiMaster_DurasiId: true,
-        donasiMaster_StatusDonasiId: true,
-        Author: true,
+        // imagesId: true,
+        terkumpul: true,
+        // donasiMaster_KategoriId: true,
+        // donasiMaster_DurasiId: true,
+        // donasiMaster_StatusDonasiId: true,
+        // Author: true,
         imageDonasi: true,
-        CeritaDonasi: true,
+        // CeritaDonasi: true,
         DonasiMaster_Ketegori: true,
         DonasiMaster_Durasi: true,
-        DonasiMaster_Status: true,
+        // DonasiMaster_Status: true,
       },
     });
-    return getReview;
+    return getPublish;
   }
 
   if (status === "2") {

src/app_modules/admin/donasi/fun/get/get_list_pencairan_dana_by_id.ts

@@ -0,0 +1,13 @@
+"use server"
+
+import prisma from "@/app/lib/prisma"
+
+export async function AdminDonasi_getListPencairanDana(donasiId:string) {
+    const data = await prisma.donasi_PencairanDana.findMany({
+        where: {
+            donasiId: donasiId
+        }
+    })
+
+    return data
+}

src/app_modules/admin/donasi/fun/get/get_list_status_invoice_proses.ts

@@ -15,6 +15,7 @@ export async function AdminDonasi_getListStatusInvoiceProses(donasiId: string) {
       nominal: true,
       createdAt: true,
       Author: true,
+      imagesId: true,
       Donasi: {
         select: {
             id: true,
@@ -26,8 +27,6 @@ export async function AdminDonasi_getListStatusInvoiceProses(donasiId: string) {
             publishTime: true,
             catatan: true,
             terkumpul: true,
-            authorId: true,
-            imagesId: true,
             donasiMaster_KategoriId: true,
             donasiMaster_DurasiId: true,
             donasiMaster_StatusDonasiId: true,

src/app_modules/admin/donasi/fun/get/get_one_by_id.ts

@@ -2,7 +2,7 @@
 
 import prisma from "@/app/lib/prisma";
 
-export async function AdminDonasi_getById(id: string) {
+export async function AdminDonasi_getOneById(id: string) {
   const res = await prisma.donasi.findFirst({
     where: {
       id: id,
@@ -19,6 +19,10 @@ export async function AdminDonasi_getById(id: string) {
       progres: true,
       terkumpul: true,
       authorId: true,
+      namaBank: true,
+      rekening: true,
+      totalPencairan: true,
+      akumulasiPencairan: true,
       imagesId: true,
       donasiMaster_KategoriId: true,
       donasiMaster_DurasiId: true,
@@ -31,5 +35,6 @@ export async function AdminDonasi_getById(id: string) {
       DonasiMaster_Status: true,
     },
   });
+  // console.log(res)
   return res;
 }

src/app_modules/admin/donasi/fun/update/fun_update_akumulasi_pencairan.ts

@@ -0,0 +1,47 @@
+"use server";
+
+import prisma from "@/app/lib/prisma";
+import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
+
+export async function AdminDonasi_AkumulasiPencairanById(
+  donasiId: string,
+  nominalPencairan: number
+) {
+  const cariDonasi = await prisma.donasi.findFirst({
+    where: {
+      id: donasiId,
+    },
+    select: {
+      akumulasiPencairan: true,
+      totalPencairan: true,
+    },
+  });
+
+  if (!cariDonasi) return { status: 400, message: "Donasi tidak ditemukan" };
+
+  let akumulasiSementara: number | any = cariDonasi.akumulasiPencairan;
+  let totalSementara: number | any = cariDonasi.totalPencairan;
+
+//   console.log(akumulasiSementara, "akumulasi");
+//   console.log(totalSementara, "total");
+
+  const hasilTotal = totalSementara + Number(nominalPencairan)
+  const hasilAkumulasi = akumulasiSementara + 1;
+
+  const update = await prisma.donasi.update({
+    where: {
+      id: donasiId,
+    },
+    data: {
+      akumulasiPencairan: hasilAkumulasi,
+      totalPencairan: hasilTotal,
+    },
+  });
+
+  if (!update) return { status: 400, message: "Update akumulasi gagal" };
+
+  return {
+    status: 200,
+    message: "Berhasil di simpan",
+  };
+}

src/app_modules/admin/donasi/fun/update/fun_update_catatan_reject.ts

@@ -0,0 +1,20 @@
+"use server"
+
+import prisma from "@/app/lib/prisma"
+
+export async function AdminDonasi_funUpdateCatatanReject(doansiId: string, catatan: string) {
+    const updt = await prisma.donasi.update({
+        where: {
+            id: doansiId
+        },
+        data: {
+            catatan: catatan
+        }
+    })
+
+    if(!updt) return {status: 400, message: "Gagal update"}
+    return {
+        status: 200,
+        message: "Berhasil update"
+    }
+}

src/app_modules/admin/donasi/global_state/index.ts

@@ -0,0 +1,3 @@
+import { atomWithStorage } from "jotai/utils";
+
+export const gs_adminDonasi_hotMenu = atomWithStorage("gs_adminDonasi_hotMenu", 0)

src/app_modules/admin/donasi/index.tsx

@@ -6,6 +6,7 @@ import AdminDonasi_DetailReview from "./detail_table/detail_review";
 import AdminDonasi_TableReject from "./table_status/table_reject";
 import AdminDonasi_DetailReject from "./detail_table/detail_reject";
 import AdminDonasi_ProsesTransaksi from "./detail_table/publish/proses_transaksi";
+import AdminDonasi_PencairanDana from "./detail_table/publish/pencairan_dana";
 
 export {
   AdminDonasi_Main,
@@ -15,4 +16,6 @@ export {
   AdminDonasi_TableReject,
   AdminDonasi_DetailReview,
   AdminDonasi_DetailReject,
+  AdminDonasi_ProsesTransaksi,
+  AdminDonasi_PencairanDana,
 };

src/app_modules/admin/donasi/table_status/table_publish.tsx

@@ -14,7 +14,7 @@ import {
 } from "@mantine/core";
 import { IconChevronLeft, IconEyeCheck } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
-import AdminDonasi_TombolKembali from "../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
 import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
 import { useState } from "react";
 import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
@@ -27,7 +27,7 @@ export default function AdminDonasi_TablePublish({
   return (
     <>
       <Stack>
-        <AdminDonasi_TombolKembali />
+        <ComponentAdminDonasi_TombolKembali />
         <TableStatus listPublish={listPublish as any} />
       </Stack>
     </>
@@ -45,6 +45,9 @@ function TableStatus({ listPublish }: { listPublish: MODEL_DONASI[] }) {
       <td>
         <TampilanRupiahDonasi nominal={+e.target} />
       </td>
+      <td>
+        <TampilanRupiahDonasi nominal={+e.terkumpul}/>
+      </td>
       <td>{e.DonasiMaster_Ketegori.name}</td>
       <td>{e.DonasiMaster_Durasi.name} hari</td>
       <td>
@@ -84,6 +87,7 @@ function TableStatus({ listPublish }: { listPublish: MODEL_DONASI[] }) {
             <tr>
               <th>Judul</th>
               <th>Target</th>
+              <th>Terkumpul</th>
               <th>Ketegori</th>
               <th>Durasi</th>
               <th><Center>Aksi</Center></th>

src/app_modules/admin/donasi/table_status/table_reject.tsx

@@ -15,7 +15,7 @@ import {
 } from "@mantine/core";
 import { IconChevronLeft, IconEyeCheck } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
-import AdminDonasi_TombolKembali from "../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
 import { useDisclosure } from "@mantine/hooks";
 import AdminDonasi_DetailReview from "../detail_table/detail_review";
 import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
@@ -30,7 +30,7 @@ export default function AdminDonasi_TableReject({
   return (
     <>
       <Stack>
-        <AdminDonasi_TombolKembali />
+        <ComponentAdminDonasi_TombolKembali />
         <TableStatus dataReject={dataReject} />
       </Stack>
     </>

src/app_modules/admin/donasi/table_status/table_review.tsx

@@ -15,7 +15,7 @@ import {
 } from "@mantine/core";
 import { IconChevronLeft, IconEyeCheck } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
-import AdminDonasi_TombolKembali from "../component/tombol_kembali";
+import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
 import { useDisclosure } from "@mantine/hooks";
 import AdminDonasi_DetailReview from "../detail_table/detail_review";
 import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
@@ -30,7 +30,7 @@ export default function AdminDonasi_TableReview({
   return (
     <>
       <Stack>
-        <AdminDonasi_TombolKembali />
+        <ComponentAdminDonasi_TombolKembali />
         <TableStatus listReview={listReview} />
       </Stack>
     </>

src/app_modules/admin/main/layout.tsx

@@ -6,6 +6,7 @@ import {
   Avatar,
   Box,
   Burger,
+  Divider,
   Drawer,
   Footer,
   Group,
@@ -31,6 +32,8 @@ import {
 import { useRouter } from "next/navigation";
 import { RouterHome } from "@/app/lib/router_hipmi/router_home";
 import { Logout } from "@/app_modules/auth";
+import { useAtom } from "jotai";
+import { gs_adminDonasi_hotMenu } from "../donasi/global_state";
 
 export default function AdminLayout({
   children,
@@ -40,7 +43,7 @@ export default function AdminLayout({
   const theme = useMantineTheme();
   const [opened, setOpened] = useState(false);
   const router = useRouter();
-  const [active, setActive] = useState(1);
+  const [active, setActive] = useAtom(gs_adminDonasi_hotMenu);
 
   const listAdminPage = [
     {
@@ -75,15 +78,24 @@ export default function AdminLayout({
               p="xs"
               bg={"gray.2"}
             >
-              {listAdminPage.map((e) => (
-                <NavLink
-                  key={e.id}
-                  label={e.name}
-                  onClick={() => {
-                    // setActive(e.id);
-                    router.push(e.route);
-                  }}
-                />
+              {listAdminPage.map((e, i) => (
+                <Box key={i}>
+                  <NavLink
+                    sx={{
+                      ":hover": {
+                        backgroundColor: "transparent",
+                      },
+                    }}
+                    fw={active === i ? "bold" : "normal"}
+                    // key={e.id}
+                    label={e.name}
+                    onClick={() => {
+                      setActive(i);
+                      router.push(e.route);
+                    }}
+                  />
+                  {active === i ? <Divider size={"lg"} color="gray" /> : ""}
+                </Box>
               ))}
             </Navbar>
           </MediaQuery>

src/app_modules/auth/login/view.tsx

@@ -13,6 +13,8 @@ import { useAtom } from "jotai";
 import { gs_otp, gs_nomor } from "../state/state";
 import { IconCircleLetterH } from "@tabler/icons-react";
 import { RouterAdminDashboard } from "@/app/lib/router_hipmi/router_admin";
+import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
+import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
 
 export default function Login() {
   const router = useRouter();
@@ -44,12 +46,12 @@ export default function Login() {
           router.push(RouterAdminDashboard.splash_admin);
         } else {
           if (val.status == 200) {
-            toast("Nomor OTP terkirim");
             setCode(val.body.otp);
             setInputNumber(val.body.nomor);
             router.push("/dev/auth/validasi");
+           return NotifBerhasil("Nomor OTP terkirim");
           } else {
-            toast(val.message);
+            NotifGagal(val.message);
           }
         }
       });

src/app_modules/auth/validasi/view.tsx

@@ -21,6 +21,9 @@ import { ApiHipmi } from "@/app/lib/api";
 import { useRouter } from "next/navigation";
 import { funGetUserProfile } from "@/app_modules/fun/get_user_profile";
 import { useFocusTrap } from "@mantine/hooks";
+import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
+import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
+import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
 
 export default function Validasi() {
   const router = useRouter();
@@ -51,12 +54,12 @@ export default function Validasi() {
       .then((val) => {
         myConsole(val);
         if (val.status == 200) {
-          toast("Berhasil Login");
           setTimeout(() => router.push("/dev/home"), 2000);
           funGetUserProfile(val.data.id);
+          NotifBerhasil("Berhasil Login");
         } else {
-          toast("Silahkan Registrasi");
-          return router.push("/dev/auth/register");
+          router.push("/dev/auth/register");
+          NotifPeringatan("Silahkan Registrasi");
         }
       });
   };

src/app_modules/donasi/component/box_publish.tsx

@@ -45,10 +45,9 @@ export default function ComponentDonasi_BoxPublish({
         {donasi.map((e, i) => (
           <Box
             key={i}
-            onClick={
-              () => router.push(path + `${e.id}`)
-              // toast("Cooming soon")
-            }
+            onClick={() => {
+              router.push(path + `${e.id}`);
+            }}
           >
             <Stack>
               <Grid>

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

@@ -22,13 +22,19 @@ import {
 } from "@tabler/icons-react";
 import TampilanRupiahDonasi from "../tampilan_rupiah";
 import ComponentDonasi_TampilanHitungMundur from "../tampilan_hitung_mundur";
+import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
+import { NotifPeringatan } from "../notifikasi/notif_peringatan";
+import { NotifBerhasil } from "../notifikasi/notif_berhasil";
+import { Donasi_findDonaturByTokenId } from "../../fun/get/get_donatur_by_token_id";
 
 export function ComponentDonasi_DetailDataMain({
   donasi,
   countDonatur,
+  userLoginId,
 }: {
   donasi: MODEL_DONASI;
   countDonatur: number;
+  userLoginId?: string | any;
 }) {
   const router = useRouter();
   return (
@@ -103,7 +109,7 @@ export function ComponentDonasi_DetailDataMain({
             <Divider orientation="vertical" />
             <Grid.Col
               span={"auto"}
-              onClick={() => router.push(RouterDonasi.pencairan_dana)}
+              onClick={() => onPencairanDana(router, donasi, userLoginId)}
             >
               <Stack spacing={"sm"} align="center">
                 <IconMoneybag color="skyblue" />
@@ -116,3 +122,23 @@ export function ComponentDonasi_DetailDataMain({
     </>
   );
 }
+
+async function onPencairanDana(
+  router: AppRouterInstance,
+  donasi: MODEL_DONASI,
+  userLoginId: string
+) {
+  // console.log(userLoginId)
+  // console.log(donasi.authorId)
+  const cek = await Donasi_findDonaturByTokenId(donasi.id, userLoginId);
+
+  if(userLoginId == donasi.authorId)
+   return router.push(RouterDonasi.pencairan_dana + `${donasi.id}`);
+
+  if (!cek ) return NotifPeringatan("Halaman khusus donatur");
+  router.push(RouterDonasi.pencairan_dana + `${donasi.id}`);
+
+  // if (userLoginId != donasi.authorId)
+  //   return NotifPeringatan("Halaman khusus donatur");
+  // router.push(RouterDonasi.pencairan_dana + `${donasi.id}`);
+}

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

@@ -3,16 +3,18 @@
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import { Paper, Stack, Text, Title } from "@mantine/core";
 import moment from "moment";
-import router from "next/router";
+
 import { MODEL_DONASI_KABAR } from "../../model/interface";
+import { useRouter } from "next/navigation";
 
 export default function ComponentDonasi_ListKabar({
   kabar,
-
+  route
 }: {
   kabar: MODEL_DONASI_KABAR;
-
+  route: string
 }) {
+  const router = useRouter();
   return (
     <>
       <Paper bg={"gray.1"} p={"md"}>
@@ -26,7 +28,7 @@ export default function ComponentDonasi_ListKabar({
               <Text
                 c={"blue"}
                 onClick={() =>
-                  router.push(RouterDonasi.update_kabar + `${kabar.id}`)
+                  router.push(route + `${kabar.id}`)
                 }
               >
                 Buka Kabar

src/app_modules/donasi/component/header_tamplate.tsx

@@ -5,7 +5,7 @@ import { IconArrowLeft, IconChevronLeft } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
 
-export default function HeaderTamplateDonasi({
+export default function ComponentDonasi_HeaderTamplate({
   hideBack,
   changeIconBack,
   route,

src/app_modules/donasi/component/noted_box.tsx

@@ -7,9 +7,9 @@ export default function ComponentDonasi_NotedBox({
 }) {
   return (
     <>
-      <Paper bg={"blue.3"} p={"sm"}>
+      <Paper bg={"blue.3"} p={10}>
         <Group>
-          <Text fz={"xs"} fs={"italic"}>
+          <Text fz={10} fs={"italic"}>
             <Text span inherit c={"red"}>
               *{" "}
             </Text>

src/app_modules/donasi/create/create_cerita_penggalang.tsx

@@ -9,6 +9,8 @@ import {
   Image,
   Paper,
   Stack,
+  Text,
+  TextInput,
   Textarea,
 } from "@mantine/core";
 import { IconCamera } from "@tabler/icons-react";
@@ -38,6 +40,9 @@ export default function CreateCeritaPenggalangDonasi({
   const [create, setCreate] = useState({
     pembukaan: "",
     cerita: "",
+    namaBank: "",
+    rekening: ""
+    
   });
   const [temporary, setTemporary] = useState(dataTemporary);
   const [file, setFile] = useState<File | null>(null);
@@ -58,6 +63,8 @@ export default function CreateCeritaPenggalangDonasi({
       donasiMaster_KategoriId: temporary.donasiMaster_KategoriId,
       donasiMaster_DurasiId: temporary.donasiMaster_DurasiId,
       authorId: userId,
+      namaBank: create.namaBank,
+      rekening: create.rekening,
       CeritaDonasi: {
         pembukaan: create.pembukaan,
         cerita: create.cerita,
@@ -75,79 +82,118 @@ export default function CreateCeritaPenggalangDonasi({
   }
   return (
     <>
-      <Stack spacing={"md"} px={"md"}>
+      <Stack spacing={50} px={"md"}>
         {/* <pre>{JSON.stringify(dataTempo, null, 2)}</pre> */}
-        <ComponentDonasi_NotedBox informasi="Ceritakan dengan jujur & benar mengapa Penggalanagn Dana ini harus diadakan!" />
-        <Textarea
-          autosize
-          minRows={2}
-          maxRows={4}
-          withAsterisk
-          label="Pembukaan"
-          placeholder="Pembuka dari isi cerita"
-          onChange={(val) =>
-            setCreate({
-              ...create,
-              pembukaan: val.target.value,
-            })
-          }
-        />
-        <Stack spacing={"xs"}>
-          <AspectRatio ratio={16 / 9}>
-            <Paper radius={"md"}>
-              <Image
-                alt="Foto"
-                src={imageCerita ? imageCerita : "/aset/no-img.png"}
-              />
-            </Paper>
-          </AspectRatio>
+        <Stack spacing={"sm"}>
+          <ComponentDonasi_NotedBox informasi="Ceritakan dengan jujur & benar mengapa Penggalanagn Dana ini harus diadakan!" />
 
-          <Center>
-            <FileButton
-              onChange={async (files: any | null) => {
-                try {
-                  const buffer = URL.createObjectURL(
-                    new Blob([new Uint8Array(await files.arrayBuffer())])
-                  );
-                  // console.log(buffer, "ini buffer");
-                  // console.log(files, " ini file");
-                  setImageCerita(buffer);
-                  setFile(files);
-                } catch (error) {
-                  console.log(error);
-                }
-              }}
-              accept="image/png,image/jpeg"
-            >
-              {(props) => (
-                <Button
-                  {...props}
-                  radius={"xl"}
-                  variant="outline"
-                  w={150}
-                  leftIcon={<IconCamera />}
-                >
-                  Upload
-                </Button>
-              )}
-            </FileButton>
-          </Center>
+          <Textarea
+            autosize
+            minRows={2}
+            maxRows={4}
+            withAsterisk
+            label="Pembukaan"
+            placeholder="Pembuka dari isi cerita"
+            onChange={(val) =>
+              setCreate({
+                ...create,
+                pembukaan: val.target.value,
+              })
+            }
+          />
+
+          <Textarea
+            autosize
+            minRows={2}
+            maxRows={10}
+            withAsterisk
+            label="Cerita"
+            placeholder="Ceritakan alasan mengapa harus membuat Penggalangan Dana"
+            onChange={(val) =>
+              setCreate({
+                ...create,
+                cerita: val.target.value,
+              })
+            }
+          />
+
+          <Stack spacing={"xs"}>
+            <Center>
+              <FileButton
+                onChange={async (files: any | null) => {
+                  try {
+                    const buffer = URL.createObjectURL(
+                      new Blob([new Uint8Array(await files.arrayBuffer())])
+                    );
+                    // console.log(buffer, "ini buffer");
+                    // console.log(files, " ini file");
+                    setImageCerita(buffer);
+                    setFile(files);
+                  } catch (error) {
+                    console.log(error);
+                  }
+                }}
+                accept="image/png,image/jpeg"
+              >
+                {(props) => (
+                  <Button
+                    compact
+                    {...props}
+                    radius={"xl"}
+                    variant="outline"
+                    w={150}
+                    leftIcon={<IconCamera />}
+                  >
+                    Upload
+                  </Button>
+                )}
+              </FileButton>
+            </Center>
+
+            {imageCerita ? (
+              <AspectRatio ratio={16 / 9}>
+                <Paper radius={"md"}>
+                  <Image
+                    alt="Foto"
+                    src={imageCerita ? imageCerita : "/aset/no-img.png"}
+                  />
+                </Paper>
+              </AspectRatio>
+            ) : (
+              <Center>
+              <Text fs={"italic"} fz={10}>
+                Upload poster atau gambar penggalangan !
+              </Text>
+            </Center>
+            )}
+          </Stack>
         </Stack>
-        <Textarea
-          autosize
-          minRows={2}
-          maxRows={10}
-          withAsterisk
-          label="Cerita"
-          placeholder="Ceritakan alasan mengapa harus membuat Penggalangan Dana"
-          onChange={(val) =>
-            setCreate({
-              ...create,
-              cerita: val.target.value,
-            })
-          }
-        />
 
+        <Stack spacing={"sm"}>
+          <ComponentDonasi_NotedBox informasi="Lengkapi nama bank dan rekening di bawah untuk mempermudah admin jika penggalangan dana ini telah di publish!" />
+          <TextInput
+            withAsterisk
+            placeholder="Contoh: BNI, BCA, MANDIRI, DLL"
+            label="Nama Bank"
+            onChange={(val) => {
+              setCreate({
+                ...create,
+                namaBank: _.upperCase(val.target.value)
+              })
+            }}
+          />
+          <TextInput
+            withAsterisk
+            placeholder="Maskuan nomor rekening"
+            label="Nomor rekening"
+            onChange={(val) => {
+              setCreate({
+                ...create,
+                rekening: val.target.value
+              })
+            }}
+          />
+        </Stack>
         <Button w={"100%"} radius={"xl"} onClick={() => onCreate()}>
           Simpan
         </Button>

src/app_modules/donasi/create/create_donasi.tsx

@@ -91,46 +91,7 @@ export default function CreateDonasi({
             })
           }
         />
-        <Stack>
-          <AspectRatio ratio={16 / 9}>
-            <Paper radius={"md"}>
-              <Image
-                alt="Foto"
-                src={imageDonasi ? imageDonasi : "/aset/no-img.png"}
-              />
-            </Paper>
-          </AspectRatio>
-          <Center>
-            <FileButton
-              onChange={async (files: any | null) => {
-                try {
-                  const buffer = URL.createObjectURL(
-                    new Blob([new Uint8Array(await files.arrayBuffer())])
-                  );
-                  // console.log(buffer, "ini buffer");
-                  // console.log(files, " ini file");
-                  setImageDonasi(buffer);
-                  setFile(files);
-                } catch (error) {
-                  console.log(error);
-                }
-              }}
-              accept="image/png,image/jpeg"
-            >
-              {(props) => (
-                <Button
-                  {...props}
-                  radius={"xl"}
-                  variant="outline"
-                  w={150}
-                  leftIcon={<IconCamera />}
-                >
-                  Upload
-                </Button>
-              )}
-            </FileButton>
-          </Center>
-        </Stack>
+
         <Stack>
           <TextInput
             withAsterisk
@@ -160,6 +121,56 @@ export default function CreateDonasi({
             onChange={(val: string) => setCreate({ ...create, durasiId: val })}
           />
         </Stack>
+
+        <Stack>
+          <Center>
+            <FileButton
+              onChange={async (files: any | null) => {
+                try {
+                  const buffer = URL.createObjectURL(
+                    new Blob([new Uint8Array(await files.arrayBuffer())])
+                  );
+                  // console.log(buffer, "ini buffer");
+                  // console.log(files, " ini file");
+                  setImageDonasi(buffer);
+                  setFile(files);
+                } catch (error) {
+                  console.log(error);
+                }
+              }}
+              accept="image/png,image/jpeg"
+            >
+              {(props) => (
+                <Button
+                compact
+                  {...props}
+                  radius={"xl"}
+                  variant="outline"
+                  w={150}
+                  leftIcon={<IconCamera />}
+                >
+                  Upload
+                </Button>
+              )}
+            </FileButton>
+          </Center>
+          {imageDonasi ? (
+            <AspectRatio ratio={16 / 9}>
+              <Paper radius={"md"}>
+                <Image
+                  alt="Foto"
+                  src={imageDonasi ? imageDonasi : "/aset/no-img.png"}
+                />
+              </Paper>
+            </AspectRatio>
+          ) : (
+            <Center>
+              <Text fs={"italic"} fz={10}>
+                Upload poster atau gambar penggalangan !
+              </Text>
+            </Center>
+          )}
+        </Stack>
         <Button my={"lg"} radius={"xl"} onClick={() => onCreate()}>
           Selanjutnya
         </Button>

src/app_modules/donasi/create/create_kabar/index.tsx

@@ -21,6 +21,8 @@ import { NotifBerhasil } from "../../component/notifikasi/notif_berhasil";
 import { NotifGagal } from "../../component/notifikasi/notif_gagal";
 import _ from "lodash";
 import { NotifPeringatan } from "../../component/notifikasi/notif_peringatan";
+import ComponentDonasi_NotedBox from "../../component/noted_box";
+import { Donasi_funCreateNotif } from "../../fun/create/fun_create_notif";
 
 export default function Donasi_CreateKabar({ donasiId }: { donasiId: string }) {
   const router = useRouter();
@@ -33,6 +35,8 @@ export default function Donasi_CreateKabar({ donasiId }: { donasiId: string }) {
   return (
     <>
       <Stack>
+        <ComponentDonasi_NotedBox informasi="Gambar tidak wajib di isi ! Hanya upload jika di butuhkan." />
+
         <TextInput
           label="Judul"
           withAsterisk
@@ -88,6 +92,7 @@ export default function Donasi_CreateKabar({ donasiId }: { donasiId: string }) {
                   variant="outline"
                   w={150}
                   leftIcon={<IconCamera />}
+                  compact
                 >
                   Upload
                 </Button>
@@ -125,15 +130,19 @@ async function onSave(
   };
 
   if (_.values(body).includes("")) return NotifPeringatan("Lengkapi Data");
-  if (!file) return NotifPeringatan("Lengkapi Gambar");
+  // if (!file) return NotifPeringatan("Lengkapi Gambar");
 
   const gambar = new FormData();
   gambar.append("file", file as any);
 
-  await Donasi_funCreateKabar(body as any, gambar).then((res) => {
+  await Donasi_funCreateKabar(body as any, gambar).then(async (res) => {
     if (res.status === 200) {
-      NotifBerhasil(res.message);
-      router.back()
+      await Donasi_funCreateNotif(body.donasiId, res.kabarId as any).then((val) => {
+        if (val.status === 200) {
+          NotifBerhasil(res.message);
+          router.back();
+        }
+      });
     } else {
       NotifGagal(res.message);
     }

src/app_modules/donasi/create/create_kabar/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 
 export default function LayoutDonasi_CreateKabar({
   children,
@@ -11,7 +11,7 @@ export default function LayoutDonasi_CreateKabar({
 }) {
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Buat Kabar" />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Buat Kabar" />}>
         {children}
       </AppShell>
     </>

src/app_modules/donasi/create/layout.tsx

@@ -2,11 +2,11 @@
 
 import { AppShell } from "@mantine/core"
 import React from "react"
-import HeaderTamplateDonasi from "../component/header_tamplate"
+import ComponentDonasi_HeaderTamplate from "../component/header_tamplate"
 
 export default function LayoutCreateDonasi({children}: {children: React.ReactNode}){
     return<>
-    <AppShell header={<HeaderTamplateDonasi title="Buat Donasi"/>}>
+    <AppShell header={<ComponentDonasi_HeaderTamplate title="Buat Donasi"/>}>
         {children}
     </AppShell>
     

src/app_modules/donasi/detail/deail_notif/index.tsx

@@ -0,0 +1,34 @@
+"use client";
+
+import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
+import { AspectRatio, Box, Image, Paper, Stack, Text, Title } from "@mantine/core";
+import moment from "moment";
+import kabar from "../detail_main/kabar";
+import { MODEL_DONASI_KABAR } from "../../model/interface";
+import { useState } from "react";
+
+export default function Donasi_DetailNotif({dataKabar}: {dataKabar: MODEL_DONASI_KABAR}) {
+  const [kabar, setKabar] = useState(dataKabar)
+  return <>
+   <Stack>
+        <Stack>
+          <Text fz={"xs"}>{moment(Date.now()).format("ll")}</Text>
+          <Title order={5}>{kabar.title}</Title>
+          {kabar.imagesId === null ? (
+            ""
+          ) : (
+            <AspectRatio ratio={16 / 9}>
+              <Paper radius={"md"}>
+                <Image
+                  alt="Foro"
+                  src={RouterDonasi.api_gambar_kabar + `${kabar.imagesId}`}
+                />
+              </Paper>
+            </AspectRatio>
+          )}
+          <Text>{kabar.deskripsi}</Text>
+        </Stack>
+      </Stack>
+
+  </>;
+}

src/app_modules/donasi/detail/deail_notif/layout.tsx

@@ -0,0 +1,41 @@
+"use client";
+
+import { AppShell, Button, Center, Footer } from "@mantine/core";
+import React from "react";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
+import { useRouter } from "next/navigation";
+import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
+
+export default function LayoutDonasi_DetailNotif({
+  children,
+  donasiId,
+}: {
+  children: React.ReactNode;
+  donasiId: string;
+}) {
+  const router = useRouter();
+  return (
+    <>
+      <AppShell
+        header={<ComponentDonasi_HeaderTamplate title="Detail Pemberitahuan" />}
+        footer={
+          <Footer height={70} p={"md"}>
+            <Center h={"100%"}>
+              <Button
+                w={"100%"}
+                radius={"xl"}
+                onClick={() =>
+                  router.push(RouterDonasi.detail_main + `${donasiId}`)
+                }
+              >
+                Lihat Donasi
+              </Button>
+            </Center>
+          </Footer>
+        }
+      >
+        {children}
+      </AppShell>
+    </>
+  );
+}

src/app_modules/donasi/detail/detail_donasi_saya/layout.tsx

@@ -2,13 +2,13 @@
 
 import { AppShell } from "@mantine/core"
 import React from "react"
-import HeaderTamplateDonasi from "../../component/header_tamplate"
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate"
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"
 
 export default function LayoutDetailDonasiSaya({children}: {children: React.ReactNode}){
     return<>
     <AppShell
-    header={<HeaderTamplateDonasi title="Detail Donasi Saya" route={RouterDonasi.main_donasi_saya} />}
+    header={<ComponentDonasi_HeaderTamplate title="Detail Donasi Saya" route={RouterDonasi.main_donasi_saya} />}
     >
         {children}
     </AppShell>

src/app_modules/donasi/detail/detail_draft/layout.tsx

@@ -12,7 +12,7 @@ import {
   Title,
 } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 import {
   IconChevronLeft,
   IconEdit,
@@ -78,6 +78,15 @@ export default function LayoutDetailDraftDonasi({
           >
             Edit Cerita
           </Button>
+          <Button
+            variant="outline"
+            radius={"xl"}
+            w={"100%"}
+            color="orange"
+            onClick={() => router.push(RouterDonasi.edit_rekening + `${donasiId}`)}
+          >
+            Edit Rekening
+          </Button>
         </Stack>
       </Modal>
     </>

src/app_modules/donasi/detail/detail_kabar/index.tsx

@@ -13,38 +13,30 @@ import {
   Divider,
 } from "@mantine/core";
 import moment from "moment";
+import { MODEL_DONASI_KABAR } from "../../model/interface";
+import { useState } from "react";
 
-export default function DetailKabarDonasi() {
+export default function DetailKabarDonasi({dataDonasi}: {dataDonasi: MODEL_DONASI_KABAR}) {
+  const [kabar, setKabar] = useState(dataDonasi)
   return (
     <>
-      <Stack>
-        <Group>
-          <Avatar variant="filled" radius={"xl"} />
-          <Stack spacing={0}>
-            <Text>Username</Text>
-            <Text fz={"xs"}>{moment(Date.now()).format("ll")}</Text>
-          </Stack>
-        </Group>
+     <Stack>
         <Stack>
-          <Title order={5}>Judul Berita</Title>
-         
-
-          <Text>
-            Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquam
-            nostrum vitae eum facilis similique minus exercitationem assumenda,
-            quidem dolores illum ducimus fuga rem molestias? Numquam id
-            praesentium dolor qui amet.
-          </Text>
-
-          <AspectRatio ratio={16 / 9}>
-            <Image alt="Foro" src={"/aset/no-img.png"} />
-          </AspectRatio>
-          <Text>
-            Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquam
-            nostrum vitae eum facilis similique minus exercitationem assumenda,
-            quidem dolores illum ducimus fuga rem molestias? Numquam id
-            praesentium dolor qui amet.
-          </Text>
+          <Text fz={"xs"}>{moment(Date.now()).format("ll")}</Text>
+          <Title order={5}>{kabar.title}</Title>
+          {kabar.imagesId === null ? (
+            ""
+          ) : (
+            <AspectRatio ratio={16 / 9}>
+              <Paper radius={"md"}>
+                <Image
+                  alt="Foro"
+                  src={RouterDonasi.api_gambar_kabar + `${kabar.imagesId}`}
+                />
+              </Paper>
+            </AspectRatio>
+          )}
+          <Text>{kabar.deskripsi}</Text>
         </Stack>
       </Stack>
     </>

src/app_modules/donasi/detail/detail_kabar/layout.tsx

@@ -11,7 +11,7 @@ import {
 import { useRouter } from "next/navigation";
 import React from "react";
 import FooterDonasi from "../../component/footer_close_donasi";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 
 export default function LayoutDetailKabarDonasi({
   children,
@@ -22,7 +22,7 @@ export default function LayoutDetailKabarDonasi({
   return (
     <>
       <AppShell
-        header={<HeaderTamplateDonasi title="Detail Kabar" hideBack={true} />}
+        header={<ComponentDonasi_HeaderTamplate title="Detail Kabar" hideBack={true} />}
         footer={<FooterDonasi />}
       >
         {children}

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

@@ -2,7 +2,7 @@
 
 import ButtonDonasi from "@/app_modules/donasi/component/footer_button_donasi";
 import FooterDonasi from "@/app_modules/donasi/component/footer_close_donasi";
-import HeaderTamplateDonasi from "@/app_modules/donasi/component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "@/app_modules/donasi/component/header_tamplate";
 import { AppShell } from "@mantine/core";
 import React from "react";
 
@@ -19,7 +19,7 @@ export default function LayoutCeritaPenggalangDonasi({
     return (
       <>
         <AppShell
-          header={<HeaderTamplateDonasi title="Cerita Penggalang Dana" />}
+          header={<ComponentDonasi_HeaderTamplate title="Cerita Penggalang Dana" />}
         >
           {children}
         </AppShell>
@@ -28,7 +28,7 @@ export default function LayoutCeritaPenggalangDonasi({
   }
   return (
     <AppShell
-      header={<HeaderTamplateDonasi title="Cerita Penggalang Dana" />}
+      header={<ComponentDonasi_HeaderTamplate title="Cerita Penggalang Dana" />}
       footer={<ButtonDonasi donasiId={donasiId}/>}
     >
       {children}

src/app_modules/donasi/detail/detail_main/donatur/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../../component/header_tamplate";
 
 export default function LayoutDonaturDonasi({
   children,
@@ -11,7 +11,7 @@ export default function LayoutDonaturDonasi({
 }) {
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Donatur" />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Donatur" />}>
         {children}
       </AppShell>
     </>

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

@@ -35,15 +35,21 @@ import ComponentDonasi_InformasiPenggalangMain from "../../component/detail_main
 
 export default function DetailMainDonasi({
   dataDonasi,
-  countDonatur
+  countDonatur,
+  userLoginId,
 }: {
   dataDonasi: MODEL_DONASI;
-  countDonatur: number
+  countDonatur: number;
+  userLoginId: string;
 }) {
   return (
     <>
       <Stack spacing={40}>
-        <ComponentDonasi_DetailDataMain donasi={dataDonasi} countDonatur={countDonatur} />
+        <ComponentDonasi_DetailDataMain
+          donasi={dataDonasi}
+          countDonatur={countDonatur}
+          userLoginId={userLoginId}
+        />
         <ComponentDonasi_InformasiPenggalangMain author={dataDonasi.Author} />
         <ComponentDonasi_CeritaPenggalangMain donasi={dataDonasi} />
       </Stack>

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

@@ -40,7 +40,7 @@ export default function KabarDonasi({
       >
         {kabar.map((e, i) => (
          <Box key={i}>
-          <ComponentDonasi_ListKabar kabar={e} />
+          <ComponentDonasi_ListKabar kabar={e} route={RouterDonasi.detail_kabar} />
          </Box>
         ))}
       </SimpleGrid>

src/app_modules/donasi/detail/detail_main/kabar/layout.tsx

@@ -2,12 +2,12 @@
 
 import { AppShell } from "@mantine/core"
 import React from "react"
-import HeaderTamplateDonasi from "../../../component/header_tamplate"
+import ComponentDonasi_HeaderTamplate from "../../../component/header_tamplate"
 
 export default function LayoutKabarDonasi({children}: {children: React.ReactNode}){
     return<>
     <AppShell
-    header={<HeaderTamplateDonasi title="Kabar Terbaru"/>}
+    header={<ComponentDonasi_HeaderTamplate title="Kabar Terbaru"/>}
     >
         {children}
     </AppShell>

src/app_modules/donasi/detail/detail_main/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell, Box, Button, Center, Footer } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 import ButtonDonasi from "../../component/footer_button_donasi";
 
 export default function LayoutDetailMainDonasi({
@@ -15,7 +15,7 @@ export default function LayoutDetailMainDonasi({
   return (
     <>
       <AppShell
-        header={<HeaderTamplateDonasi title="Detail Donasi" />}
+        header={<ComponentDonasi_HeaderTamplate title="Detail Donasi" />}
         footer={<ButtonDonasi  donasiId={donasiId}/>}
       >
         {children}

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

@@ -1,7 +1,14 @@
 "use client";
 
+import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 import ComponentDonasi_NotedBox from "@/app_modules/donasi/component/noted_box";
+import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
 import {
+  MODEL_DONASI,
+  MODEL_DONASI_PENCAIRAN_DANA,
+} from "@/app_modules/donasi/model/interface";
+import {
+  AspectRatio,
   Avatar,
   Button,
   Center,
@@ -18,85 +25,103 @@ import {
 import { useDisclosure } from "@mantine/hooks";
 import { IconTransferIn } from "@tabler/icons-react";
 import moment from "moment";
+import { useState } from "react";
 
-export default function PencairanDanaDonasi() {
+export default function PencairanDanaDonasi({
+  totalAkumulasi,
+  listPencairan,
+}: {
+  totalAkumulasi: MODEL_DONASI;
+  listPencairan: MODEL_DONASI_PENCAIRAN_DANA[];
+}) {
+  const [akumulasi, setAkumulasi] = useState(totalAkumulasi);
+  const [listPD, setListPD] = useState(listPencairan);
   return (
     <>
       <Stack>
-        <BoxDanaDicarikan />
-        <InformasiPencairanDana />
+        <BoxDanaDicarikan akumulasi={akumulasi} />
+        <InformasiPencairanDana listPD={listPD} />
       </Stack>
     </>
   );
 }
 
-function BoxDanaDicarikan() {
+function BoxDanaDicarikan({ akumulasi }: { akumulasi: MODEL_DONASI }) {
   return (
     <>
       <Paper bg={"gray.1"} p={"md"}>
         <Stack>
-        <Grid>
-          <Grid.Col span={6}>
-            <Title order={5}>Rp. 10.000.000</Title>
-            <Text fz={"xs"}>Dana sudah dicairkan</Text>
-          </Grid.Col>
-          <Grid.Col span={6}>
-            <Title order={5}>2 kali</Title>
-            <Text fz={"xs"}>Pencairan dana</Text>
-          </Grid.Col>
-        </Grid>
-        <ComponentDonasi_NotedBox informasi=" Pencairan dana akan dilakukan oleh Admin HIPMI tanpa campur tangan
+          <Grid>
+            <Grid.Col span={6}>
+              <Title order={5}>
+                <TampilanRupiahDonasi nominal={akumulasi.totalPencairan} />
+              </Title>
+              <Text fz={"xs"}>Dana sudah dicairkan</Text>
+            </Grid.Col>
+            <Grid.Col span={6}>
+              <Title order={5}>{akumulasi.akumulasiPencairan} kali</Title>
+              <Text fz={"xs"}>Pencairan dana</Text>
+            </Grid.Col>
+          </Grid>
+          <ComponentDonasi_NotedBox
+            informasi=" Pencairan dana akan dilakukan oleh Admin HIPMI tanpa campur tangan
             pihak manapun, jika berita pencairan dana dibawah tidak sesuai
             dengan kabar yang diberikan oleh PENGGALANG DANA. Maka pegguna lain
-            dapat melaporkannya pada Admin HIPMI !"/>
+            dapat melaporkannya pada Admin HIPMI !"
+          />
         </Stack>
       </Paper>
     </>
   );
 }
 
-function InformasiPencairanDana() {
+function InformasiPencairanDana({
+  listPD,
+}: {
+  listPD: MODEL_DONASI_PENCAIRAN_DANA[];
+}) {
   const [opened, { open, close }] = useDisclosure(false);
+  const [idGambar, setIdGambar] = useState("");
   return (
     <>
-      <Modal opened={opened} onClose={close} fullScreen>
-        <Paper>
-          <Stack>
+      <Modal opened={opened} onClose={close} size={"xl"}>
+        <AspectRatio ratio={9 / 16}>
+          <Paper>
+            <Image
+              alt="Foto"
+              src={RouterDonasi.api_gambar_pencairan + `${idGambar}`}
+            />
+          </Paper>
+        </AspectRatio>
+      </Modal>
+      {listPD.map((e, i) => (
+        <Paper key={i} withBorder p={"md"}>
+          <Text fz={"xs"}>{moment(e.createdAt).format("ll")}</Text>
+          <Stack spacing={"lg"}>
+            <Title order={5}>{e.title}</Title>
+            <Spoiler
+              maxHeight={50}
+              hideLabel="Sembunyikan"
+              showLabel="Baca Selengkapnya"
+            >
+              {e.deskripsi}
+            </Spoiler>
             <Center>
-              <Title order={5}>Bukti Pencairan Dana</Title>
+              <Button
+                radius={"xl"}
+                variant="outline"
+                leftIcon={<IconTransferIn />}
+                onClick={() => {
+                  open();
+                  setIdGambar(e.imagesId);
+                }}
+              >
+                Bukti Transfer
+              </Button>
             </Center>
-            <Image alt="Foto" src={"/aset/donasi/bukti.jpg"} />
           </Stack>
         </Paper>
-      </Modal>
-      {Array(2)
-        .fill(0)
-        .map((e, i) => (
-          <Paper key={i} withBorder p={"md"}>
-            <Text fz={"xs"}>{moment(Date.now()).format("ll")}</Text>
-            <Stack spacing={"lg"}>
-              <Title order={5}>Pencairan Dana Sebesar Rp. 5.000.000</Title>
-              <Spoiler
-                maxHeight={50}
-                hideLabel="Sembunyikan"
-                showLabel="Baca Selengkapnya"
-              >
-                Pencairan Dana kepada pihak Penggalang dana sebesar 5 juta yang
-                di transfer pada, {moment(Date.now()).format("lll")}.
-              </Spoiler>
-              <Center>
-                <Button
-                  radius={"xl"}
-                  variant="outline"
-                  leftIcon={<IconTransferIn />}
-                  onClick={() => open()}
-                >
-                  Bukti Transfer
-                </Button>
-              </Center>
-            </Stack>
-          </Paper>
-        ))}
+      ))}
     </>
   );
 }

src/app_modules/donasi/detail/detail_main/pencairan_dana/layout.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import HeaderTamplateDonasi from "@/app_modules/donasi/component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "@/app_modules/donasi/component/header_tamplate";
 import { AppShell } from "@mantine/core";
 import React from "react";
 
@@ -11,7 +11,7 @@ export default function LayoutPencairanDanaDonasi({
 }) {
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Pencairan Dana" />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Pencairan Dana" />}>
         {children}
       </AppShell>
     </>

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

@@ -1,6 +1,6 @@
 "use client";
 
-import HeaderTamplateDonasi from "@/app_modules/donasi/component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "@/app_modules/donasi/component/header_tamplate";
 import { AppShell } from "@mantine/core";
 import React from "react";
 
@@ -12,7 +12,7 @@ export default function LayoutPenggalangDanaDonasi({
   return (
     <>
       <AppShell
-        header={<HeaderTamplateDonasi title="Informasi Penggalangan Dana" />}
+        header={<ComponentDonasi_HeaderTamplate title="Informasi Penggalangan Dana" />}
         //   footer={<FooterDonasi />}
       >
         {children}

src/app_modules/donasi/detail/detail_publish/index.tsx

@@ -31,17 +31,19 @@ import ComponentDonasi_InformasiPenggalangMain from "../../component/detail_main
 
 export default function DetailPublishDonasi({
   dataPublish,
-  countDonatur
+  countDonatur,
+  userLoginId
 }: {
   dataPublish: MODEL_DONASI;
-  countDonatur: number
+  countDonatur: number,
+  userLoginId: string
 }) {
   const [donasi, setDonasi] = useState(dataPublish);
   return (
     <>
       {/* <pre>{JSON.stringify(donasi,null,2)}</pre> */}
       <Stack spacing={40}>
-        <ComponentDonasi_DetailDataMain donasi={donasi} countDonatur={countDonatur} />
+        <ComponentDonasi_DetailDataMain donasi={donasi} countDonatur={countDonatur} userLoginId={userLoginId}/>
         <ComponentDonasi_InformasiPenggalangMain author={donasi.Author}/>
         <ComponentDonasi_CeritaPenggalangMain donasi={donasi} />
       </Stack>

src/app_modules/donasi/detail/detail_publish/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 import { IconEdit, IconMessageShare } from "@tabler/icons-react";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 
@@ -17,7 +17,7 @@ export default function LayoutDetailPublishDonasi({
     <>
       <AppShell
         header={
-          <HeaderTamplateDonasi
+          <ComponentDonasi_HeaderTamplate
             title="Detail Publish"
             icon={<IconMessageShare />}
             route2={RouterDonasi.list_kabar + `${donasiId}`}

src/app_modules/donasi/detail/detail_reject/index.tsx

@@ -37,6 +37,7 @@ import { NotifBerhasil } from "../../component/notifikasi/notif_berhasil";
 import { NotifGagal } from "../../component/notifikasi/notif_gagal";
 import ComponentDonasi_CeritaPenggalangMain from "../../component/detail_main/cerita_penggalang";
 import ComponentDonasi_DetailDataGalangDana from "../../component/detail_galang_dana/detail_data_donasi";
+import { Donasi_funDeleteDonasiById } from "../../fun/delete/fin_delete_donasi_by_id";
 
 export default function DetailRejectDonasi({
   dataReject,
@@ -92,8 +93,15 @@ function ButtonAction({ donasiId }: { donasiId: string }) {
     setTabsPostingDonasi("Draft");
   }
   async function onDelete() {
-    router.push(RouterDonasi.main_galang_dana);
-    setTabsPostingDonasi("Reject");
+    await Donasi_funDeleteDonasiById(donasiId).then((res) => {
+      if (res.status === 200) {
+        router.push(RouterDonasi.main_galang_dana);
+        setTabsPostingDonasi("Reject");
+        NotifBerhasil(res.message);
+      } else {
+        NotifGagal(res.message);
+      }
+    });
   }
   return (
     <>

src/app_modules/donasi/detail/detail_reject/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 import { IconEdit, IconMessageShare } from "@tabler/icons-react";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 
@@ -14,7 +14,7 @@ export default  function LayoutDetailRejectDonasi({
   
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Detail Reject"  />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Detail Reject"  />}>
         {children}
       </AppShell>
     </>

src/app_modules/donasi/detail/detail_review/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 import { IconEdit, IconMessageShare } from "@tabler/icons-react";
 import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
 
@@ -14,7 +14,7 @@ export default  function LayoutDetailReviewDonasi({
   
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Detail Review"  />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Detail Review"  />}>
         {children}
       </AppShell>
     </>

src/app_modules/donasi/edit/edit_cerita_penggalang/index.tsx

@@ -121,7 +121,7 @@ export default function EditCeritaPenggalangDonasi({
           radius={"xl"}
           onClick={() => onUpdate(router, value, file as any)}
         >
-          Simpan
+          Update
         </Button>
       </Stack>
       {/* <pre> {JSON.stringify(value.pembukaan, null, 2)}</pre> */}

src/app_modules/donasi/edit/edit_cerita_penggalang/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 
 export default function LayoutEditCeritaPenggalangDonasi({
   children,
@@ -11,7 +11,7 @@ export default function LayoutEditCeritaPenggalangDonasi({
 }) {
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Update Cerita Penggalang" />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Update Cerita Penggalang" />}>
         {children}
       </AppShell>
     </>

src/app_modules/donasi/edit/edit_donasi/layout.tsx

@@ -2,7 +2,7 @@
 
 import { AppShell } from "@mantine/core";
 import React from "react";
-import HeaderTamplateDonasi from "../../component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 
 export default function LayoutEditDonasi({
   children,
@@ -11,7 +11,7 @@ export default function LayoutEditDonasi({
 }) {
   return (
     <>
-      <AppShell header={<HeaderTamplateDonasi title="Edit Donasi" />}>
+      <AppShell header={<ComponentDonasi_HeaderTamplate title="Edit Donasi" />}>
         {children}
       </AppShell>
     </>

src/app_modules/donasi/edit/edit_rekening/index.tsx

@@ -0,0 +1,67 @@
+"use client";
+
+import { Button, Stack, TextInput } from "@mantine/core";
+import { MODEL_DONASI } from "../../model/interface";
+import { useState } from "react";
+import _ from "lodash";
+import { useRouter } from "next/navigation";
+import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
+import { Donasi_funUpdateRekening } from "../../fun/update/fun_update_rekening";
+import { NotifBerhasil } from "../../component/notifikasi/notif_berhasil";
+import { NotifGagal } from "../../component/notifikasi/notif_gagal";
+
+export default function Donasi_EditRekening({
+  dataDonasi,
+}: {
+  dataDonasi: MODEL_DONASI;
+}) {
+  const router = useRouter();
+  const [donasi, setDonasi] = useState(dataDonasi);
+
+  return (
+    <>
+      <Stack spacing={"xl"}>
+        <Stack spacing={"sm"}>
+          <TextInput
+            withAsterisk
+            label="Nama Bank"
+            placeholder="Masukan Nama Bank"
+            value={donasi.namaBank}
+            onChange={(val) =>
+              setDonasi({
+                ...donasi,
+                namaBank: _.upperCase(val.target.value),
+              })
+            }
+          />
+          <TextInput
+            withAsterisk
+            label="Nomor Rekening"
+            placeholder="Masukkan Nomor Rekening"
+            value={donasi.rekening}
+            onChange={(val) =>
+              setDonasi({
+                ...donasi,
+                rekening: val.target.value,
+              })
+            }
+          />
+        </Stack>
+        <Button radius={"xl"} onClick={() => onUpdate(router, donasi)}>
+          Update
+        </Button>
+      </Stack>
+    </>
+  );
+}
+
+async function onUpdate(router: AppRouterInstance, donasi: MODEL_DONASI) {
+  await Donasi_funUpdateRekening(donasi).then((res) => {
+    if (res.status === 200) {
+      router.back();
+      NotifBerhasil(res.message);
+    } else {
+      NotifGagal(res.message);
+    }
+  });
+}

src/app_modules/donasi/edit/edit_rekening/layout.tsx

@@ -0,0 +1,21 @@
+"use client";
+
+import { AppShell } from "@mantine/core";
+import React from "react";
+import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
+
+export default function LayoutDonasi_EditRekening({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      <AppShell
+        header={<ComponentDonasi_HeaderTamplate title="Edit Rekening" />}
+      >
+        {children}
+      </AppShell>
+    </>
+  );
+}

src/app_modules/donasi/edit/list_kabar/index.tsx

@@ -55,7 +55,7 @@ export default function ListKabarDonasi({
         >
           {kabar.map((e, i) => (
            <Box key={i}>
-            <ComponentDonasi_ListKabar kabar={e}/>
+            <ComponentDonasi_ListKabar kabar={e} route={RouterDonasi.update_kabar}/>
            </Box>
           ))}
         </SimpleGrid>

src/app_modules/donasi/edit/list_kabar/layout.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import HeaderTamplateDonasi from "@/app_modules/donasi/component/header_tamplate";
+import ComponentDonasi_HeaderTamplate from "@/app_modules/donasi/component/header_tamplate";
 import { AppShell } from "@mantine/core";
 import React from "react";
 
@@ -12,7 +12,7 @@ export default function LayoutListKabarDonasi({
   return (
     <>
       <AppShell 
-      header={<HeaderTamplateDonasi title="List Kabar" />}>
+      header={<ComponentDonasi_HeaderTamplate title="List Kabar" />}>
         {children}
       </AppShell>
     </>