API & UI Pasar Desa Menu Ekonomi

prisma/data/ekonomi/pasar-desa/kategori-produk.json

@@ -0,0 +1,10 @@
+[
+  {
+    "id": "4b95bge6-012e-5ged-9552-4d8g65d44959",
+    "nama": "Makanan"
+  },
+  {
+    "id": "5c06chf7-123f-6hfe-0663-5e9h76e55060",
+    "nama": "Minuman"
+  }
+]

prisma/migrations/20250703070556_3_jul_2025_1/migration.sql

@@ -0,0 +1,85 @@
+/*
+  Warnings:
+
+  - The values [SELESAI,PROSES,GAGAL] on the enum `StatusLaporan` will be removed. If these variants are still used in the database, this will fail.
+  - You are about to drop the column `icon` on the `KontakDaruratKeamanan` table. All the data in the column will be lost.
+  - You are about to drop the column `urutan` on the `KontakDaruratKeamanan` table. All the data in the column will be lost.
+  - You are about to drop the column `icon` on the `KontakItem` table. All the data in the column will be lost.
+
+*/
+-- AlterEnum
+BEGIN;
+CREATE TYPE "StatusLaporan_new" AS ENUM ('Selesai', 'Proses', 'Gagal');
+ALTER TABLE "LaporanPublik" ALTER COLUMN "status" TYPE "StatusLaporan_new" USING ("status"::text::"StatusLaporan_new");
+ALTER TYPE "StatusLaporan" RENAME TO "StatusLaporan_old";
+ALTER TYPE "StatusLaporan_new" RENAME TO "StatusLaporan";
+DROP TYPE "StatusLaporan_old";
+COMMIT;
+
+-- AlterTable
+ALTER TABLE "KontakDaruratKeamanan" DROP COLUMN "icon",
+DROP COLUMN "urutan",
+ADD COLUMN     "imageId" TEXT;
+
+-- AlterTable
+ALTER TABLE "KontakItem" DROP COLUMN "icon",
+ADD COLUMN     "imageId" TEXT;
+
+-- CreateTable
+CREATE TABLE "LowonganPekerjaan" (
+    "id" TEXT NOT NULL,
+    "posisi" TEXT NOT NULL,
+    "namaPerusahaan" TEXT NOT NULL,
+    "lokasi" TEXT NOT NULL,
+    "tipePekerjaan" TEXT NOT NULL,
+    "gaji" TEXT NOT NULL,
+    "deskripsi" TEXT NOT NULL,
+    "kualifikasi" TEXT NOT NULL,
+    "tanggalPosting" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "isActive" BOOLEAN NOT NULL DEFAULT true,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+    "deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "LowonganPekerjaan_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "ProgramKemiskinan" (
+    "id" TEXT NOT NULL,
+    "nama" TEXT NOT NULL,
+    "deskripsi" TEXT NOT NULL,
+    "ikonUrl" TEXT,
+    "isActive" BOOLEAN NOT NULL DEFAULT true,
+    "statistikId" TEXT,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "ProgramKemiskinan_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "StatistikKemiskinan" (
+    "id" TEXT NOT NULL,
+    "tahun" INTEGER NOT NULL,
+    "jumlah" INTEGER NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "StatistikKemiskinan_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "ProgramKemiskinan_statistikId_key" ON "ProgramKemiskinan"("statistikId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "StatistikKemiskinan_tahun_key" ON "StatistikKemiskinan"("tahun");
+
+-- AddForeignKey
+ALTER TABLE "KontakDaruratKeamanan" ADD CONSTRAINT "KontakDaruratKeamanan_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "KontakItem" ADD CONSTRAINT "KontakItem_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "ProgramKemiskinan" ADD CONSTRAINT "ProgramKemiskinan_statistikId_fkey" FOREIGN KEY ("statistikId") REFERENCES "StatistikKemiskinan"("id") ON DELETE SET NULL ON UPDATE CASCADE;

prisma/migrations/20250703082409_nico_3_jul_25_2/migration.sql

@@ -0,0 +1,59 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `alamat` on the `PasarDesa` table. All the data in the column will be lost.
+  - You are about to drop the column `deletedAt` on the `PasarDesa` table. All the data in the column will be lost.
+  - You are about to drop the column `isActive` on the `PasarDesa` table. All the data in the column will be lost.
+  - You are about to drop the column `kategoriId` on the `PasarDesa` table. All the data in the column will be lost.
+  - You are about to drop the column `satuan` on the `PasarDesa` table. All the data in the column will be lost.
+  - You are about to drop the `KategoriMakanan` table. If the table is not empty, all the data it contains will be lost.
+  - Added the required column `alamatUsaha` to the `PasarDesa` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- DropForeignKey
+ALTER TABLE "PasarDesa" DROP CONSTRAINT "PasarDesa_imageId_fkey";
+
+-- DropForeignKey
+ALTER TABLE "PasarDesa" DROP CONSTRAINT "PasarDesa_kategoriId_fkey";
+
+-- AlterTable
+ALTER TABLE "PasarDesa" DROP COLUMN "alamat",
+DROP COLUMN "deletedAt",
+DROP COLUMN "isActive",
+DROP COLUMN "kategoriId",
+DROP COLUMN "satuan",
+ADD COLUMN     "alamatUsaha" TEXT NOT NULL,
+ALTER COLUMN "imageId" DROP NOT NULL;
+
+-- DropTable
+DROP TABLE "KategoriMakanan";
+
+-- CreateTable
+CREATE TABLE "KategoriProduk" (
+    "id" TEXT NOT NULL,
+    "nama" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "KategoriProduk_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "_ProdukToKategori" (
+    "A" TEXT NOT NULL,
+    "B" TEXT NOT NULL,
+
+    CONSTRAINT "_ProdukToKategori_AB_pkey" PRIMARY KEY ("A","B")
+);
+
+-- CreateIndex
+CREATE INDEX "_ProdukToKategori_B_index" ON "_ProdukToKategori"("B");
+
+-- AddForeignKey
+ALTER TABLE "PasarDesa" ADD CONSTRAINT "PasarDesa_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "_ProdukToKategori" ADD CONSTRAINT "_ProdukToKategori_A_fkey" FOREIGN KEY ("A") REFERENCES "KategoriProduk"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "_ProdukToKategori" ADD CONSTRAINT "_ProdukToKategori_B_fkey" FOREIGN KEY ("B") REFERENCES "PasarDesa"("id") ON DELETE CASCADE ON UPDATE CASCADE;

prisma/schema.prisma

@@ -933,7 +933,7 @@ model LayananPolsek {
 // ========================================= KONTAK DARURAT ========================================= //
 model KontakDaruratKeamanan {
   id          String       @id @default(uuid())
-  nama        String       // contoh: "Layanan Darurat", "Fasilitas Kesehatan"
+  nama        String // contoh: "Layanan Darurat", "Fasilitas Kesehatan"
   image       FileStorage? @relation(fields: [imageId], references: [id])
   imageId     String?
   kontakItems KontakItem[]
@@ -942,15 +942,15 @@ model KontakDaruratKeamanan {
 }
 
 model KontakItem {
-  id              String         @id @default(uuid())
-  nama            String         // contoh: "Polisi", "Ambulans", "Puskesmas Darmasaba"
-  nomorTelepon    String
-  image           FileStorage?   @relation(fields: [imageId], references: [id])
-  imageId         String?
-  kategori        KontakDaruratKeamanan @relation(fields: [kategoriId], references: [id])
-  kategoriId      String
-  createdAt       DateTime       @default(now())
-  updatedAt       DateTime       @updatedAt
+  id           String                @id @default(uuid())
+  nama         String // contoh: "Polisi", "Ambulans", "Puskesmas Darmasaba"
+  nomorTelepon String
+  image        FileStorage?          @relation(fields: [imageId], references: [id])
+  imageId      String?
+  kategori     KontakDaruratKeamanan @relation(fields: [kategoriId], references: [id])
+  kategoriId   String
+  createdAt    DateTime              @default(now())
+  updatedAt    DateTime              @updatedAt
 }
 
 // ========================================= PENCEGAHAN KRIMINALITAS ========================================= //
@@ -1020,9 +1020,9 @@ model PenangananLaporanPublik {
 }
 
 enum StatusLaporan {
-  SELESAI
-  PROSES
-  GAGAL
+  Selesai
+  Proses
+  Gagal
 }
 
 model Pelapor {
@@ -1050,44 +1050,67 @@ model MenuTipsKeamanan {
 // ========================================= MENU EKONOMI ========================================= //
 // ========================================= PASAR DESA ========================================= //
 model PasarDesa {
-  id        String                       @id @default(uuid())
-  nama      String // contoh: "Kerupuk Babi"
-  harga     Int // disimpan dalam bentuk angka: 12000
-  satuan    String // contoh: "pcs", "1 kg"
-  alamat    String // contoh: "Jl. Kenari no.7"
-  image     FileStorage                  @relation(fields: [imageId], references: [id])
-  imageId   String
-  rating    Float // contoh: 4.9
-  createdAt DateTime                     @default(now())
-  updatedAt DateTime                     @updatedAt
-  deletedAt DateTime                     @default(now())
-  isActive  Boolean                      @default(true)
-  kategori  KategoriMakanan @relation(fields: [kategoriId], references: [id])
-  kategoriId String
+  id          String           @id @default(uuid())
+  nama        String
+  image       FileStorage?     @relation(fields: [imageId], references: [id])
+  imageId     String?
+  harga       Int
+  rating      Float
+  alamatUsaha String
+  kategori    KategoriProduk[] @relation("ProdukToKategori")
+  createdAt   DateTime         @default(now())
+  updatedAt   DateTime         @updatedAt
+  deletedAt   DateTime         @default(now())
+  isActive    Boolean          @default(true)
 }
 
-model KategoriMakanan {
-  id        String                       @id @default(uuid())
-  nama      String // contoh: "Makanan", "Bahan Bangunan", dll
-  createdAt DateTime                     @default(now())
-  updatedAt DateTime                     @updatedAt
-  deletedAt DateTime?
-  isActive  Boolean                      @default(true)
-  PasarDesa PasarDesa[]
+model KategoriProduk {
+  id        String      @id @default(uuid())
+  nama      String
+  produk    PasarDesa[] @relation("ProdukToKategori")
+  createdAt DateTime    @default(now())
+  updatedAt DateTime    @updatedAt
+  deletedAt DateTime    @default(now())
+  isActive  Boolean     @default(true)
 }
+
 // ========================================= LOWONGAN KERJA LOKAL ========================================= //
 model LowonganPekerjaan {
-  id          String    @id @default(uuid()) // ID unik untuk setiap lowongan
-  posisi      String    // Contoh: "Kasir"
-  namaPerusahaan String  // Contoh: "Toko Sumber Rejeki"
-  lokasi      String    // Contoh: "Desa Munggu , Badung"
-  tipePekerjaan String  // Contoh: "Full Time", "Part Time", "Contract"
-  gaji        String    // Contoh: "Rp. 2.500.000 / bulan". Menggunakan String karena formatnya bisa bervariasi
-  deskripsi   String   // Opsional: Detail deskripsi pekerjaan (tidak terlihat di UI ini, tapi umum ada)
-  kualifikasi String   // Opsional: Kualifikasi yang dibutuhkan (tidak terlihat di UI ini, tapi umum ada)
+  id             String   @id @default(uuid()) // ID unik untuk setiap lowongan
+  posisi         String // Contoh: "Kasir"
+  namaPerusahaan String // Contoh: "Toko Sumber Rejeki"
+  lokasi         String // Contoh: "Desa Munggu , Badung"
+  tipePekerjaan  String // Contoh: "Full Time", "Part Time", "Contract"
+  gaji           String // Contoh: "Rp. 2.500.000 / bulan". Menggunakan String karena formatnya bisa bervariasi
+  deskripsi      String // Opsional: Detail deskripsi pekerjaan (tidak terlihat di UI ini, tapi umum ada)
+  kualifikasi    String // Opsional: Kualifikasi yang dibutuhkan (tidak terlihat di UI ini, tapi umum ada)
   tanggalPosting DateTime @default(now()) // Tanggal lowongan diposting
-  isActive    Boolean   @default(true) // Menandakan apakah lowongan masih aktif
-  createdAt   DateTime  @default(now())
-  updatedAt   DateTime  @updatedAt
-  deletedAt   DateTime  @default(now())
+  isActive       Boolean  @default(true) // Menandakan apakah lowongan masih aktif
+  createdAt      DateTime @default(now())
+  updatedAt      DateTime @updatedAt
+  deletedAt      DateTime @default(now())
+}
+
+// ========================================= PROGRAM KEMISKINAN ========================================= //
+model ProgramKemiskinan {
+  id          String               @id @default(uuid())
+  nama        String
+  deskripsi   String
+  ikonUrl     String?
+  isActive    Boolean              @default(true)
+  // Tambahkan relasi one-to-one ke StatistikKemiskinan
+  statistikId String?              @unique // Foreign key ke StatistikKemiskinan, unique untuk one-to-one
+  statistik   StatistikKemiskinan? @relation(fields: [statistikId], references: [id])
+  createdAt   DateTime             @default(now())
+  updatedAt   DateTime             @updatedAt
+}
+
+model StatistikKemiskinan {
+  id                String             @id @default(uuid())
+  tahun             Int                @unique
+  jumlah            Int
+  // Tidak perlu foreign key di sini jika relasi di ProgramLayanan
+  programKemiskinan ProgramKemiskinan?
+  createdAt         DateTime           @default(now())
+  updatedAt         DateTime           @updatedAt
 }

prisma/seed.ts

@@ -17,6 +17,7 @@ import visiMisiDesa from "./data/desa/profile/visi_misi_desa.json";
 import lambangDesa from "./data/desa/profile/lambang_desa.json";
 import maskotDesa from "./data/desa/profile/maskot_desa.json";
 import profilPerbekel from "./data/desa/profile/profil_perbekel.json";
+import kategoriProduk from "./data/ekonomi/pasar-desa/kategori-produk.json";
 
 (async () => {
   for (const l of layanan) {
@@ -340,6 +341,22 @@ import profilPerbekel from "./data/desa/profile/profil_perbekel.json";
     });
   }
   console.log("dasar hukum PPID success ...");
+
+  for (const k of kategoriProduk) {
+    await prisma.kategoriProduk.upsert({
+      where: {
+        id: k.id,
+      },
+      update: {
+        nama: k.nama,
+      },
+      create: {
+        id: k.id,
+        nama: k.nama,
+      },
+    });
+  }
+  console.log("kategori produk success ...");
 })()
   .then(() => prisma.$disconnect())
   .catch((e) => {

src/app/admin/(dashboard)/_state/ekonomi/pasar-desa/pasar-desa.ts

@@ -4,32 +4,30 @@ import { toast } from "react-toastify";
 import { proxy } from "valtio";
 import { z } from "zod";
 
-const templateForm = z.object({
-  nama: z.string().min(3, "Nama minimal 3 karakter"),
+const templatePasarDesaForm = z.object({
+  nama: z.string().min(1, "Nama minimal 1 karakter"),
   harga: z.number().min(1, "Harga minimal 1"),
-  satuan: z.string().min(3, "Satuan minimal 3 karakter"),
-  alamat: z.string().min(3, "Alamat minimal 3 karakter"),
+  alamatUsaha: z.string().min(1, "Alamat minimal 1 karakter"),
   imageId: z.string().min(1, "Gambar wajib dipilih"),
   rating: z.number().min(1, "Rating minimal 1"),
-  kategoriId: z.string().min(1, "Kategori wajib dipilih"),
+  kategoriId: z.array(z.string()).min(1, "Minimal pilih satu kategori"),
 });
 
-const defaultForm = {
+const defaultPasarDesaForm = {
   nama: "",
   harga: 0,
-  satuan: "",
-  alamat: "",
+  alamatUsaha: "",
   imageId: "",
   rating: 0,
-  kategoriId: "",
+  kategoriId: [] as string[],
 };
 
-const pasarDesaState = proxy({
+const pasarDesa = proxy({
   create: {
-    form: { ...defaultForm },
+    form: { ...defaultPasarDesaForm },
     loading: false,
     async create() {
-      const cek = templateForm.safeParse(pasarDesaState.create.form);
+      const cek = templatePasarDesaForm.safeParse(pasarDesa.create.form);
       if (!cek.success) {
         const err = `[${cek.error.issues
           .map((v) => `${v.path.join(".")}`)
@@ -37,12 +35,12 @@ const pasarDesaState = proxy({
         return toast.error(err);
       }
       try {
-        pasarDesaState.create.loading = true;
+        pasarDesa.create.loading = true;
         const res = await ApiFetch.api.ekonomi.pasardesa["create"].post(
-          pasarDesaState.create.form
+          pasarDesa.create.form
         );
         if (res.status === 200) {
-          pasarDesaState.findMany.load();
+          pasarDesa.findMany.load();
           return toast.success("Data berhasil ditambahkan");
         }
         return toast.error("Gagal menambahkan data");
@@ -50,7 +48,7 @@ const pasarDesaState = proxy({
         console.log(error);
         toast.error("Gagal menambahkan data");
       } finally {
-        pasarDesaState.create.loading = false;
+        pasarDesa.create.loading = false;
       }
     },
   },
@@ -63,7 +61,7 @@ const pasarDesaState = proxy({
     async load() {
       const res = await ApiFetch.api.ekonomi.pasardesa["find-many"].get();
       if (res.status === 200) {
-        pasarDesaState.findMany.data = res.data?.data ?? [];
+        pasarDesa.findMany.data = res.data?.data ?? [];
       }
     },
   },
@@ -76,14 +74,14 @@ const pasarDesaState = proxy({
         const res = await fetch(`/api/ekonomi/pasardesa/${id}`);
         if (res.ok) {
           const data = await res.json();
-          pasarDesaState.findUnique.data = data.data ?? null;
+          pasarDesa.findUnique.data = data.data ?? null;
         } else {
           console.error("Failed to fetch data", res.status, res.statusText);
-          pasarDesaState.findUnique.data = null;
+          pasarDesa.findUnique.data = null;
         }
       } catch (error) {
         console.error("Error fetching data:", error);
-        pasarDesaState.findUnique.data = null;
+        pasarDesa.findUnique.data = null;
       }
     },
   },
@@ -93,7 +91,7 @@ const pasarDesaState = proxy({
       if (!id) return toast.warn("ID tidak valid");
 
       try {
-        pasarDesaState.delete.loading = true;
+        pasarDesa.delete.loading = true;
 
         const response = await fetch(`/api/ekonomi/pasardesa/del/${id}`, {
           method: "DELETE",
@@ -106,7 +104,7 @@ const pasarDesaState = proxy({
 
         if (response.ok && result?.success) {
           toast.success(result.message || "Pasar desa berhasil dihapus");
-          await pasarDesaState.findMany.load(); // refresh list
+          await pasarDesa.findMany.load(); // refresh list
         } else {
           toast.error(result?.message || "Gagal menghapus pasar desa");
         }
@@ -114,13 +112,218 @@ const pasarDesaState = proxy({
         console.error("Gagal delete:", error);
         toast.error("Terjadi kesalahan saat menghapus pasar desa");
       } finally {
-        pasarDesaState.delete.loading = false;
+        pasarDesa.delete.loading = false;
+      }
+    },
+  },
+  edit: {
+    id: "",
+    form: { ...defaultPasarDesaForm },
+    loading: false,
+
+    async load(id: string) {
+      if (!id) {
+        toast.warn("ID tidak valid");
+        return null;
+      }
+
+      try {
+        const response = await fetch(`/api/ekonomi/pasardesa/${id}`, {
+          method: "GET",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+        if (!response.ok) {
+          throw new Error(`HTTP error! status: ${response.status}`);
+        }
+        const result = await response.json();
+        if (result?.success) {
+          const data = result.data;
+          this.id = data.id;
+          this.form = {
+            nama: data.nama,
+            harga: data.harga,
+            alamatUsaha: data.alamatUsaha,
+            imageId: data.imageId,
+            rating: data.rating,
+            kategoriId: data.kategoriId,
+          };
+          return data;
+        } else {
+          throw new Error(result?.message || "Gagal memuat data");
+        }
+      } catch (error) {
+        console.error("Error loading pasar desa:", error);
+        toast.error(
+          error instanceof Error ? error.message : "Gagal memuat data"
+        );
+        return null;
+      }
+    },
+
+    async update() {
+      const cek = templatePasarDesaForm.safeParse(pasarDesa.edit.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        pasarDesa.edit.loading = true;
+        const response = await fetch(`/api/ekonomi/pasardesa/${this.id}`, {
+          method: "PUT",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({
+            nama: this.form.nama,
+            harga: this.form.harga,
+            alamatUsaha: this.form.alamatUsaha,
+            imageId: this.form.imageId,
+            rating: this.form.rating,
+            kategoriId: this.form.kategoriId,
+          }),
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(
+            errorData.message || `HTTP error! status: ${response.status}`
+          );
+        }
+        const result = await response.json();
+        if (result.success) {
+          toast.success("Berhasil update pasar desa");
+          await pasarDesa.findMany.load(); // refresh list
+          return true;
+        } else {
+          throw new Error(result.message || "Gagal mengupdate pasar desa");
+        }
+      } catch (error) {
+        console.error("Error updating pasar desa:", error);
+        toast.error(
+          error instanceof Error ? error.message : "Gagal mengupdate pasar desa"
+        );
+        return false;
+      } finally {
+        pasarDesa.edit.loading = false;
+      }
+    },
+    reset() {
+      pasarDesa.edit.id = "";
+      pasarDesa.edit.form = { ...defaultPasarDesaForm };
+    },
+  },
+});
+
+// ========================================= KATEGORI PRODUK ========================================= //
+const kategoriProdukForm = z.object({
+  nama: z.string().min(1, "Nama minimal 1 karakter"),
+});
+
+const kategoriProdukDefaultForm = {
+  nama: "",
+};
+
+const kategoriProduk = proxy({
+  create: {
+    form: { ...kategoriProdukDefaultForm },
+    loading: false,
+    async create() {
+      const cek = kategoriProdukForm.safeParse(kategoriProduk.create.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+      try {
+        kategoriProduk.create.loading = true;
+        const res = await ApiFetch.api.ekonomi.kategoriproduk["create"].post(
+          kategoriProduk.create.form
+        );
+        if (res.status === 200) {
+          kategoriProduk.findMany.load();
+          return toast.success("Data berhasil ditambahkan");
+        }
+        return toast.error("Gagal menambahkan data");
+      } catch (error) {
+        console.log(error);
+        toast.error("Gagal menambahkan data");
+      } finally {
+        kategoriProduk.create.loading = false;
+      }
+    },
+  },
+  findMany: {
+    data: null as Array<{
+      id: string;
+      nama: string;
+    }>
+      | null,
+    async load() {
+      const res = await ApiFetch.api.ekonomi.kategoriproduk["find-many"].get();
+      if (res.status === 200) {
+        kategoriProduk.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.KategoriProdukGetPayload<{
+      omit: { isActive: true };
+    }> | null,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/ekonomi/kategoriproduk/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          kategoriProduk.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          kategoriProduk.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        kategoriProduk.findUnique.data = null;
+      }
+    },
+  },
+  delete: {
+    loading: false,
+    async byId(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+
+      try {
+        kategoriProduk.delete.loading = true;
+
+        const response = await fetch(`/api/ekonomi/kategoriproduk/del/${id}`, {
+          method: "DELETE",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(result.message || "Kategori produk berhasil dihapus");
+          await kategoriProduk.findMany.load(); // refresh list
+        } else {
+          toast.error(result?.message || "Gagal menghapus kategori produk");
+        }
+      } catch (error) {
+        console.error("Gagal delete:", error);
+        toast.error("Terjadi kesalahan saat menghapus kategori produk");
+      } finally {
+        kategoriProduk.delete.loading = false;
       }
     },
   },
    edit: {
       id: "",
-      form: { ...defaultForm },
+      form: { ...kategoriProdukDefaultForm },
       loading: false,
   
       async load(id: string) {
@@ -130,7 +333,7 @@ const pasarDesaState = proxy({
         }
   
         try {
-          const response = await fetch(`/api/ekonomi/pasardesa/${id}`, {
+          const response = await fetch(`/api/ekonomi/kategoriproduk/${id}`, {
             method: "GET",
             headers: {
               "Content-Type": "application/json",
@@ -145,19 +348,13 @@ const pasarDesaState = proxy({
             this.id = data.id;
             this.form = {
               nama: data.nama,
-              harga: data.harga,
-              satuan: data.satuan,
-              alamat: data.alamat,
-              imageId: data.imageId,
-              rating: data.rating,
-              kategoriId: data.kategoriId,
             };
             return data;
           } else {
             throw new Error(result?.message || "Gagal memuat data");
           }
         } catch (error) {
-          console.error("Error loading pasar desa:", error);
+          console.error("Error loading kategori produk:", error);
           toast.error(
             error instanceof Error ? error.message : "Gagal memuat data"
           );
@@ -166,65 +363,83 @@ const pasarDesaState = proxy({
       },
   
       async update() {
-        const cek = templateForm.safeParse(pasarDesaState.edit.form);
+        const cek = kategoriProdukForm.safeParse(kategoriProduk.edit.form);
         if (!cek.success) {
           const err = `[${cek.error.issues
             .map((v) => `${v.path.join(".")}`)
             .join("\n")}] required`;
-          return toast.error(err);
+          toast.error(err);
+          return false;
         }
-  
+
         try {
-          pasarDesaState.edit.loading = true;
+          kategoriProduk.edit.loading = true;
           const response = await fetch(
-            `/api/ekonomi/pasardesa/${this.id}`,
+            `/api/ekonomi/kategoriproduk/${kategoriProduk.edit.id}`,
             {
               method: "PUT",
               headers: {
                 "Content-Type": "application/json",
               },
               body: JSON.stringify({
-                nama: this.form.nama,
-                harga: this.form.harga,
-                satuan: this.form.satuan,
-                alamat: this.form.alamat,
-                imageId: this.form.imageId,
-                rating: this.form.rating,
-                kategoriId: this.form.kategoriId,
+                nama: kategoriProduk.edit.form.nama,
               }),
             }
           );
-          if (!response.ok) {
-            const errorData = await response.json().catch(() => ({}));
-            throw new Error(
-              errorData.message || `HTTP error! status: ${response.status}`
-            );
-          }
-          const result = await response.json();
-          if (result.success) {
-            toast.success("Berhasil update pasar desa");
-            await pasarDesaState.findMany.load(); // refresh list
-            return true;
-          } else {
-            throw new Error(result.message || "Gagal mengupdate pasar desa");
+          
+          // Clone the response to avoid 'body already read' error
+          const responseClone = response.clone();
+          
+          try {
+            const result = await response.json();
+            
+            if (!response.ok) {
+              console.error('Update failed with status:', response.status, 'Response:', result);
+              throw new Error(
+                result?.message || `Gagal mengupdate kategori produk (${response.status})`
+              );
+            }
+            
+            if (result.success) {
+              toast.success(result.message || "Berhasil memperbarui kategori produk");
+              await kategoriProduk.findMany.load(); // refresh list
+              return true;
+            } else {
+              throw new Error(result.message || "Gagal mengupdate kategori produk");
+            }
+          } catch (error) {
+            // If JSON parsing fails, try to get the response text for better error messages
+            try {
+              const text = await responseClone.text();
+              console.error('Error response text:', text);
+              throw new Error(`Gagal memproses respons dari server: ${text}`);
+            } catch (textError) {
+              console.error('Error parsing response as text:', textError);
+              console.error('Original error:', error);
+              throw new Error('Gagal memproses respons dari server');
+            }
           }
         } catch (error) {
-          console.error("Error updating pasar desa:", error);
+          console.error("Error updating kategori produk:", error);
           toast.error(
             error instanceof Error
               ? error.message
-              : "Gagal mengupdate pasar desa"
+              : "Gagal mengupdate kategori produk"
           );
           return false;
         } finally {
-          pasarDesaState.edit.loading = false;
+          kategoriProduk.edit.loading = false;
         }
       },
       reset() {
-        pasarDesaState.edit.id = "";
-        pasarDesaState.edit.form = { ...defaultForm };
+        kategoriProduk.edit.id = "";
+        kategoriProduk.edit.form = { ...kategoriProdukDefaultForm };
       },
     },
 });
 
+const pasarDesaState = proxy({
+  pasarDesa,
+  kategoriProduk
+});
 export default pasarDesaState;

src/app/admin/(dashboard)/_state/ekonomi/program-kemiskinan.ts

@@ -0,0 +1,249 @@
+import ApiFetch from "@/lib/api-fetch";
+import { Prisma } from "@prisma/client";
+import { toast } from "react-toastify";
+import { proxy } from "valtio";
+import { z } from "zod";
+
+const templateForm = z.object({
+  nama: z.string().min(1, "Nama minimal 1 karakter"),
+  deskripsi: z.string().min(1, "Deskripsi minimal 1 karakter"),
+  ikonUrl: z.string().optional(),
+  statistik: z.object({
+    tahun: z.string().min(1, "Tahun minimal 1 karakter"),
+    jumlah: z.string().min(1, "Jumlah minimal 1 karakter"),
+  })
+    
+});
+
+const defaultForm = {
+  nama: "",
+  deskripsi: "",
+  ikonUrl: "",
+  statistik: {
+    tahun: "",
+    jumlah: ""
+  }
+};
+
+const programKemiskinanState = proxy({
+  create: {
+    form: { ...defaultForm },
+    loading: false,
+    async create() {
+      const cek = templateForm.safeParse(programKemiskinanState.create.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        programKemiskinanState.create.loading = true;
+        const res = await ApiFetch.api.ekonomi.programkemiskinan["create"].post(
+          programKemiskinanState.create.form
+        );
+        if (res.status === 200) {
+          programKemiskinanState.findMany.load();
+          return toast.success("success create");
+        }
+        console.log(res);
+        return toast.error("failed create");
+      } catch (error) {
+        console.log(error);
+        return toast.error("failed create");
+      } finally {
+        programKemiskinanState.create.loading = false;
+      }
+    },
+  },
+  findMany: {
+    data: [] as Prisma.ProgramKemiskinanGetPayload<{
+      include: {
+        statistik: true;
+      };
+    }>[],
+    loading: false,
+    async load() {
+      const res = await ApiFetch.api.ekonomi.programkemiskinan[
+        "find-many"
+      ].get();
+      if (res.status === 200) {
+        programKemiskinanState.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.ProgramKemiskinanGetPayload<{
+      include: {
+        statistik: true;
+      };
+    }> | null,
+    loading: false,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/ekonomi/programkemiskinan/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          programKemiskinanState.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          programKemiskinanState.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        programKemiskinanState.findUnique.data = null;
+      }
+    },
+  },
+  update: {
+    id: "",
+    form: { ...defaultForm },
+    loading: false,
+    async load(id: string) {
+      if (!id) {
+        toast.warn("ID tidak valid");
+        return null;
+      }
+
+      try {
+        const response = await fetch(`/api/ekonomi/programkemiskinan/${id}`, {
+          method: "GET",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+        if (!response.ok) {
+          throw new Error(`HTTP error! status: ${response.status}`);
+        }
+
+        const result = await response.json();
+
+        if (result?.success) {
+          const data = result.data;
+          this.id = data.id;
+          this.form = {
+            nama: data.nama,
+            deskripsi: data.deskripsi,
+            ikonUrl: data.ikonUrl || "",
+            statistik: {
+              tahun: data.statistik.tahun,
+              jumlah: data.statistik.jumlah,
+            },
+          };
+          return data; // Return the loaded data
+        } else {
+          throw new Error(result?.message || "Gagal memuat data");
+        }
+      } catch (error) {
+        console.error("Error loading program kemiskinan:", error);
+        toast.error(
+          error instanceof Error ? error.message : "Gagal memuat data"
+        );
+        return null;
+      }
+    },
+    async update() {
+      const cek = templateForm.safeParse(programKemiskinanState.update.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        toast.error(err);
+        return false;
+      }
+
+      try {
+        programKemiskinanState.update.loading = true;
+
+        const response = await fetch(
+          `/api/ekonomi/programkemiskinan/${this.id}`,
+          {
+            method: "PUT",
+            headers: {
+              "Content-Type": "application/json",
+            },
+            body: JSON.stringify({
+              nama: this.form.nama,
+              deskripsi: this.form.deskripsi,
+              ikonUrl: this.form.ikonUrl,
+              statistik: {
+                tahun: this.form.statistik.tahun,
+                jumlah: this.form.statistik.jumlah,
+              },
+            }),
+          }
+        );
+
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(
+            errorData.message || `HTTP error! status: ${response.status}`
+          );
+        }
+
+        const result = await response.json();
+
+        if (result.success) {
+          toast.success("Berhasil update program kemiskinan");
+          await programKemiskinanState.findMany.load(); // refresh list
+          return true;
+        } else {
+          throw new Error(result.message || "Gagal update program kemiskinan");
+        }
+      } catch (error) {
+        console.error("Error updating program kemiskinan:", error);
+        toast.error(
+          error instanceof Error
+            ? error.message
+            : "Terjadi kesalahan saat update program kemiskinan"
+        );
+        return false;
+      } finally {
+        programKemiskinanState.update.loading = false;
+      }
+    },
+    reset() {
+      programKemiskinanState.update.id = "";
+      programKemiskinanState.update.form = { ...defaultForm };
+    },
+  },
+  delete: {
+    loading: false,
+    async delete(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+
+      try {
+        programKemiskinanState.delete.loading = true;
+
+        const response = await fetch(
+          `/api/ekonomi/programkemiskinan/del/${id}`,
+          {
+            method: "DELETE",
+            headers: {
+              "Content-Type": "application/json",
+            },
+          }
+        );
+
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(
+            result.message || "Program kemiskinan berhasil dihapus"
+          );
+          await programKemiskinanState.findMany.load(); // refresh list
+        } else {
+          toast.error(result?.message || "Gagal menghapus program kemiskinan");
+        }
+      } catch (error) {
+        console.error("Gagal delete:", error);
+        toast.error("Terjadi kesalahan saat menghapus program kemiskinan");
+      } finally {
+        programKemiskinanState.delete.loading = false;
+      }
+    },
+  },
+});
+
+export default programKemiskinanState;

src/app/admin/(dashboard)/_state/keamanan/keamanan-lingkungan.ts

@@ -179,17 +179,20 @@ const keamananLingkunganState = proxy({
       try {
         keamananLingkunganState.edit.loading = true;
 
-        const response = await fetch(`/api/keamanan/keamananlingkungan/${this.id}`, {
-          method: "PUT",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify({
-            name: this.form.name,
-            deskripsi: this.form.deskripsi,
-            imageId: this.form.imageId,
-          }),
-        });
+        const response = await fetch(
+          `/api/keamanan/keamananlingkungan/${this.id}`,
+          {
+            method: "PUT",
+            headers: {
+              "Content-Type": "application/json",
+            },
+            body: JSON.stringify({
+              name: this.form.name,
+              deskripsi: this.form.deskripsi,
+              imageId: this.form.imageId,
+            }),
+          }
+        );
 
         if (!response.ok) {
           const errorData = await response.json().catch(() => ({}));

src/app/admin/(dashboard)/_state/keamanan/laporan-publik.ts

@@ -0,0 +1,273 @@
+import ApiFetch from "@/lib/api-fetch";
+import { Prisma } from "@prisma/client";
+import { toast } from "react-toastify";
+import { proxy } from "valtio";
+import { z } from "zod";
+
+export type Status = "Selesai" | "Proses" | "Gagal";
+
+const templateForm = z.object({
+  judul: z.string().min(3, "Judul minimal 3 karakter"),
+  lokasi: z.string().min(3, "Lokasi minimal 3 karakter"),
+  tanggalWaktu: z.string().min(3, "Tanggal Waktu minimal 3 karakter"),
+  status: z.enum(["Selesai", "Proses", "Gagal"]),
+  penanganan: z.string(),
+  kronologi: z.string().optional(),
+});
+
+interface FormData {
+  judul: string;
+  lokasi: string;
+  tanggalWaktu: string;
+  status: Status;
+  penanganan: string;
+  kronologi: string;
+}
+
+const defaultForm: FormData = {
+  judul: "",
+  lokasi: "",
+  tanggalWaktu: new Date().toISOString(),
+  status: "Proses",
+  penanganan: "",
+  kronologi: "",
+};
+
+const laporanPublikState = proxy({
+  create: {
+    form: { ...defaultForm },
+    loading: false,
+    async create() {
+      const cek = templateForm.safeParse(laporanPublikState.create.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        laporanPublikState.create.loading = true;
+        
+        // Ensure we have a valid date
+        if (!laporanPublikState.create.form.tanggalWaktu) {
+          return toast.error("Tanggal laporan harus diisi");
+        }
+        
+        // Format the data before sending
+        const formData = {
+          ...laporanPublikState.create.form,
+          // Ensure the date is in the correct format for the API
+          tanggalWaktu: new Date(laporanPublikState.create.form.tanggalWaktu).toISOString()
+        };
+        
+        console.log("Sending form data:", formData); // Debug log
+        
+        const res = await ApiFetch.api.keamanan.laporanpublik["create"].post(
+          formData
+        );
+        
+        if (res.error) {
+          console.error("API Error:", res.error);
+          throw new Error("Failed to create laporan publik");
+        }
+        
+        if (res.status === 200) {
+          laporanPublikState.findMany.load();
+          return toast.success("success create");
+        }
+        
+        console.log(res);
+        return toast.error("failed create");
+      } catch (error) {
+        console.error("Error creating laporan publik:", error);
+        toast.error(error instanceof Error ? error.message : "Gagal membuat laporan publik");
+        throw error; // Re-throw to be handled by the caller
+      } finally {
+        laporanPublikState.create.loading = false;
+      }
+    },
+    resetForm() {
+      laporanPublikState.create.form = { ...defaultForm };
+    },
+  },
+  findMany: {
+    data: null as
+      | Prisma.LaporanPublikGetPayload<{
+          include: { penanganan: true };
+        }>[]
+      | null,
+    async load() {
+      const res = await ApiFetch.api.keamanan.laporanpublik["find-many"].get();
+      if (res.status === 200) {
+        laporanPublikState.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.LaporanPublikGetPayload<{
+      include: { penanganan: true };
+    }> | null,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/keamanan/laporanpublik/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          laporanPublikState.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          laporanPublikState.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        laporanPublikState.findUnique.data = null;
+      }
+    },
+    resetForm() {
+      laporanPublikState.findUnique.data = null;
+    },
+  },
+  delete: {
+    loading: false,
+    async byId(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+
+      try {
+        laporanPublikState.delete.loading = true;
+        const response = await fetch(`/api/keamanan/laporanpublik/del/${id}`, {
+          method: "DELETE",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(
+            result.message || "Laporan publik berhasil dihapus"
+          );
+          await laporanPublikState.findMany.load(); // refresh list
+        } else {
+          toast.error(result?.message || "Gagal menghapus laporan publik");
+        }
+      } catch (error) {
+        console.error("Gagal delete:", error);
+        toast.error("Terjadi kesalahan saat menghapus laporan publik");
+      } finally {
+        laporanPublikState.delete.loading = false;
+      }
+    },
+  },
+  edit: {
+    id: "",
+    form: { ...defaultForm },
+    loading: false,
+    async load(id: string) {
+      if (!id) {
+        toast.warn("ID tidak valid");
+        return null;
+      }
+
+      try {
+        const response = await fetch(`/api/keamanan/laporanpublik/${id}`, {
+          method: "GET",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+     if (!response.ok) {
+               throw new Error(`HTTP error! status: ${response.status}`);
+             }
+     
+             const result = await response.json();
+     
+             if (result?.success) {
+               const data = result.data;
+               this.id = data.id;
+               this.form = {
+                 judul: data.judul,
+                 lokasi: data.lokasi,
+                 tanggalWaktu: data.tanggalWaktu,
+                 status: data.status,
+                 penanganan: data.penanganan,
+                 kronologi: data.kronologi,
+               };
+               return data; // Return the loaded data
+             } else {
+               throw new Error(result?.message || "Gagal memuat data");
+             }
+           } catch (error) {
+             console.error("Error loading keamanan lingkungan:", error);
+             toast.error(
+               error instanceof Error ? error.message : "Gagal memuat data"
+             );
+             return null;
+           }
+         },
+     
+         async update() {
+           const cek = templateForm.safeParse(laporanPublikState.edit.form);
+           if (!cek.success) {
+             const err = `[${cek.error.issues
+               .map((v) => `${v.path.join(".")}`)
+               .join("\n")}] required`;
+             toast.error(err);
+             return false;
+           }
+     
+           try {
+             laporanPublikState.edit.loading = true;
+     
+             const response = await fetch(
+               `/api/keamanan/laporanpublik/${this.id}`,
+               {
+                 method: "PUT",
+                 headers: {
+                   "Content-Type": "application/json",
+                 },
+                 body: JSON.stringify({
+                   judul: this.form.judul,
+                   lokasi: this.form.lokasi,
+                   tanggalWaktu: this.form.tanggalWaktu,
+                   status: this.form.status,
+                   penanganan: this.form.penanganan,
+                   kronologi: this.form.kronologi,
+                 }),
+               }
+             );
+     
+             if (!response.ok) {
+               const errorData = await response.json().catch(() => ({}));
+               throw new Error(
+                 errorData.message || `HTTP error! status: ${response.status}`
+               );
+             }
+     
+             const result = await response.json();
+     
+             if (result.success) {
+               toast.success("Berhasil update laporan publik");
+               await laporanPublikState.findMany.load(); // refresh list
+               return true;
+             } else {
+               throw new Error(result.message || "Gagal update laporan publik");
+             }
+           } catch (error) {
+             console.error("Error updating laporan publik:", error);
+             toast.error(
+               error instanceof Error
+                 ? error.message
+                 : "Terjadi kesalahan saat update laporan publik"
+             );
+             return false;
+           } finally {
+             laporanPublikState.edit.loading = false;
+           }
+         },
+         reset() {
+           laporanPublikState.edit.id = "";
+           laporanPublikState.edit.form = { ...defaultForm };
+         },
+  }
+});
+export default laporanPublikState;

src/app/admin/(dashboard)/ekonomi/pasar-desa/_lib/layoutTabs.tsx

@@ -12,12 +12,12 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
         {
             label: "Produk Pasar Desa",
             value: "produkpasardesa",
-            href: "/admin/ekonomi/pasar-desa/pasar-desa-ui"
+            href: "/admin/ekonomi/pasar-desa/produk-pasar-desa"
         },
         {
-            label: "Kategori Makanan",
-            value: "kategorimakanan",
-            href: "/admin/ekonomi/pasar-desa/kategori-makanan"
+            label: "Kategori Produk",
+            value: "kategoriproduk",
+            href: "/admin/ekonomi/pasar-desa/kategori-produk"
         },
     ];
     const curentTab = tabs.find(tab => tab.href === pathname)

src/app/admin/(dashboard)/ekonomi/pasar-desa/kategori-makanan/[id]/edit/page.tsx

@@ -1,11 +0,0 @@
-import React from 'react';
-
-function Page() {
-  return (
-    <div>
-      Page
-    </div>
-  );
-}
-
-export default Page;

src/app/admin/(dashboard)/ekonomi/pasar-desa/kategori-makanan/[id]/page.tsx

@@ -1,11 +0,0 @@
-import React from 'react';
-
-function Page() {
-  return (
-    <div>
-      Page
-    </div>
-  );
-}
-
-export default Page;

src/app/admin/(dashboard)/ekonomi/pasar-desa/kategori-makanan/create/page.tsx

@@ -1,11 +0,0 @@
-import React from 'react';
-
-function Page() {
-  return (
-    <div>
-      Page
-    </div>
-  );
-}
-
-export default Page;

src/app/admin/(dashboard)/ekonomi/pasar-desa/kategori-produk/[id]/page.tsx

@@ -0,0 +1,98 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import React, { useEffect, useState } from 'react';
+import { useParams, useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import pasarDesaState from '../../../../_state/ekonomi/pasar-desa/pasar-desa';
+import colors from '@/con/colors';
+import { Box, Button, Paper, Stack, Title, TextInput, Group, Text } from '@mantine/core';
+import { IconArrowBack } from '@tabler/icons-react';
+import { toast } from 'react-toastify';
+
+function EditKategoriProduk() {
+  const router = useRouter();
+  const params = useParams();
+  const id = params?.id as string;
+  const statePasar = useProxy(pasarDesaState.kategoriProduk);
+
+  const [formData, setFormData] = useState({
+    nama: "",
+  });
+
+  useEffect(() => {
+    const loadKategoriProduk = async () => {
+      if (!id) return;
+
+      try {
+        const data = await statePasar.edit.load(id);
+
+        if (data) {
+          // pastikan id-nya masuk ke state edit
+          statePasar.edit.id = id;
+          setFormData({
+            nama: data.nama || '',
+          });
+        }
+      } catch (error) {
+        console.error("Error loading kategori produk:", error);
+        toast.error("Gagal memuat data kategori produk");
+      }
+    };
+
+    loadKategoriProduk();
+  }, [id]);
+
+  const handleSubmit = async () => {
+    try {
+      if (!formData.nama.trim()) {
+        toast.error('Nama kategori produk tidak boleh kosong');
+        return;
+      }
+
+      statePasar.edit.form = {
+        nama: formData.nama.trim(),
+      };
+
+      // Safety check tambahan: pastikan ID tidak kosong
+      if (!statePasar.edit.id) {
+        statePasar.edit.id = id; // fallback
+      }
+
+      const success = await statePasar.edit.update();
+
+      if (success) {
+        router.push("/admin/ekonomi/pasar-desa/kategori-produk");
+      }
+    } catch (error) {
+      console.error("Error updating kategori produk:", error);
+      // toast akan ditampilkan dari fungsi update
+    }
+  };
+
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
+        <Stack gap={"xs"}>
+          <Title order={4}>Edit Kategori Produk</Title>
+          <TextInput
+            value={formData.nama}
+            onChange={(e) => setFormData({ ...formData, nama: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Nama Kategori Produk</Text>}
+            placeholder='Masukkan nama kategori produk'
+          />
+          <Group>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditKategoriProduk;

src/app/admin/(dashboard)/ekonomi/pasar-desa/kategori-produk/create/page.tsx

@@ -0,0 +1,61 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import React, { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import pasarDesaState from '../../../../_state/ekonomi/pasar-desa/pasar-desa';
+import colors from '@/con/colors';
+import { Box, Button, Paper, Stack, Title, TextInput, Group, Text } from '@mantine/core';
+import { IconArrowBack } from '@tabler/icons-react';
+
+function CreateKategoriProduk() {
+  const router = useRouter();
+  const statePasar = useProxy(pasarDesaState.kategoriProduk)
+
+  useEffect(() => {
+    statePasar.findMany.load();
+  }, []);
+
+  const resetForm = () => {
+    statePasar.create.form = {
+      nama: "",
+    };
+  }
+
+  const handleSubmit = async () => {
+    await statePasar.create.create();
+    resetForm();
+    router.push("/admin/ekonomi/pasar-desa/kategori-produk")
+  }
+
+  return (
+    <Box>
+      <Box>
+        <Box mb={10}>
+          <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
+            <IconArrowBack color={colors['blue-button']} size={25} />
+          </Button>
+        </Box>
+
+        <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
+          <Stack gap={"xs"}>
+            <Title order={4}>Create Kategori Produk</Title>
+            <TextInput
+              value={statePasar.create.form.nama}
+              onChange={(val) => {
+                statePasar.create.form.nama = val.target.value;
+              }}
+              label={<Text fw={"bold"} fz={"sm"}>Nama Kategori Produk</Text>}
+              placeholder='Masukkan nama kategori produk'
+            />
+            <Group>
+              <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
+            </Group>
+          </Stack>
+        </Paper>
+      </Box>
+    </Box>
+  );
+}
+
+export default CreateKategoriProduk;

src/app/admin/(dashboard)/ekonomi/pasar-desa/kategori-produk/page.tsx

@@ -1,19 +1,21 @@
 'use client'
 import colors from '@/con/colors';
 import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
-import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
 import { useShallowEffect } from '@mantine/hooks';
+import { IconEdit, IconSearch, IconX } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
+import { useState } from 'react';
 import { useProxy } from 'valtio/utils';
 import HeaderSearch from '../../../_com/header';
 import JudulList from '../../../_com/judulList';
+import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
 import pasarDesaState from '../../../_state/ekonomi/pasar-desa/pasar-desa';
 
 function PasarDesa() {
   return (
     <Box>
       <HeaderSearch
-        title='Kategori Makanan'
+        title='Kategori Produk'
         placeholder='pencarian'
         searchIcon={<IconSearch size={20} />}
       />
@@ -23,13 +25,24 @@ function PasarDesa() {
 }
 
 function ListPasarDesa() {
-  const statePasar = useProxy(pasarDesaState)
-  const router = useRouter();
+  const statePasar = useProxy(pasarDesaState.kategoriProduk)
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  // const params = useParams()
+  const router = useRouter()
 
   useShallowEffect(() => {
     statePasar.findMany.load()
   }, [])
 
+  const handleHapus = () => {
+    if (selectedId) {
+      statePasar.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+    }
+  }
+
   if (!statePasar.findMany.data) {
     return (
       <Stack py={10}>
@@ -43,28 +56,31 @@ function ListPasarDesa() {
       <Paper bg={colors['white-1']} p={'md'}>
         <JudulList
           title='List Produk Pasar Desa'
-          href='/admin/ekonomi/pasar-desa/create'
+          href='/admin/ekonomi/pasar-desa/kategori-produk/create'
         />
         <Table striped withTableBorder withRowBorders>
           <TableThead>
             <TableTr>
-              <TableTh>Nama Produk</TableTh>
-              <TableTh>Harga Produk</TableTh>
-              <TableTh>Rating Produk</TableTh>
-              <TableTh>Alamat Usaha</TableTh>
-              <TableTh>Detail</TableTh>
+              <TableTh>Nama Kategori</TableTh>
+              <TableTh>Edit</TableTh>
+              <TableTh>Delete</TableTh>
             </TableTr>
           </TableThead>
           <TableTbody>
             {statePasar.findMany.data?.map((item) => (
               <TableTr key={item.id}>
                 <TableTd>{item.nama}</TableTd>
-                <TableTd>{item.harga}</TableTd>
-                <TableTd>{item.rating}</TableTd>
-                <TableTd>{item.alamat}</TableTd>
                 <TableTd>
-                  <Button onClick={() => router.push(`/admin/ekonomi/pasar-desa/${item.id}`)}>
-                    <IconDeviceImac size={20} />
+                  <Button onClick={() => router.push(`/admin/ekonomi/pasar-desa/kategori-produk/${item.id}`)}>
+                    <IconEdit size={20} />
+                  </Button>
+                </TableTd>
+                <TableTd>
+                  <Button color="red" onClick={() => {
+                    setSelectedId(item.id)
+                    setModalHapus(true)
+                  }}>
+                    <IconX size={20} />
                   </Button>
                 </TableTd>
               </TableTr>
@@ -72,6 +88,13 @@ function ListPasarDesa() {
           </TableTbody>
         </Table>
       </Paper>
+      {/* Modal Konfirmasi Hapus */}
+      <ModalKonfirmasiHapus
+        opened={modalHapus}
+        onClose={() => setModalHapus(false)}
+        onConfirm={handleHapus}
+        text='Apakah anda yakin ingin menghapus kategori produk ini?'
+      />
     </Box>
   );
 }

src/app/admin/(dashboard)/ekonomi/pasar-desa/pasar-desa-ui/create/page.tsx

@@ -1,56 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-import { KeamananEditor } from '../../../../keamanan/_com/keamananEditor';
-
-function CreatePasarDesa() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
-        </Button>
-      </Box>
-
-      <Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
-        <Stack gap={"xs"}>
-          <Title order={4}>Create Pasar Desa</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Produk</Text>}
-          placeholder='Masukkan nama produk'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Harga Produk</Text>}
-          placeholder='Masukkan harga produk'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Rating Produk</Text>}
-          placeholder='Masukkan rating produk'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
-          placeholder='Masukkan alamat usaha'
-          />
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Produk</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
-          </Box>
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default CreatePasarDesa;

src/app/admin/(dashboard)/ekonomi/pasar-desa/pasar-desa-ui/detail/page.tsx

@@ -1,74 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
-import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-import React from 'react';
-// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
-
-function DetailPasarDesa() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button variant="subtle" onClick={() => router.back()}>
-          <IconArrowBack color={colors['blue-button']} size={25} />
-        </Button>
-      </Box>
-      <Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
-        <Stack>
-          <Text fz={"xl"} fw={"bold"}>Detail Pasar Desa</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Nama Produk</Text>
-                <Text fz={"lg"}>Test Judul</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Harga Produk</Text>
-                <Text fz={"lg"}>Rp. 20.000</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Rating Produk</Text>
-                <Text fz={"lg"}>5</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Alamat Usaha</Text>
-                <Text fz={"lg"}>Jalan In Aja</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Gambar</Text>
-                <Image src={"/"} alt="gambar" />
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
-                <Text fz={"lg"} >Test Konten</Text>
-              </Box>
-              <Box>
-                <Flex gap={"xs"}>
-                  <Button color="red">
-                    <IconX size={20} />
-                  </Button>
-                  <Button onClick={() => router.push('/admin/ekonomi/pasar-desa/edit')} color="green">
-                    <IconEdit size={20} />
-                  </Button>
-                </Flex>
-              </Box>
-            </Stack>
-          </Paper>
-        </Stack>
-      </Paper>
-
-      {/* Modal Hapus
-      <ModalKonfirmasiHapus
-        opened={modalHapus}
-        onClose={() => setModalHapus(false)}
-        onConfirm={handleHapus}
-        text="Apakah anda yakin ingin menghapus potensi ini?"
-      /> */}
-    </Box>
-  );
-}
-
-export default DetailPasarDesa;

src/app/admin/(dashboard)/ekonomi/pasar-desa/pasar-desa-ui/edit/page.tsx

@@ -1,56 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-import { KeamananEditor } from '../../../../keamanan/_com/keamananEditor';
-
-function EditPasarDesa() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
-        </Button>
-      </Box>
-
-      <Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
-        <Stack gap={"xs"}>
-          <Title order={4}>Edit Pasar Desa</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Produk</Text>}
-          placeholder='Masukkan nama produk'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Harga Produk</Text>}
-          placeholder='Masukkan harga produk'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Rating Produk</Text>}
-          placeholder='Masukkan rating produk'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
-          placeholder='Masukkan alamat usaha'
-          />
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Produk</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
-          </Box>
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditPasarDesa;

src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/[id]/edit/page.tsx

@@ -0,0 +1,223 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import pasarDesaState from '@/app/admin/(dashboard)/_state/ekonomi/pasar-desa/pasar-desa';
+import colors from '@/con/colors';
+import ApiFetch from '@/lib/api-fetch';
+import { Box, Button, Group, Image, MultiSelect, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
+import { Dropzone } from '@mantine/dropzone';
+import { IconArrowBack, IconPhoto, IconUpload, IconX } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
+
+function EditPasarDesa() {
+  const pasarState = useProxy(pasarDesaState)
+  const router = useRouter();
+  const params = useParams();
+
+  const [previewImage, setPreviewImage] = useState<string | null>(null);
+  const [file, setFile] = useState<File | null>(null);
+  const [formData, setFormData] = useState({
+    nama: pasarState.pasarDesa.edit.form.nama || "",
+    harga: pasarState.pasarDesa.edit.form.harga || 0,
+    alamatUsaha: pasarState.pasarDesa.edit.form.alamatUsaha || "",
+    imageId: pasarState.pasarDesa.edit.form.imageId || "",
+    rating: pasarState.pasarDesa.edit.form.rating || 0,
+    kategoriId: pasarState.pasarDesa.edit.form.kategoriId || [],
+  })
+
+  useEffect(() => {
+    pasarState.kategoriProduk.findMany.load();
+    const loadPasarDesa = async () => {
+      const id = params?.id as string;
+      if (!id) return;
+
+      try {
+        const data = await pasarState.pasarDesa.edit.load(id);
+        if (data) {
+          setFormData({
+            nama: data.nama || "",
+            harga: data.harga || 0,
+            alamatUsaha: data.alamatUsaha || "",
+            imageId: data.imageId || "",
+            rating: data.rating || 0,
+            kategoriId: data.kategori?.map((k: any) => k.nama) || [],
+          });
+          // Tampilkan preview gambar
+          if (data.image?.link) {
+            setPreviewImage(data.image.link);
+          }
+        }
+      } catch (error) {
+        console.error("Error loading pasar desa:", error);
+        toast.error(
+          error instanceof Error ? error.message : "Gagal mengambil data pasar desa"
+        );
+      }
+    }
+
+    loadPasarDesa();
+  }, [params?.id]);
+
+  const handleSubmit = async () => {
+    try {
+      pasarState.pasarDesa.edit.form = {
+        ...pasarState.pasarDesa.edit.form,
+        nama: formData.nama,
+        harga: formData.harga,
+        alamatUsaha: formData.alamatUsaha,
+        imageId: formData.imageId,
+        rating: formData.rating,
+        kategoriId: formData.kategoriId,
+      }
+      if (file) {
+        const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
+        const uploaded = res.data?.data;
+
+        if (!uploaded?.id) {
+          return toast.error("Gagal upload gambar");
+        }
+
+        // Update imageId in global state
+        pasarState.pasarDesa.edit.form.imageId = uploaded.id;
+      }
+
+      await pasarState.pasarDesa.edit.update();
+      toast.success("Tips Keamanan berhasil diperbarui!");
+      router.push("/admin/ekonomi/pasar-desa/produk-pasar-desa");
+    } catch (error) {
+      console.error("Error updating pasar desa:", error);
+      toast.error("Terjadi kesalahan saat memperbarui pasar desa");
+    }
+  };
+
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
+        <Stack gap={"xs"}>
+          <Title order={4}>Edit Pasar Desa</Title>
+          <Box>
+            <Text fz={"md"} fw={"bold"}>Gambar</Text>
+            <Box>
+              <Dropzone
+                onDrop={(files) => {
+                  const selectedFile = files[0]; // Ambil file pertama
+                  if (selectedFile) {
+                    setFile(selectedFile);
+                    setPreviewImage(URL.createObjectURL(selectedFile)); // Buat preview
+                  }
+                }}
+                onReject={() => toast.error('File tidak valid.')}
+                maxSize={5 * 1024 ** 2} // Maks 5MB
+                accept={{ 'image/*': [] }}
+              >
+                <Group justify="center" gap="xl" mih={220} style={{ pointerEvents: 'none' }}>
+                  <Dropzone.Accept>
+                    <IconUpload size={52} color="var(--mantine-color-blue-6)" stroke={1.5} />
+                  </Dropzone.Accept>
+                  <Dropzone.Reject>
+                    <IconX size={52} color="var(--mantine-color-red-6)" stroke={1.5} />
+                  </Dropzone.Reject>
+                  <Dropzone.Idle>
+                    <IconPhoto size={52} color="var(--mantine-color-dimmed)" stroke={1.5} />
+                  </Dropzone.Idle>
+
+                  <div>
+                    <Text size="xl" inline>
+                      Drag gambar ke sini atau klik untuk pilih file
+                    </Text>
+                    <Text size="sm" c="dimmed" inline mt={7}>
+                      Maksimal 5MB dan harus format gambar
+                    </Text>
+                  </div>
+                </Group>
+              </Dropzone>
+
+              {/* Tampilkan preview kalau ada */}
+              {previewImage && (
+                <Box mt="sm">
+                  <Image
+                    src={previewImage}
+                    alt="Preview"
+                    style={{
+                      maxWidth: '100%',
+                      maxHeight: '200px',
+                      objectFit: 'contain',
+                      borderRadius: '8px',
+                      border: '1px solid #ddd',
+                    }}
+                  />
+                </Box>
+              )}
+
+            </Box>
+          </Box>
+          <TextInput
+            value={formData.nama}
+            onChange={(e) => setFormData({ ...formData, nama: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Nama Produk</Text>}
+            placeholder='Masukkan nama produk'
+          />
+          <TextInput
+            value={formData.harga}
+            onChange={(e) => setFormData({ ...formData, harga: Number(e.target.value) })}
+            label={<Text fw={"bold"} fz={"sm"}>Harga Produk</Text>}
+            placeholder='Masukkan harga produk'
+          />
+          <TextInput
+            type="number"
+            min={0}
+            max={5}
+            step={0.1} // bisa pakai 0.1 biar support desimal
+            value={formData.rating}
+            onChange={(e) => setFormData({ ...formData, rating: Number(e.target.value) })}
+            label={<Text fw={"bold"} fz={"sm"}>Rating Produk</Text>}
+            placeholder='Masukkan rating produk (0-5)'
+          />
+
+          <TextInput
+            value={formData.alamatUsaha}
+            onChange={(e) => setFormData({ ...formData, alamatUsaha: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
+            placeholder='Masukkan alamat usaha'
+          />
+
+          <TextInput
+            value={formData.alamatUsaha}
+            onChange={(e) => setFormData({ ...formData, alamatUsaha: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
+            placeholder='Masukkan alamat usaha'
+          />
+          <MultiSelect
+            value={formData.kategoriId}
+            onChange={(val) => {
+              setFormData({ ...formData, kategoriId: val });
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Kategori Produk</Text>}
+            placeholder='Pilih kategori produk'
+            data={
+              pasarState.kategoriProduk.findMany.data?.map((v) => ({
+                value: v.id,
+                label: v.nama
+              })) || []
+            }
+          />
+
+          <Group>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditPasarDesa;

src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/[id]/page.tsx

@@ -0,0 +1,127 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Paper, Stack, Flex, Text, Image, Skeleton } from '@mantine/core';
+import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
+import { useRouter, useParams } from 'next/navigation';
+import React, { useState } from 'react';
+import { useProxy } from 'valtio/utils';
+import pasarDesaState from '../../../../_state/ekonomi/pasar-desa/pasar-desa';
+import { useShallowEffect } from '@mantine/hooks';
+import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus';
+
+function DetailPasarDesa() {
+  const statePasar = useProxy(pasarDesaState)
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  const params = useParams()
+  const router = useRouter();
+
+  useShallowEffect(() => {
+    statePasar.kategoriProduk.findUnique.load(params?.id as string)
+    statePasar.pasarDesa.findUnique.load(params?.id as string)
+  }, [])
+
+  const handleHapus = () => {
+    if (selectedId) {
+      statePasar.pasarDesa.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+      router.push("/admin/ekonomi/pasar-desa/produk-pasar-desa")
+    }
+  }
+
+  if (!statePasar.pasarDesa.findUnique.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
+
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button variant="subtle" onClick={() => router.back()}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+      <Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
+        <Stack>
+          <Text fz={"xl"} fw={"bold"}>Detail Pasar Desa</Text>
+          <Paper bg={colors['BG-trans']} p={'md'}>
+            <Stack gap={"xs"}>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Nama Produk</Text>
+                <Text fz={"lg"}>{statePasar.pasarDesa.findUnique.data?.nama}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Harga Produk</Text>
+                <Text fz={"lg"}>Rp.{statePasar.pasarDesa.findUnique.data?.harga}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Rating Produk</Text>
+                <Text fz={"lg"}>{statePasar.pasarDesa.findUnique.data?.rating}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Alamat Usaha</Text>
+                <Text fz={"lg"}>{statePasar.pasarDesa.findUnique.data?.alamatUsaha}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Gambar</Text>
+                <Image src={statePasar.pasarDesa.findUnique.data?.image?.link} alt="gambar" />
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Kategori</Text>
+                <Stack gap={4}>
+                  {statePasar.pasarDesa.findUnique.data?.kategori?.length > 0 ? (
+                    statePasar.pasarDesa.findUnique.data.kategori.map((kat) => (
+                      <Text fz={"lg"} key={kat.id}>• {kat.nama}</Text>
+                    ))
+                  ) : (
+                    <Text fz={"lg"} c="dimmed">Tidak ada kategori</Text>
+                  )}
+                </Stack>
+              </Box>
+
+              <Box>
+                <Flex gap={"xs"}>
+                  <Button
+                    onClick={() => {
+                      if (statePasar.pasarDesa.findUnique.data) {
+                        setSelectedId(statePasar.pasarDesa.findUnique.data.id);
+                        setModalHapus(true);
+                      }
+                    }}
+                    disabled={!statePasar.pasarDesa.findUnique.data}
+                    color="red">
+                    <IconX size={20} />
+                  </Button>
+                  <Button
+                    onClick={() => {
+                      if (statePasar.pasarDesa.findUnique.data) {
+                        router.push(`/admin/ekonomi/pasar-desa/produk-pasar-desa/${statePasar.pasarDesa.findUnique.data.id}/edit`);
+                      }
+                    }}
+                    disabled={!statePasar.pasarDesa.findUnique.data}
+                    color="green">
+                    <IconEdit size={20} />
+                  </Button>
+                </Flex>
+              </Box>
+            </Stack>
+          </Paper>
+        </Stack>
+      </Paper>
+
+      {/* Modal Hapus */}
+      <ModalKonfirmasiHapus
+        opened={modalHapus}
+        onClose={() => setModalHapus(false)}
+        onConfirm={handleHapus}
+        text="Apakah anda yakin ingin menghapus produk ini?"
+      />
+    </Box>
+  );
+}
+
+export default DetailPasarDesa;

src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/create/page.tsx

@@ -0,0 +1,192 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import colors from '@/con/colors';
+import ApiFetch from '@/lib/api-fetch';
+import { Box, Button, Group, Image, MultiSelect, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
+import { Dropzone } from '@mantine/dropzone';
+import { IconArrowBack, IconPhoto, IconUpload, IconX } from '@tabler/icons-react';
+import { useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
+import pasarDesaState from '../../../../_state/ekonomi/pasar-desa/pasar-desa';
+
+function CreatePasarDesa() {
+  const router = useRouter();
+  const statePasar = useProxy(pasarDesaState)
+  const [previewImage, setPreviewImage] = useState<string | null>(null);
+  const [file, setFile] = useState<File | null>(null);
+
+  useEffect(() => {
+    statePasar.kategoriProduk.findMany.load();
+  }, []);
+
+  const resetForm = () => {
+    statePasar.pasarDesa.create.form = {
+      nama: "",
+      harga: 0,
+      alamatUsaha: "",
+      imageId: "",
+      rating: 0,
+      kategoriId: [],
+    };
+    setPreviewImage(null);
+    setFile(null);
+  };
+  const handleSubmit = async () => {
+    if (!file) {
+      return toast.warn("Pilih file gambar terlebih dahulu");
+    }
+
+    const res = await ApiFetch.api.fileStorage.create.post({
+      file,
+      name: file.name,
+    })
+
+    const uploaded = res.data?.data;
+
+    if (!uploaded?.id) {
+      return toast.error("Gagal mengupload file");
+    }
+
+    statePasar.pasarDesa.create.form.imageId = uploaded.id;
+
+    await statePasar.pasarDesa.create.create();
+
+    resetForm();
+    router.push("/admin/ekonomi/pasar-desa/produk-pasar-desa")
+  }
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
+        <Stack gap={"xs"}>
+          <Title order={4}>Create Pasar Desa</Title>
+          <Box>
+            <Text fz={"md"} fw={"bold"}>Gambar</Text>
+            <Box>
+              <Dropzone
+                onDrop={(files) => {
+                  const selectedFile = files[0]; // Ambil file pertama
+                  if (selectedFile) {
+                    setFile(selectedFile);
+                    setPreviewImage(URL.createObjectURL(selectedFile)); // Buat preview
+                  }
+                }}
+                onReject={() => toast.error('File tidak valid.')}
+                maxSize={5 * 1024 ** 2} // Maks 5MB
+                accept={{ 'image/*': [] }}
+              >
+                <Group justify="center" gap="xl" mih={220} style={{ pointerEvents: 'none' }}>
+                  <Dropzone.Accept>
+                    <IconUpload size={52} color="var(--mantine-color-blue-6)" stroke={1.5} />
+                  </Dropzone.Accept>
+                  <Dropzone.Reject>
+                    <IconX size={52} color="var(--mantine-color-red-6)" stroke={1.5} />
+                  </Dropzone.Reject>
+                  <Dropzone.Idle>
+                    <IconPhoto size={52} color="var(--mantine-color-dimmed)" stroke={1.5} />
+                  </Dropzone.Idle>
+
+                  <div>
+                    <Text size="xl" inline>
+                      Drag gambar ke sini atau klik untuk pilih file
+                    </Text>
+                    <Text size="sm" c="dimmed" inline mt={7}>
+                      Maksimal 5MB dan harus format gambar
+                    </Text>
+                  </div>
+                </Group>
+              </Dropzone>
+
+              {/* Tampilkan preview kalau ada */}
+              {previewImage && (
+                <Box mt="sm">
+                  <Image
+                    src={previewImage}
+                    alt="Preview"
+                    style={{
+                      maxWidth: '100%',
+                      maxHeight: '200px',
+                      objectFit: 'contain',
+                      borderRadius: '8px',
+                      border: '1px solid #ddd',
+                    }}
+                  />
+                </Box>
+              )}
+
+            </Box>
+          </Box>
+          <TextInput
+            value={statePasar.pasarDesa.create.form.nama}
+            onChange={(val) => {
+              statePasar.pasarDesa.create.form.nama = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Nama Produk</Text>}
+            placeholder='Masukkan nama produk'
+          />
+          <TextInput
+            value={statePasar.pasarDesa.create.form.harga}
+            onChange={(val) => {
+              statePasar.pasarDesa.create.form.harga = Number(val.target.value);
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Harga Produk</Text>}
+            placeholder='Masukkan harga produk'
+          />
+          <TextInput
+            type="number"
+            min={0}
+            max={5}
+            step={0.1} // bisa pakai 0.1 biar support desimal
+            value={statePasar.pasarDesa.create.form.rating}
+            onChange={(val) => {
+              const value = Number(val.target.value);
+
+              // Validasi manual juga boleh (jaga-jaga)
+              if (value >= 0 && value <= 5) {
+                statePasar.pasarDesa.create.form.rating = value;
+              }
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Rating Produk</Text>}
+            placeholder='Masukkan rating produk (0-5)'
+          />
+
+          <TextInput
+            value={statePasar.pasarDesa.create.form.alamatUsaha}
+            onChange={(val) => {
+              statePasar.pasarDesa.create.form.alamatUsaha = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
+            placeholder='Masukkan alamat usaha'
+          />
+          <MultiSelect
+            value={statePasar.pasarDesa.create.form.kategoriId}
+            onChange={(val) => {
+              statePasar.pasarDesa.create.form.kategoriId = val;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Kategori Produk</Text>}
+            placeholder='Pilih kategori produk'
+            data={
+              statePasar.kategoriProduk.findMany.data?.map((v) => ({
+                value: v.id,
+                label: v.nama
+              })) || []
+            }
+          />
+
+          <Group>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default CreatePasarDesa;

src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/page.tsx

@@ -23,7 +23,7 @@ function PasarDesa() {
 }
 
 function ListPasarDesa() {
-  const statePasar = useProxy(pasarDesaState)
+  const statePasar = useProxy(pasarDesaState.pasarDesa)
   const router = useRouter();
 
   useShallowEffect(() => {
@@ -43,7 +43,7 @@ function ListPasarDesa() {
       <Paper bg={colors['white-1']} p={'md'}>
         <JudulList
           title='List Produk Pasar Desa'
-          href='/admin/ekonomi/pasar-desa/create'
+          href='/admin/ekonomi/pasar-desa/produk-pasar-desa/create'
         />
         <Table striped withTableBorder withRowBorders>
           <TableThead>
@@ -59,11 +59,11 @@ function ListPasarDesa() {
             {statePasar.findMany.data?.map((item) => (
               <TableTr key={item.id}>
                 <TableTd>{item.nama}</TableTd>
-                <TableTd>{item.harga}</TableTd>
+                <TableTd>Rp.{item.harga}</TableTd>
                 <TableTd>{item.rating}</TableTd>
-                <TableTd>{item.alamat}</TableTd>
+                <TableTd>{item.alamatUsaha}</TableTd>
                 <TableTd>
-                  <Button onClick={() => router.push(`/admin/ekonomi/pasar-desa/${item.id}`)}>
+                  <Button onClick={() => router.push(`/admin/ekonomi/pasar-desa/produk-pasar-desa/${item.id}`)}>
                     <IconDeviceImac size={20} />
                   </Button>
                 </TableTd>

src/app/admin/(dashboard)/ekonomi/program-kemiskinan/[id]/edit/page.tsx

@@ -0,0 +1,126 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+
+import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
+import programKemiskinanState from '@/app/admin/(dashboard)/_state/ekonomi/program-kemiskinan';
+import colors from '@/con/colors';
+import {
+  Box,
+  Button,
+  Group,
+  Paper,
+  Stack,
+  Text,
+  TextInput,
+  Title,
+} from '@mantine/core';
+import { IconArrowBack } from '@tabler/icons-react';
+import { useRouter, useParams } from 'next/navigation';
+import { useEffect } from 'react';
+import { useProxy } from 'valtio/utils';
+
+function EditProgramKemiskinan() {
+  const router = useRouter();
+  const params = useParams() as { id: string };
+  const stateProgram = useProxy(programKemiskinanState);
+  const id = params.id;
+
+  useEffect(() => {
+    if (id) {
+      stateProgram.findUnique.load(id).then(() => {
+        const data = stateProgram.findUnique.data;
+        if (data) {
+          stateProgram.update.form = {
+            nama: data.nama || '',
+            deskripsi: data.deskripsi || '',
+            ikonUrl: data.ikonUrl || '',
+            statistik: {
+              tahun: data.statistik?.tahun?.toString() || '',
+              jumlah: data.statistik?.jumlah?.toString() || '',
+            },
+          };
+        }
+      });
+    }
+  }, [id]);
+
+  const handleSubmit = async () => {
+    stateProgram.update.id = id;
+    await stateProgram.update.update();
+    router.push('/admin/ekonomi/program-kemiskinan');
+  };
+
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button onClick={() => router.back()} variant="subtle" color="blue">
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p="md">
+        <Stack gap="xs">
+          <Title order={4}>Edit Program Kemiskinan</Title>
+
+          <TextInput
+            value={stateProgram.update.form.nama}
+            onChange={(e) => {
+              stateProgram.update.form.nama = e.target.value;
+            }}
+            label={<Text fw="bold" fz="md">Judul Program</Text>}
+            placeholder="Masukkan judul program"
+          />
+
+          <Box>
+            <Text fw="bold" fz="md">Deskripsi</Text>
+            <EditEditor
+              value={stateProgram.update.form.deskripsi}
+              onChange={(val) => {
+                stateProgram.update.form.deskripsi = val;
+              }}
+            />
+          </Box>
+
+          <TextInput
+            value={stateProgram.update.form.ikonUrl}
+            onChange={(e) => {
+              stateProgram.update.form.ikonUrl = e.target.value;
+            }}
+            label={<Text fw="bold" fz="md">Ikon URL</Text>}
+            placeholder="Masukkan ikon url"
+          />
+
+          <Text fw="bold" fz="md">Statistik Jumlah Masyarakat Miskin</Text>
+
+          <TextInput
+            type="number"
+            value={stateProgram.update.form.statistik.jumlah}
+            onChange={(e) => {
+              stateProgram.update.form.statistik.jumlah = e.target.value;
+            }}
+            label={<Text fw="bold" fz="md">Jumlah Masyarakat Miskin</Text>}
+            placeholder="Masukkan jumlah masyarakat miskin"
+          />
+
+          <TextInput
+            type="number"
+            value={stateProgram.update.form.statistik.tahun}
+            onChange={(e) => {
+              stateProgram.update.form.statistik.tahun = e.target.value;
+            }}
+            label={<Text fw="bold" fz="md">Tahun</Text>}
+            placeholder="Masukkan tahun"
+          />
+
+          <Group>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>
+              Submit
+            </Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditProgramKemiskinan;

src/app/admin/(dashboard)/ekonomi/program-kemiskinan/[id]/page.tsx

@@ -0,0 +1,115 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Flex, Paper, Skeleton, Stack, Text } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useState } from 'react';
+import { useProxy } from 'valtio/utils';
+import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+import programKemiskinanState from '../../../_state/ekonomi/program-kemiskinan';
+
+
+function DetailProgramKemiskinan() {
+  const programState = useProxy(programKemiskinanState)
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  const router = useRouter();
+  const params = useParams()
+
+  useShallowEffect(() => {
+    programState.findUnique.load(params?.id as string)
+  }, [])
+
+  const handleHapus = () => {
+    if (selectedId) {
+      programState.delete.delete(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+      router.push("/admin/ekonomi/program-kemiskinan")
+    }
+  }
+
+  if (!programState.findUnique.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={40} />
+      </Stack>
+    )
+  }
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button variant="subtle" onClick={() => router.back()}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+      <Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
+        <Stack>
+          <Text fz={"xl"} fw={"bold"}>Detail Program Kemiskinan</Text>
+          <Paper bg={colors['BG-trans']} p={'md'}>
+            <Stack gap={"xs"}>
+              <Box>
+                <Text fw={"bold"}>Judul Program</Text>
+                <Text fz={"md"}>{programState.findUnique.data?.nama}</Text>
+              </Box>
+              <Box>
+                <Text fw={"bold"}>Deskripsi Singkat</Text>
+                <Text fz={"md"} dangerouslySetInnerHTML={{ __html: programState.findUnique.data?.deskripsi }}></Text>
+              </Box>
+              <Box>
+                <Text fw={"bold"}>Ikon URL</Text>
+                <Text fz={"md"}>{programState.findUnique.data?.ikonUrl}</Text>
+              </Box>
+              <Text fw={"bold"}>Statistik Jumlah Masyarakat Miskin</Text>
+              <Box>
+                <Text fw={"bold"}>Jumlah Masyarakat Miskin</Text>
+                <Text fz={"md"}>{programState.findUnique.data?.statistik?.jumlah}</Text>
+              </Box>
+              <Box>
+                <Text fw={"bold"}>Tahun</Text>
+                <Text fz={"md"}>{programState.findUnique.data?.statistik?.tahun}</Text>
+              </Box>
+              <Flex gap={"xs"} mt={10}>
+                <Button
+                  onClick={() => {
+                    if (programState.findUnique.data) {
+                      setSelectedId(programState.findUnique.data.id);
+                      setModalHapus(true);
+                    }
+                  }}
+                  disabled={programState.delete.loading || !programState.findUnique.data}
+                  color={"red"}
+                >
+                  <IconX size={20} />
+                </Button>
+                <Button
+                  onClick={() => {
+                    if (programState.findUnique.data) {
+                      router.push(`/admin/ekonomi/program-kemiskinan/${programState.findUnique.data.id}/edit`);
+                    }
+                  }}
+                  disabled={!programState.findUnique.data}
+                  color={"green"}
+                >
+                  <IconEdit size={20} />
+                </Button>
+              </Flex>
+            </Stack>
+          </Paper>
+        </Stack>
+      </Paper>
+
+      {/* Modal Hapus */}
+      <ModalKonfirmasiHapus
+        opened={modalHapus}
+        onClose={() => setModalHapus(false)}
+        onConfirm={handleHapus}
+        text="Apakah anda yakin ingin menghapus program kemiskinan ini?"
+      />
+    </Box>
+  );
+}
+
+export default DetailProgramKemiskinan;
+

src/app/admin/(dashboard)/ekonomi/program-kemiskinan/create/page.tsx

@@ -1,45 +1,107 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 'use client'
 import colors from '@/con/colors';
 import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import programKemiskinanState from '../../../_state/ekonomi/program-kemiskinan';
+import CreateEditor from '../../../_com/createEditor';
+import { useState } from 'react';
 
 
 function CreateProgramKemiskinan() {
+  const programState = useProxy(programKemiskinanState)
   const router = useRouter();
+  const [lineChart, setLineChart] = useState<any[]>([]);
+
+  const resetForm = () => {
+    programState.create.form = {
+      nama: "",
+      deskripsi: "",
+      ikonUrl: "",
+      statistik: {
+        tahun: "",
+        jumlah: "",
+      }
+    }
+  }
+
+  const handleSubmit = async () => {
+    const id = await programState.create.create();
+    if (id) {
+      const idStr = String(id);
+      await programState.findUnique.load(idStr);
+      if (programState.findUnique.data) {
+        setLineChart([programState.findUnique.data]);
+      }
+    }
+    resetForm()
+    router.push("/admin/ekonomi/program-kemiskinan")
+  }
+
   return (
     <Box>
       <Box mb={10}>
         <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
+          <IconArrowBack color={colors['blue-button']} size={25} />
         </Button>
       </Box>
 
-      <Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
         <Stack gap={"xs"}>
           <Title order={4}>Create Program Kemiskinan</Title>
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Judul Program</Text>}
-          placeholder='Masukkan judul program'
+            value={programState.create.form.nama}
+            onChange={(val) => {
+              programState.create.form.nama = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"md"}>Judul Program</Text>}
+            placeholder='Masukkan judul program'
+          />
+         <Box>
+          <Text fw={"bold"} fz={"md"}>Deskripsi</Text>
+         <CreateEditor
+            value={programState.create.form.deskripsi}
+            onChange={(val) => {
+              programState.create.form.deskripsi = val;
+            }}
+          />
+         </Box>
+          <TextInput
+            value={programState.create.form.ikonUrl}
+            onChange={(val) => {
+              programState.create.form.ikonUrl = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"md"}>Ikon URL</Text>}
+            placeholder='Masukkan ikon url'
+          />
+          <Text fw={"bold"} fz={"md"}>Statistik Jumlah Masyarakat Miskin</Text>
+          <TextInput
+            type='number'
+            value={programState.create.form.statistik.jumlah}
+            onChange={(val) => {
+              programState.create.form.statistik.jumlah = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"md"}>Jumlah Masyarakat Miskin</Text>}
+            placeholder='Masukkan jumlah masyarakat miskin'
           />
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Deskripsi Singkat</Text>}
-          placeholder='Masukkan deskripsi'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Jumlah Masyarakat Miskin</Text>}
-          placeholder='Masukkan jumlah masyarakat miskin'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>}
-          placeholder='Masukkan deskripsi'
+            type='number'
+            value={programState.create.form.statistik.tahun}
+            onChange={(val) => {
+              programState.create.form.statistik.tahun = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"md"}>Tahun</Text>}
+            placeholder='Masukkan tahun'
           />
           <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
           </Group>
-       </Stack>
+        </Stack>
       </Paper>
-   </Box>
+    </Box>
   );
 }
 

src/app/admin/(dashboard)/ekonomi/program-kemiskinan/detail/page.tsx

@@ -1,66 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
-import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
-
-function DetailProgramKemiskinan() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button variant="subtle" onClick={() => router.back()}>
-          <IconArrowBack color={colors['blue-button']} size={25} />
-        </Button>
-      </Box>
-      <Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
-        <Stack>
-          <Text fz={"xl"} fw={"bold"}>Detail Program Kemiskinan</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-             <Box>
-             <Text fw={"bold"}>Judul Program</Text>
-             <Text>Program A</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Deskripsi Singkat</Text>
-             <Text>Deskripsi Program A</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Jumlah Masyarakat Miskin</Text>
-             <Text>100</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Deskripsi</Text>
-             <Text>Deskripsi Program A</Text>
-             </Box>
-              <Box>
-                <Flex gap={"xs"}>
-                  <Button color="red">
-                    <IconX size={20} />
-                  </Button>
-                  <Button onClick={() => router.push('/admin/ekonomi/program-kemiskinan/edit')} color="green">
-                    <IconEdit size={20} />
-                  </Button>
-                </Flex>
-              </Box>
-            </Stack>
-          </Paper>
-        </Stack>
-      </Paper>
-
-      {/* Modal Hapus
-      <ModalKonfirmasiHapus
-        opened={modalHapus}
-        onClose={() => setModalHapus(false)}
-        onConfirm={handleHapus}
-        text="Apakah anda yakin ingin menghapus potensi ini?"
-      /> */}
-    </Box>
-  );
-}
-
-export default DetailProgramKemiskinan;
-

src/app/admin/(dashboard)/ekonomi/program-kemiskinan/edit/page.tsx

@@ -1,46 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-
-
-function EditProgramKemiskinan() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
-        </Button>
-      </Box>
-
-      <Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
-        <Stack gap={"xs"}>
-          <Title order={4}>Edit Program Kemiskinan</Title>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Judul Program</Text>}
-          placeholder='Masukkan judul program'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Deskripsi Singkat</Text>}
-          placeholder='Masukkan deskripsi'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Jumlah Masyarakat Miskin</Text>}
-          placeholder='Masukkan jumlah masyarakat miskin'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>}
-          placeholder='Masukkan deskripsi'
-          />
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditProgramKemiskinan;

src/app/admin/(dashboard)/ekonomi/program-kemiskinan/page.tsx

@@ -1,10 +1,16 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
+import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
 import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
 import HeaderSearch from '../../_com/header';
 import JudulList from '../../_com/judulList';
 import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import programKemiskinanState from '../../_state/ekonomi/program-kemiskinan';
+import { useShallowEffect } from '@mantine/hooks';
+import { useEffect, useState } from 'react';
+import { CartesianGrid, Legend, Line, LineChart, Tooltip, XAxis, YAxis } from 'recharts';
 
 function ProgramKemiskinan() {
   return (
@@ -14,13 +20,44 @@ function ProgramKemiskinan() {
         placeholder='pencarian'
         searchIcon={<IconSearch size={20} />}
       />
-      <ListProgramKemiskinan/>
+      <ListProgramKemiskinan />
     </Box>
   );
 }
 
 function ListProgramKemiskinan() {
+  const programState = useProxy(programKemiskinanState)
   const router = useRouter();
+  const [lineChart, setLineChart] = useState<any[]>([]);
+  const [mounted, setMounted] = useState(false);
+
+  useShallowEffect(() => {
+    setMounted(true)
+    programState.findMany.load()
+  }, [])
+
+  useEffect(() => {
+    if (programState.findMany.data) {
+      const chartData = programState.findMany.data
+        .filter(item => item.statistik)
+        .map(item => ({
+          tahun: item.statistik?.tahun,
+          jumlah: Number(item.statistik?.jumlah)
+        }))
+        .sort((a, b) => (a.tahun || 0) - (b.tahun || 0)); // opsional, urutkan tahun
+
+      setLineChart(chartData);
+
+    }
+  }, [programState.findMany.data])
+
+  if (!programState.findMany.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
   return (
     <Box py={10}>
       <Paper bg={colors['white-1']} p={'md'}>
@@ -35,22 +72,66 @@ function ListProgramKemiskinan() {
               <TableTh>Deskripsi Singkat</TableTh>
               <TableTh>Jumlah Masyarakat Miskin</TableTh>
               <TableTh>Detail</TableTh>
-              </TableTr>
+            </TableTr>
           </TableThead>
           <TableTbody>
-            <TableTr>
-              <TableTd>Program A</TableTd>
-              <TableTd>Deskripsi Program A</TableTd>
-              <TableTd>100</TableTd>
-              <TableTd>
-                <Button onClick={() => router.push('/admin/ekonomi/program-kemiskinan/detail')}>
-                  <IconDeviceImac size={20} />
-                </Button>
-              </TableTd>
-            </TableTr>
+            {programState.findMany.data?.map((item) => (
+              <TableTr key={item.id}>
+                <TableTd>{item.nama}</TableTd>
+                <TableTd>
+                  <Text fz={'sm'} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
+                </TableTd>
+                <TableTd>{item.statistik?.jumlah}</TableTd>
+                <TableTd>
+                  <Button onClick={() => router.push(`/admin/ekonomi/program-kemiskinan/${item.id}`)}>
+                    <IconDeviceImac size={20} />
+                  </Button>
+                </TableTd>
+              </TableTr>
+            ))}
           </TableTbody>
-        </Table>  
+        </Table>
       </Paper>
+
+      {/* Chart */}
+      <Box>
+        <Paper bg={colors['white-1']} p={'md'} >
+          <Stack>
+            <Box >
+              <Title pb={10} order={3}>Grafik Berdasarkan Responden</Title>
+              {mounted && lineChart.length > 0 ? (<Box style={{ width: '100%', height: 'auto', }}>
+                <Box w={"100%"} style={{overflowX: 'auto'}}>
+                  <LineChart
+                    width={820}
+                    height={300}
+                    data={lineChart}
+                  >
+                    <CartesianGrid strokeDasharray="3 3" />
+                    <XAxis dataKey="tahun" />
+                    <YAxis />
+                    <Tooltip
+                      formatter={(value: any, name: string) => [`${value} orang`, name]}
+                      labelFormatter={(label: any) => `Tahun: ${label}`}
+                    />
+                    <Legend />
+                    <Line
+                      type="monotone"
+                      dataKey="jumlah"
+                      name="Jumlah per Tahun"
+                      stroke={colors['blue-button']}
+                    />
+                  </LineChart>
+                </Box>
+
+
+              </Box>
+              ) : (
+                <Text c='dimmed'>Belum ada data untuk ditampilkan dalam grafik</Text>
+              )}
+            </Box>
+          </Stack>
+        </Paper>
+      </Box>
     </Box>
   );
 }

src/app/admin/(dashboard)/keamanan/laporan-publik/[id]/edit/page.tsx

@@ -0,0 +1,151 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
+import laporanPublikState from '@/app/admin/(dashboard)/_state/keamanan/laporan-publik';
+import colors from '@/con/colors';
+import { Box, Button, Group, Paper, Select, Stack, Text, TextInput, Title } from '@mantine/core';
+import { DateTimePicker } from '@mantine/dates';
+import { IconArrowBack } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
+export type Status = "Selesai" | "Proses" | "Gagal";
+
+function EditLaporanPublik() {
+  const stateLaporan = useProxy(laporanPublikState)
+  const router = useRouter();
+  const params = useParams()
+
+  const [formData, setFormData] = useState({
+    judul: stateLaporan.edit.form.judul || '',
+    lokasi: stateLaporan.edit.form.lokasi || '',
+    tanggalWaktu: stateLaporan.edit.form.tanggalWaktu || '',
+    status: stateLaporan.edit.form.status || '',
+    penanganan: stateLaporan.edit.form.penanganan || '',
+    kronologi: stateLaporan.edit.form.kronologi || '',
+  })
+
+  useEffect(() => {
+    const loadLaporanPublik = async () => {
+      const id = params?.id as string;
+      if (!id) return;
+
+      try {
+        const data = await stateLaporan.edit.load(id);
+        if (data) {
+          setFormData({
+            judul: data.judul || '',
+            lokasi: data.lokasi || '',
+            tanggalWaktu: data.tanggalWaktu || '',
+            status: data.status || '',
+            penanganan: data.penanganan?.map((p: any) => p.deskripsi)[0] || '',
+            kronologi: data.kronologi || '',
+          });
+        }
+      } catch (error) {
+        console.error('Error loading laporan publik:', error);
+      }
+    }
+
+    loadLaporanPublik();
+  }, [params?.id]);
+
+  const handleSubmit = async () => {
+    try {
+      stateLaporan.edit.form = {
+        ...stateLaporan.edit.form,
+        judul: formData.judul,
+        lokasi: formData.lokasi,
+        tanggalWaktu: formData.tanggalWaktu,
+        status: formData.status,
+        penanganan: formData.penanganan,
+        kronologi: formData.kronologi,
+      }
+      
+      await stateLaporan.edit.update();
+      toast.success("Laporan Publik berhasil diperbarui!");
+      router.push("/admin/keamanan/laporan-publik");
+    } catch (error) {
+      console.error("Error updating kontak darurat:", error);
+      toast.error("Terjadi kesalahan saat memperbarui kontak darurat");
+    }
+  }
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
+      <Stack gap={"xs"}>
+          <Title order={4}>Edit Laporan Publik</Title>
+          <TextInput
+            value={formData.judul}
+            onChange={(e) => setFormData({ ...formData, judul: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Laporan Publik</Text>}
+            placeholder='Masukkan judul LaporanPublik'
+          />
+          <TextInput
+            value={formData.lokasi}
+            onChange={(e) => setFormData({ ...formData, lokasi: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Lokasi Laporan Publik</Text>}
+            placeholder='Masukkan lokasi LaporanPublik'
+          />
+          <DateTimePicker
+            label="Tanggal Laporan Publik"
+            value={
+              formData.tanggalWaktu
+                ? new Date(formData.tanggalWaktu)
+                : null
+            }
+            onChange={(val) => {
+              if (val) {
+                setFormData({ ...formData, tanggalWaktu: val.toString() });
+              } else {
+                setFormData({ ...formData, tanggalWaktu: "" }); // Reset kalau dikosongkan
+              }
+            }}
+          />
+
+          <Select
+            value={formData.status}
+            onChange={(e) => setFormData({ ...formData, status: e?.valueOf() as Status })}
+            label={<Text fw={"bold"} fz={"sm"}>Status Laporan Publik</Text>}
+            placeholder='Masukkan status LaporanPublik'
+            data={[
+              { value: "Selesai", label: "Selesai" },
+              { value: "Proses", label: "Proses" },
+              { value: "Gagal", label: "Gagal" },
+            ]}
+          />
+          <TextInput
+            value={formData.kronologi}
+            onChange={(e) => setFormData({ ...formData, kronologi: e.target.value })}
+            label={<Text fw={"bold"} fz={"sm"}>Kronologi Laporan Publik</Text>}
+            placeholder='Masukkan kronologi LaporanPublik'
+          />
+          <Text fw={"bold"} fz={"sm"}>Penanganan Laporan Publik</Text>
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Laporan Publik</Text>
+            <EditEditor
+              value={formData.penanganan}
+              onChange={(htmlContent) => {
+                setFormData((prev) => ({ ...prev, penanganan: htmlContent }));
+                stateLaporan.edit.form.penanganan = htmlContent;
+              }}
+            />
+          </Box>
+          <Group>
+            <Button onClick={handleSubmit} bg={colors['blue-button']}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditLaporanPublik;

src/app/admin/(dashboard)/keamanan/laporan-publik/[id]/page.tsx

@@ -0,0 +1,128 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Flex, Paper, Skeleton, Stack, Text } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import laporanPublikState from '../../../_state/keamanan/laporan-publik';
+// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+import { useState } from 'react';
+import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+
+function DetailLaporanPublik() {
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  const stateLaporan = useProxy(laporanPublikState)
+  const params = useParams()
+  const router = useRouter();
+
+  useShallowEffect(() => {
+    stateLaporan.findUnique.load(params?.id as string)
+  }, [])
+
+  const handleDelete = () => {
+    if (selectedId) {
+      stateLaporan.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+      router.push("/admin/keamanan/laporan-publik")
+    }
+  }
+
+  if (!stateLaporan.findUnique.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
+  return (
+    <Box>
+      <Box mb={10}>
+        <Button variant="subtle" onClick={() => router.back()}>
+          <IconArrowBack color={colors['blue-button']} size={25} />
+        </Button>
+      </Box>
+      <Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
+        <Stack>
+          <Text fz={"xl"} fw={"bold"}>Detail Laporan Publik</Text>
+          <Paper bg={colors['BG-trans']} p={'md'}>
+            <Stack gap={"xs"}>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Judul Laporan Publik</Text>
+                <Text fz={"lg"}>{stateLaporan.findUnique.data?.judul}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Tanggal Laporan Publik</Text>
+                <Text fz={"lg"}>
+                  {stateLaporan.findUnique.data?.tanggalWaktu 
+                    ? new Date(stateLaporan.findUnique.data.tanggalWaktu).toLocaleString('id-ID')
+                    : '-'}
+                </Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Lokasi</Text>
+                <Text fz={"lg"}>{stateLaporan.findUnique.data?.lokasi}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Status</Text>
+                <Text fz={"lg"}>{stateLaporan.findUnique.data?.status}</Text>
+              </Box>
+              <Box>
+                <Text fz={"lg"} fw={"bold"}>Kronologi</Text>
+                <Text fz={"lg"}>
+                  {stateLaporan.findUnique.data?.kronologi || '-'}
+                </Text>
+              </Box>
+              <Text fz={"lg"} fw={"bold"}>Penanganan</Text>
+              {stateLaporan.findUnique.data?.penanganan?.map((item, index) => (
+                <Box key={index}>
+                  <Text fz={"lg"} fw={"bold"}>Deskripsi Penanganan</Text>
+                  <Text fz={"lg"} dangerouslySetInnerHTML={{ __html: item.deskripsi || '-' }} />
+                </Box>
+              ))}
+              {!stateLaporan.findUnique.data?.penanganan?.length && (
+                <Text fz={"lg"} fs="italic">Belum ada penanganan</Text>
+              )}
+              <Flex gap={"xs"} mt={10}>
+                <Button
+                  onClick={() => {
+                    if (stateLaporan.findUnique.data) {
+                      setSelectedId(stateLaporan.findUnique.data.id);
+                      setModalHapus(true);
+                    }
+                  }}
+                  disabled={stateLaporan.delete.loading || !stateLaporan.findUnique.data}
+                  color={"red"}
+                >
+                  <IconX size={20} />
+                </Button>
+                <Button
+                  onClick={() => {
+                    if (stateLaporan.findUnique.data) {
+                      router.push(`/admin/keamanan/laporan-publik/${stateLaporan.findUnique.data.id}/edit`);
+                    }
+                  }}
+                  disabled={!stateLaporan.findUnique.data}
+                  color={"green"}
+                >
+                  <IconEdit size={20} />
+                </Button>
+              </Flex>
+            </Stack>
+          </Paper>
+          {/* Modal Konfirmasi Hapus */}
+          <ModalKonfirmasiHapus
+            opened={modalHapus}
+            onClose={() => setModalHapus(false)}
+            onConfirm={handleDelete}
+            text='Apakah anda yakin ingin menghapus laporan publik ini?'
+          />
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default DetailLaporanPublik;

src/app/admin/(dashboard)/keamanan/laporan-publik/create/page.tsx

@@ -1,47 +1,105 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
+import { Box, Button, Group, Paper, Select, Stack, Text, TextInput, Title } from '@mantine/core';
+import { DateTimePicker } from '@mantine/dates';
+import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
-import { KeamananEditor } from '../../_com/keamananEditor';
+import { useProxy } from 'valtio/utils';
+import CreateEditor from '../../../_com/createEditor';
+import laporanPublikState from '../../../_state/keamanan/laporan-publik';
+export type Status = "Selesai" | "Proses" | "Gagal";
 
 function CreateLaporanPublik() {
+  const stateLaporan = useProxy(laporanPublikState)
   const router = useRouter();
+
+  const resetForm = () => {
+    stateLaporan.create.form = {
+      judul: "",
+      lokasi: "",
+      tanggalWaktu: "",
+      status: "Proses" as Status,
+      penanganan: "",
+      kronologi: "",
+    }
+  }
+
+  const handleSubmit = async () => {
+    await stateLaporan.create.create();
+    resetForm();
+    router.push('/admin/keamanan/laporan-publik');
+  }
+
   return (
     <Box>
       <Box mb={10}>
         <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
+          <IconArrowBack color={colors['blue-button']} size={25} />
         </Button>
       </Box>
 
-      <Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
+      <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
         <Stack gap={"xs"}>
           <Title order={4}>Create Laporan Publik</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Judul Laporan Publik</Text>}
-          placeholder='Masukkan judul LaporanPublik'
+            value={stateLaporan.create.form.judul}
+            onChange={(e) => stateLaporan.create.form.judul = e.target.value}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Laporan Publik</Text>}
+            placeholder='Masukkan judul LaporanPublik'
           />
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Tanggal Laporan Publik</Text>}
-          placeholder='Masukkan tanggal LaporanPublik'
+            value={stateLaporan.create.form.lokasi}
+            onChange={(e) => stateLaporan.create.form.lokasi = e.target.value}
+            label={<Text fw={"bold"} fz={"sm"}>Lokasi Laporan Publik</Text>}
+            placeholder='Masukkan lokasi LaporanPublik'
           />
+          <DateTimePicker
+            label="Tanggal Laporan Publik"
+            value={
+              stateLaporan.create.form.tanggalWaktu
+                ? new Date(stateLaporan.create.form.tanggalWaktu)
+                : null
+            }
+            onChange={(val) => {
+              if (val) {
+                stateLaporan.create.form.tanggalWaktu = val.toString();
+              } else {
+                stateLaporan.create.form.tanggalWaktu = ""; // Reset kalau dikosongkan
+              }
+            }}
+          />
+
+          <Select
+            value={stateLaporan.create.form.status}
+            onChange={(e) => stateLaporan.create.form.status = e?.valueOf() as Status}
+            label={<Text fw={"bold"} fz={"sm"}>Status Laporan Publik</Text>}
+            placeholder='Masukkan status LaporanPublik'
+            data={[
+              { value: "Selesai", label: "Selesai" },
+              { value: "Proses", label: "Proses" },
+              { value: "Gagal", label: "Gagal" },
+            ]}
+          />
+          <TextInput
+            value={stateLaporan.create.form.kronologi}
+            onChange={(e) => stateLaporan.create.form.kronologi = e.target.value}
+            label={<Text fw={"bold"} fz={"sm"}>Kronologi Laporan Publik</Text>}
+            placeholder='Masukkan kronologi LaporanPublik'
+          />
+          <Text fw={"bold"} fz={"sm"}>Penanganan Laporan Publik</Text>
           <Box>
             <Text fw={"bold"} fz={"sm"}>Deskripsi Laporan Publik</Text>
-            <KeamananEditor
-              showSubmit={false}
+            <CreateEditor
+              value={stateLaporan.create.form.penanganan}
+              onChange={(e) => stateLaporan.create.form.penanganan = e}
             />
           </Box>
           <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
+            <Button onClick={handleSubmit} bg={colors['blue-button']}>Submit</Button>
           </Group>
-       </Stack>
+        </Stack>
       </Paper>
-   </Box>
+    </Box>
   );
 }
 

src/app/admin/(dashboard)/keamanan/laporan-publik/detail/page.tsx

@@ -1,70 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
-import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-import React from 'react';
-// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
-
-function DetailLaporanPublik() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button variant="subtle" onClick={() => router.back()}>
-          <IconArrowBack color={colors['blue-button']} size={25} />
-        </Button>
-      </Box>
-      <Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
-        <Stack>
-          <Text fz={"xl"} fw={"bold"}>Detail Laporan Publik</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Judul Laporan Publik</Text>
-                <Text fz={"lg"}>Test Judul</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Tanggal Laporan Publik</Text>
-                <Text fz={"lg"}>Test Tanggal</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
-                <Text fz={"lg"}>Test Deskripsi</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Gambar</Text>
-                <Image src={"/"} alt="gambar" />
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Konten</Text>
-                <Text fz={"lg"} >Test Konten</Text>
-              </Box>
-              <Box>
-                <Flex gap={"xs"}>
-                  <Button color="red">
-                    <IconX size={20} />
-                  </Button>
-                  <Button onClick={() => router.push('/admin/keamanan/laporan-publik/edit')} color="green">
-                    <IconEdit size={20} />
-                  </Button>
-                </Flex>
-              </Box>
-            </Stack>
-          </Paper>
-        </Stack>
-      </Paper>
-
-      {/* Modal Hapus
-      <ModalKonfirmasiHapus
-        opened={modalHapus}
-        onClose={() => setModalHapus(false)}
-        onConfirm={handleHapus}
-        text="Apakah anda yakin ingin menghapus potensi ini?"
-      /> */}
-    </Box>
-  );
-}
-
-export default DetailLaporanPublik;

src/app/admin/(dashboard)/keamanan/laporan-publik/edit/page.tsx

@@ -1,48 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-import { KeamananEditor } from '../../_com/keamananEditor';
-
-function EditLaporanPublik() {
-  const router = useRouter();
-  return (
-    <Box>
-      <Box mb={10}>
-        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
-        </Button>
-      </Box>
-
-      <Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
-        <Stack gap={"xs"}>
-          <Title order={4}>Edit Laporan Publik</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Judul Laporan Publik</Text>}
-          placeholder='Masukkan judul Laporan Publik'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Tanggal Laporan Publik</Text>}
-          placeholder='Masukkan tanggal Laporan Publik'
-          />
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Laporan Publik</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
-          </Box>
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditLaporanPublik;

src/app/admin/(dashboard)/keamanan/laporan-publik/page.tsx

@@ -1,10 +1,13 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
+import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
 import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
 import HeaderSearch from '../../_com/header';
 import JudulList from '../../_com/judulList';
 import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import laporanPublikState from '../../_state/keamanan/laporan-publik';
+import { useShallowEffect } from '@mantine/hooks';
 
 function LaporanPublik() {
   return (
@@ -20,7 +23,20 @@ function LaporanPublik() {
 }
 
 function ListLaporanPublik() {
+  const stateLaporan = useProxy(laporanPublikState)
   const router = useRouter();
+
+  useShallowEffect(() => {
+    stateLaporan.findMany.load()
+  }, [])
+
+  if (!stateLaporan.findMany.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
   return (
     <Box py={10}>
       <Paper bg={colors['white-1']} p={'md'}>
@@ -33,21 +49,25 @@ function ListLaporanPublik() {
             <TableTr>
               <TableTh>Judul Laporan Publik</TableTh>
               <TableTh>Tanggal Laporan Publik</TableTh>
+              <TableTh>Status</TableTh>
               <TableTh>Deskripsi</TableTh>
               <TableTh>Detail</TableTh>
               </TableTr>
           </TableThead>
           <TableTbody>
-            <TableTr>
-              <TableTd>Laporan Publik 1</TableTd>
-              <TableTd>0896232831883</TableTd>
-              <TableTd>Laporan Publik 1</TableTd>
-              <TableTd>
-                <Button onClick={() => router.push('/admin/keamanan/laporan-publik/detail')}>
+            {stateLaporan.findMany.data?.map((item) => (
+              <TableTr key={item.id}>
+                <TableTd>{item.judul}</TableTd>
+                <TableTd>{new Date(item.tanggalWaktu).toLocaleDateString('id-ID')}</TableTd>
+                <TableTd>{item.status}</TableTd>
+                <TableTd>{item.kronologi}</TableTd>
+                <TableTd>
+                  <Button onClick={() => router.push(`/admin/keamanan/laporan-publik/${item.id}`)}>
                   <IconDeviceImac size={20} />
                 </Button>
               </TableTd>
             </TableTr>
+          ))}
           </TableTbody>
         </Table>  
       </Paper>

src/app/admin/_com/list_PageAdmin.tsx

@@ -215,7 +215,7 @@ export const navBar = [
       {
         id: "Ekonomi_1",
         name: "Pasar Desa",
-        path: "/admin/ekonomi/pasar-desa/pasar-desa-ui"
+        path: "/admin/ekonomi/pasar-desa/produk-pasar-desa"
       },
       {
         id: "Ekonomi_2",

src/app/api/[[...slugs]]/_lib/ekonomi/index.ts

@@ -1,14 +1,16 @@
 import Elysia from "elysia";
 import PasarDesa from "./pasar-desa";
-import KategoriMakanan from "./kategori-makanan";
 import LowonganKerja from "./lowongan-kerja";
+import ProgramKemiskinan from "./program-kemiskinan";
+import KategoriProduk from "./pasar-desa/kategori-produk";
 
 const Ekonomi = new Elysia({
   prefix: "/api/ekonomi",
   tags: ["Ekonomi"],
 })
 .use(PasarDesa)
-.use(KategoriMakanan)
+.use(KategoriProduk)
 .use(LowonganKerja)
+.use(ProgramKemiskinan)
 
 export default Ekonomi

src/app/api/[[...slugs]]/_lib/ekonomi/kategori-makanan/index.ts

@@ -1,30 +0,0 @@
-import Elysia from "elysia";
-import kategoriMakananFindMany from "./findMany";
-import kategoriMakananFindUnique from "./findUnique";
-import kategoriMakananDelete from "./del";
-import kategoriMakananCreate from "./create";
-import kategoriMakananUpdate from "./updt";
-import { t } from "elysia";
-
-const KategoriMakanan = new Elysia({
-    prefix: "/kategori-makanan",
-    tags: ["Ekonomi/Kategori Makanan"],
-})
-    .get("/find-many", kategoriMakananFindMany)
-    .get("/:id", async (context) => {
-        const response = await kategoriMakananFindUnique(context);
-        return response;
-    })
-    .delete("/del/:id", kategoriMakananDelete)
-    .post("/create", kategoriMakananCreate, {
-        body: t.Object({
-            nama: t.String(),
-        }),
-    })
-    .put("/:id", kategoriMakananUpdate, {
-        body: t.Object({
-            nama: t.String(),
-        }),
-    });
-
-export default KategoriMakanan;

src/app/api/[[...slugs]]/_lib/ekonomi/kategori-makanan/updt.ts

@@ -1,35 +0,0 @@
-import prisma from "@/lib/prisma";
-import { Context } from "elysia";
-
-export default async function kategoriMakananUpdate(context: Context) {
-    const body = await context.request.json()
-
-    if (!body.nama) {
-        return {
-            success: false,
-            message: "Nama is required",
-        }
-    }
-
-    const kategoriMakanan = await prisma.kategoriMakanan.update({
-        where: {
-            id: body.id,
-        },
-        data: {
-            nama: body.nama,
-        },
-    })
-
-    if(!kategoriMakanan) {
-        return {
-            success: false,
-            message: "Kategori makanan tidak ditemukan",
-        }
-    }
-
-    return {
-        success: true,
-        message: "Success update kategori makanan",
-        data: kategoriMakanan,
-    }
-}

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/create.ts

@@ -4,11 +4,10 @@ import { Context } from "elysia";
 type FormCreate = {
   nama: string;
   harga: number;
-  satuan: string;
-  alamat: string;
+  alamatUsaha: string;
   imageId: string;
   rating: number;
-  kategoriId: string; // Array of KategoriMakanan IDs
+  kategoriId: string[]; // Array of KategoriMakanan IDs
 };
 export default async function pasarDesaCreate(context: Context) {
   const body = context.body as FormCreate;
@@ -18,11 +17,12 @@ export default async function pasarDesaCreate(context: Context) {
     data: {
       nama: body.nama,
       harga: Number(body.harga),
-      satuan: body.satuan,
-      alamat: body.alamat,
+      alamatUsaha: body.alamatUsaha,
       imageId: body.imageId,
       rating: Number(body.rating),
-      kategoriId: body.kategoriId,
+      kategori: {
+        connect: body.kategoriId.map((id) => ({ id })),
+      },
     },
     include: {
       image: true,

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/index.ts

@@ -18,11 +18,10 @@ const PasarDesa = new Elysia({
     body: t.Object({
       nama: t.String(),
       harga: t.Number(),
-      satuan: t.String(),
-      alamat: t.String(),
+      alamatUsaha: t.String(),
       imageId: t.String(),
       rating: t.Number(),
-      kategoriId:t.String(),
+      kategoriId:t.Array(t.String()),
     }),
   })
   .delete("/del/:id", pasarDesaDelete)
@@ -36,11 +35,10 @@ const PasarDesa = new Elysia({
       body: t.Object({
         nama: t.String(),
         harga: t.Number(),
-        satuan: t.String(),
-        alamat: t.String(),
+        alamatUsaha: t.String(),
         imageId: t.String(),
         rating: t.Number(),
-        kategoriId: t.String(),
+        kategoriId:t.Array(t.String()),
       }),
     }
   );

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/kategori-produk/create.ts

@@ -2,7 +2,7 @@ import prisma from "@/lib/prisma";
 import { Context } from "elysia";
 
 
-export default async function kategoriMakananCreate(context: Context) {
+export default async function kategoriProdukCreate(context: Context) {
     const body = context.body as {nama: string};
 
     if (!body.nama) {
@@ -12,15 +12,14 @@ export default async function kategoriMakananCreate(context: Context) {
         };
     }
 
-    const kategoriMakanan = await prisma.kategoriMakanan.create({
+    const kategoriProduk = await prisma.kategoriProduk.create({
         data: {
             nama: body.nama,
-            deletedAt: null,
         },
     });
     return {
         success: true,
-        message: "Success create kategori makanan",
-        data: kategoriMakanan
+        message: "Success create kategori produk",
+        data: kategoriProduk
     };
 }

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/kategori-produk/del.ts

@@ -1,7 +1,7 @@
 import prisma from "@/lib/prisma";
 import { Context } from "elysia";
 
-const kategoriMakananDelete = async (context: Context) => {
+const kategoriProdukDelete = async (context: Context) => {
     const id = context.params.id;
     if (!id) {
         return {
@@ -10,24 +10,24 @@ const kategoriMakananDelete = async (context: Context) => {
         }
     }
 
-    const kategoriMakanan = await prisma.kategoriMakanan.delete({
+    const kategoriProduk = await prisma.kategoriProduk.delete({
         where: {
             id: id,
         },
     })
 
-    if(!kategoriMakanan) {
+    if(!kategoriProduk) {
         return {
             success: false,
-            message: "Kategori makanan tidak ditemukan",
+            message: "Kategori Produk tidak ditemukan",
         }
     }
 
     return {
         success: true,
-        message: "Success delete kategori makanan",
-        data: kategoriMakanan,
+        message: "Success delete kategori produk",
+        data: kategoriProduk,
     }
 }
 
-export default kategoriMakananDelete
+export default kategoriProdukDelete

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/kategori-produk/findMany.ts

@@ -1,8 +1,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import prisma from "@/lib/prisma";
 
-export default async function kategoriMakananFindMany() {
-    const data = await prisma.kategoriMakanan.findMany();
+export default async function kategoriProdukFindMany() {
+    const data = await prisma.kategoriProduk.findMany();
     return { 
         success: true,
         data: data.map((item: any) => {

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/kategori-produk/findUnique.ts

@@ -1,7 +1,7 @@
 import { Context } from "elysia";
 import prisma from "@/lib/prisma";
 
-export default async function kategoriMakananFindUnique(context: Context) {
+export default async function kategoriProdukFindUnique(context: Context) {
     const url = new URL(context.request.url);
     const pathSegments = url.pathname.split('/');
     const id = pathSegments[pathSegments.length - 1];
@@ -21,7 +21,7 @@ export default async function kategoriMakananFindUnique(context: Context) {
             }
         }
 
-        const data = await prisma.kategoriMakanan.findUnique({
+        const data = await prisma.kategoriProduk.findUnique({
             where: { id },
         });
 

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/kategori-produk/index.ts

@@ -0,0 +1,30 @@
+import Elysia from "elysia";
+import kategoriProdukFindMany from "./findMany";
+import kategoriProdukFindUnique from "./findUnique";
+import kategoriProdukDelete from "./del";
+import kategoriProdukCreate from "./create";
+import kategoriProdukUpdate from "./updt";
+import { t } from "elysia";
+
+const KategoriProduk = new Elysia({
+    prefix: "/kategoriproduk",
+    tags: ["Ekonomi/Kategori Produk"],
+})
+    .get("/find-many", kategoriProdukFindMany)
+    .get("/:id", async (context) => {
+        const response = await kategoriProdukFindUnique(context);
+        return response;
+    })
+    .delete("/del/:id", kategoriProdukDelete)
+    .post("/create", kategoriProdukCreate, {
+        body: t.Object({
+            nama: t.String(),
+        }),
+    })
+    .put("/:id", kategoriProdukUpdate, {
+        body: t.Object({
+            nama: t.String(),
+        }),
+    });
+
+export default KategoriProduk;

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/kategori-produk/updt.ts

@@ -0,0 +1,44 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+export default async function kategoriProdukUpdate(context: Context) {
+  const body = context.body as { nama: string };
+  const id = context.params?.id as string;
+
+  // Validasi ID dan nama
+  if (!id) {
+    return {
+      success: false,
+      message: "ID is required",
+    };
+  }
+
+  if (!body.nama) {
+    return {
+      success: false,
+      message: "Nama is required",
+    };
+  }
+
+  try {
+    const kategoriProduk = await prisma.kategoriProduk.update({
+      where: { id },
+      data: {
+        nama: body.nama,
+      },
+    });
+
+    return {
+      success: true,
+      message: "Success update kategori produk",
+      data: kategoriProduk,
+    };
+  } catch (error) {
+    console.error("Update error:", error);
+    return {
+      success: false,
+      message: "Gagal update kategori produk",
+      error: error instanceof Error ? error.message : String(error),
+    };
+  }
+}

src/app/api/[[...slugs]]/_lib/ekonomi/pasar-desa/updt.ts

@@ -6,11 +6,10 @@ import path from "path";
 type FormUpdate = {
     nama: string;
     harga: number;
-    satuan: string;
-    alamat: string;
+    alamatUsaha: string;
     imageId: string;
     rating: number;
-    kategoriId: string; // Array of KategoriMakanan IDs
+    kategoriId: string[]; // Array of KategoriMakanan IDs
   };
 
 export default async function pasarDesaUpdate(context: Context){
@@ -18,7 +17,7 @@ export default async function pasarDesaUpdate(context: Context){
         const id = context.params?.id;
         const body = context.body as FormUpdate;
 
-        const { nama, harga, satuan, alamat, imageId, rating, kategoriId } = body;
+        const { nama, harga, alamatUsaha, imageId, rating, kategoriId } = body;
         
         if (!id) {
             return Response.json({
@@ -63,11 +62,12 @@ export default async function pasarDesaUpdate(context: Context){
             data: {
                 nama,
                 harga,
-                satuan,
-                alamat,
+                alamatUsaha,
                 imageId,
                 rating,
-                kategoriId,
+                kategori: {
+                    connect: kategoriId.map((id) => ({ id })),
+                  },
             },
         });
 

src/app/api/[[...slugs]]/_lib/ekonomi/program-kemiskinan/create.ts

@@ -0,0 +1,41 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+type FormCreate = {
+  nama: string;
+  deskripsi: string;
+  ikonUrl?: string; // optional karena boleh null
+  statistik?: {
+    tahun: number;
+    jumlah: number;
+  };
+};
+
+export default async function programKemiskinanCreate(context: Context) {
+  const body = context.body as FormCreate;
+
+  const program = await prisma.programKemiskinan.create({
+    data: {
+      nama: body.nama,
+      deskripsi: body.deskripsi,
+      ikonUrl: body.ikonUrl,
+      statistik: body.statistik
+        ? {
+            create: {
+              tahun: Number(body.statistik.tahun),
+              jumlah: Number(body.statistik.jumlah),
+            },
+          }
+        : undefined,
+    },
+    include: {
+      statistik: true, // untuk menampilkan data relasinya juga
+    },
+  });
+
+  return {
+    success: true,
+    message: "Success create program kemiskinan dengan relasi statistik",
+    data: program,
+  };
+}

src/app/api/[[...slugs]]/_lib/ekonomi/program-kemiskinan/del.ts

@@ -0,0 +1,19 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+export default async function programKemiskinanDelete(context: Context) {
+  const id = context.params.id as string;
+
+  await prisma.programKemiskinan.delete({
+    where: { id },
+    include: {
+        statistik: true,
+    }
+  });
+
+  return {
+    status: 200,
+    success: true,
+    message: "Success delete program kemiskinan",
+  };
+}

src/app/api/[[...slugs]]/_lib/ekonomi/program-kemiskinan/findMany.ts

@@ -0,0 +1,18 @@
+import prisma from "@/lib/prisma";
+
+export default async function programKemiskinanFindMany() {
+  const data = await prisma.programKemiskinan.findMany({
+    include: {
+      statistik: true, // ikut sertakan relasinya
+    },
+    orderBy: {
+      createdAt: "desc",
+    },
+  });
+
+  return {
+    success: true,
+    message: "Success get all program layanan",
+    data,
+  };
+}

src/app/api/[[...slugs]]/_lib/ekonomi/program-kemiskinan/findUnique.ts

@@ -0,0 +1,49 @@
+import prisma from "@/lib/prisma";
+
+export default async function programKemiskinanFindUnique(request: Request) {
+    const url = new URL(request.url);
+    const pathSegments = url.pathname.split('/');
+    const id = pathSegments[pathSegments.length - 1];
+    
+    if (!id) {
+        return {
+            success: false,
+            message: "ID is required",
+        }
+    }
+
+    try {
+        if (typeof id !== 'string') {
+            return {
+                success: false,
+                message: "ID is required",
+            }
+        }
+
+        const data = await prisma.programKemiskinan.findUnique({
+            where: { id },
+            include: {
+                statistik: true,
+            }
+        });
+
+        if (!data) {
+            return {
+                success: false,
+                message: "Data not found",
+            }
+        }
+
+        return {
+            success: true,
+            message: "Success get program layanan",
+            data,
+        }
+    } catch (error) {
+        console.error("Find by ID error:", error);
+        return {
+            success: false,
+            message: "Gagal mengambil data: " + (error instanceof Error ? error.message : 'Unknown error'),
+        }
+    }
+}

src/app/api/[[...slugs]]/_lib/ekonomi/program-kemiskinan/index.ts

@@ -0,0 +1,42 @@
+import Elysia, { t } from "elysia";
+import programKemiskinanCreate from "./create";
+import programKemiskinanDelete from "./del";
+import programKemiskinanFindUnique from "./findUnique";
+import programKemiskinanUpdate from "./updt";
+import programKemiskinanFindMany from "./findMany";
+
+const ProgramKemiskinan = new Elysia({
+    prefix: '/programkemiskinan', tags: ['Ekonomi / Program Kemiskinan']
+})
+.post("/create", programKemiskinanCreate, {
+    body: t.Object({
+        nama: t.String(),
+        deskripsi: t.String(),
+        ikonUrl: t.String(),
+        statistik: t.Object({
+            tahun: t.String(),
+            jumlah: t.String(),
+        }),
+    }),
+})
+.delete("/del/:id", programKemiskinanDelete)
+.get("/find-many", programKemiskinanFindMany)
+.get("/:id", async (context) => {
+    const response = await programKemiskinanFindUnique(new Request(context.request));
+    return response;
+})
+.put("/:id", async (context) => {
+    const response = await programKemiskinanUpdate(context);
+    return response;
+}, {
+    body: t.Object({
+        nama: t.String(),
+        deskripsi: t.String(),
+        ikonUrl: t.String(),
+        statistik: t.Object({
+            tahun: t.String(),
+            jumlah: t.String(),
+        }),
+    }),
+})
+export default ProgramKemiskinan;

src/app/api/[[...slugs]]/_lib/ekonomi/program-kemiskinan/updt.ts

@@ -0,0 +1,71 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+type FormUpdate = {
+  nama: string;
+  deskripsi: string;
+  ikonUrl?: string;
+  statistik?: {
+    tahun: number;
+    jumlah: number;
+  };
+};
+
+export default async function programKemiskinanUpdate(context: Context) {
+  const id = context.params.id as string;
+  const body = context.body as FormUpdate;
+
+  try {
+    // cari ID statistik yang terkait
+    const existing = await prisma.programKemiskinan.findUnique({
+      where: { id },
+      include: { statistik: true },
+    });
+
+    if (!existing) {
+      return new Response(JSON.stringify({ success: false, message: "Program tidak ditemukan" }), { status: 404 });
+    }
+
+    // update statistik (bisa update atau create kalau belum ada)
+    let statistikUpdate;
+
+    if (existing.statistikId) {
+      statistikUpdate = await prisma.statistikKemiskinan.update({
+        where: { id: existing.statistikId },
+        data: {
+          tahun: Number(body.statistik?.tahun),
+          jumlah: Number(body.statistik?.jumlah),
+        },
+      });
+    } else {
+      statistikUpdate = await prisma.statistikKemiskinan.create({
+        data: {
+          tahun: Number(body.statistik?.tahun),
+          jumlah: Number(body.statistik?.jumlah),
+        },
+      });
+    }
+
+    const program = await prisma.programKemiskinan.update({
+      where: { id },
+      data: {
+        nama: body.nama,
+        deskripsi: body.deskripsi,
+        ikonUrl: body.ikonUrl,
+        statistik: {
+          connect: { id: statistikUpdate.id }, // konek ke statistik baru atau yang diperbarui
+        },
+      },
+      include: { statistik: true },
+    });
+
+    return new Response(JSON.stringify({ success: true, data: program }), {
+      status: 200,
+    });
+  } catch (err) {
+    console.error("Gagal update:", err);
+    return new Response(JSON.stringify({ success: false, message: "Gagal update program" }), {
+      status: 500,
+    });
+  }
+}

src/app/api/[[...slugs]]/_lib/keamanan/laporan-publik/create.ts

@@ -5,8 +5,8 @@ type LaporanPublikInput = {
   judul: string;
   lokasi: string;
   tanggalWaktu: string;
-  status: "SELESAI" | "PROSES" | "GAGAL";
-  penanganan: string[];
+  status: "Selesai" | "Proses" | "Gagal";
+  penanganan: string;
   kronologi?: string;
 };
 
@@ -21,9 +21,9 @@ const laporanPublikCreate = async (context: Context) => {
             tanggalWaktu: new Date(tanggalWaktu),
             status,
             penanganan: {
-                create: penanganan.map((item) => ({
-                    deskripsi: item,
-                })),
+                create: {
+                    deskripsi: penanganan,
+                },
             },
             kronologi,
         },

src/app/api/[[...slugs]]/_lib/keamanan/laporan-publik/index.ts

@@ -15,11 +15,11 @@ const LaporanPublik = new Elysia({
       lokasi: t.String(),
       tanggalWaktu: t.String(), // ISO string
       status: t.Union([
-        t.Literal("SELESAI"),
-        t.Literal("PROSES"),
-        t.Literal("GAGAL"),
+        t.Literal("Selesai"),
+        t.Literal("Proses"),
+        t.Literal("Gagal"),
       ]),
-      penanganan: t.Array(t.String()), // 🛠️ ARRAY of strings
+      penanganan: t.String(), // 🛠️ ARRAY of strings
       kronologi: t.Optional(t.String()),
     }),
   })
@@ -31,11 +31,11 @@ const LaporanPublik = new Elysia({
       lokasi: t.String(),
       tanggalWaktu: t.String(), // ISO string
       status: t.Union([
-        t.Literal("SELESAI"),
-        t.Literal("PROSES"),
-        t.Literal("GAGAL"),
+        t.Literal("Selesai"),
+        t.Literal("Proses"),
+        t.Literal("Gagal"),
       ]),
-      penanganan: t.Array(t.String()), // 🛠️ ARRAY of strings
+      penanganan: t.String(), // 🛠️ ARRAY of strings
       kronologi: t.Optional(t.String()),
     }),
   })

src/app/api/[[...slugs]]/_lib/keamanan/laporan-publik/updt.ts

@@ -5,8 +5,8 @@ type LaporanPublikUpdateInput = {
   judul: string;
   lokasi: string;
   tanggalWaktu: string;
-  status: "SELESAI" | "PROSES" | "GAGAL";
-  penanganan: string[];
+  status: "Selesai" | "Proses" | "Gagal";
+  penanganan: string;
   kronologi?: string;
 };
 
@@ -32,9 +32,9 @@ const LaporanPublikUpdate = async (context: Context) => {
       status,
       kronologi,
       penanganan: {
-        create: penanganan.map((item) => ({
-          deskripsi: item,
-        })),
+        create: {
+          deskripsi: penanganan,
+        },
       },
     },
     include: {

src/app/api/[[...slugs]]/_lib/keamanan/tips-keamanan/del.ts

@@ -46,8 +46,9 @@ const menuTipsKeamananDelete = async (context: Context) => {
     });
 
     return {
-        status: 200,
-        body: deleted,
+        success: true,
+        message: "Success delete menu tips keamanan",
+        data: deleted,
     };
 };
 export default menuTipsKeamananDelete;