Fix: Image donasi

Deksripsi:
- Tampilan image dari server wibu
- Upload image ke server wibu
## No Issue

src/app_modules/donasi/_ui/edit/ui_edit_kabar.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Donasi_ViewEditKabar } from "../../_view";
+
+export function Donasi_UiEditKabar({ dataKabar }: { dataKabar: any }) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Edit Kabar" />}
+      >
+        <Donasi_ViewEditKabar dataKabar={dataKabar as any} />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/donasi/_ui/index.ts

@@ -0,0 +1,7 @@
+import { Donasi_UiEditKabar } from "./edit/ui_edit_kabar";
+import { Donasi_UiDaftarKabar } from "./kabar/ui_daftar_kabar";
+import { Donasi_UiRekapKabar } from "./kabar/ui_rekap_kabar";
+
+export { Donasi_UiDaftarKabar };
+export { Donasi_UiEditKabar };
+export { Donasi_UiRekapKabar };

src/app_modules/donasi/_ui/kabar/ui_daftar_kabar.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import React from "react";
+import { Donasi_ViewDaftarKabar } from "../../_view";
+
+export function Donasi_UiDaftarKabar({
+  dataDonasi,
+  donasiId,
+}: {
+  dataDonasi: string;
+  donasiId: string;
+}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Daftar Kabar" />}
+      >
+        <Donasi_ViewDaftarKabar
+          dataDonasi={dataDonasi as any}
+          donasiId={donasiId}
+        />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/donasi/_ui/kabar/ui_rekap_kabar.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
+import { UIGlobal_Drawer } from "@/app_modules/_global/ui";
+import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
+import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { ActionIcon } from "@mantine/core";
+import { IconCirclePlus, IconDotsVertical } from "@tabler/icons-react";
+import React, { useState } from "react";
+import { Donasi_ViewRekapKabar } from "../../_view";
+
+export function Donasi_UiRekapKabar({
+  listKabar,
+  donasiId,
+}: {
+  listKabar: any[];
+  donasiId: string;
+}) {
+  const [openDrawer, setOpenDrawer] = useState(false);
+  const listPage = [
+    {
+      id: "1",
+      name: "Tambah Kabar",
+      icon: <IconCirclePlus />,
+      path: RouterDonasi.create_kabar + donasiId,
+    },
+  ];
+
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={
+          <UIGlobal_LayoutHeaderTamplate
+            title="Daftar Kabar"
+            customButtonRight={
+              <ActionIcon
+                variant="transparent"
+                onClick={() => {
+                  setOpenDrawer(true);
+                }}
+              >
+                <IconDotsVertical color="white" />
+              </ActionIcon>
+            }
+          />
+        }
+      >
+        <Donasi_ViewRekapKabar donasiId={donasiId} listKabar={listKabar} />
+      </UIGlobal_LayoutTamplate>
+
+      <UIGlobal_Drawer
+        opened={openDrawer}
+        close={() => setOpenDrawer(false)}
+        component={listPage}
+      />
+    </>
+  );
+}