API/UI Admin Ekonomi Lowongan kerja

package.json

@@ -15,7 +15,7 @@
   "dependencies": {
     "@cubejs-client/core": "^0.31.0",
     "@elysiajs/cors": "^1.2.0",
-    "@elysiajs/eden": "^1.2.0",
+    "@elysiajs/eden": "^1.3.2",
     "@elysiajs/static": "^1.3.0",
     "@elysiajs/stream": "^1.1.0",
     "@elysiajs/swagger": "^1.2.0",
@@ -46,7 +46,7 @@
     "bun": "^1.2.2",
     "chart.js": "^4.4.8",
     "dayjs": "^1.11.13",
-    "elysia": "^1.2.12",
+    "elysia": "^1.3.5",
     "embla-carousel-autoplay": "^8.5.2",
     "embla-carousel-react": "^7.1.0",
     "form-data": "^4.0.2",

prisma/migrations/20250701093155_nico_1_jul_25_test1/migration.sql

@@ -0,0 +1,75 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `deletedAt` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `deskripsi` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `imageId` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `isActive` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `name` on the `KontakDarurat` table. All the data in the column will be lost.
+  - Added the required column `nama` to the `KontakDarurat` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- DropForeignKey
+ALTER TABLE "KontakDarurat" DROP CONSTRAINT "KontakDarurat_imageId_fkey";
+
+-- AlterTable
+ALTER TABLE "KontakDarurat" DROP COLUMN "deletedAt",
+DROP COLUMN "deskripsi",
+DROP COLUMN "imageId",
+DROP COLUMN "isActive",
+DROP COLUMN "name",
+ADD COLUMN     "icon" TEXT,
+ADD COLUMN     "nama" TEXT NOT NULL,
+ADD COLUMN     "urutan" INTEGER;
+
+-- CreateTable
+CREATE TABLE "KontakItem" (
+    "id" TEXT NOT NULL,
+    "nama" TEXT NOT NULL,
+    "nomorTelepon" TEXT NOT NULL,
+    "icon" TEXT,
+    "kategoriId" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "KontakItem_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "PasarDesa" (
+    "id" TEXT NOT NULL,
+    "nama" TEXT NOT NULL,
+    "harga" INTEGER NOT NULL,
+    "satuan" TEXT NOT NULL,
+    "alamat" TEXT NOT NULL,
+    "imageId" TEXT NOT NULL,
+    "rating" DOUBLE PRECISION NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+    "deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "isActive" BOOLEAN NOT NULL DEFAULT true,
+    "kategoriId" TEXT NOT NULL,
+
+    CONSTRAINT "PasarDesa_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "KategoriMakanan" (
+    "id" TEXT NOT NULL,
+    "nama" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+    "deletedAt" TIMESTAMP(3),
+    "isActive" BOOLEAN NOT NULL DEFAULT true,
+
+    CONSTRAINT "KategoriMakanan_pkey" PRIMARY KEY ("id")
+);
+
+-- AddForeignKey
+ALTER TABLE "KontakItem" ADD CONSTRAINT "KontakItem_kategoriId_fkey" FOREIGN KEY ("kategoriId") REFERENCES "KontakDarurat"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PasarDesa" ADD CONSTRAINT "PasarDesa_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PasarDesa" ADD CONSTRAINT "PasarDesa_kategoriId_fkey" FOREIGN KEY ("kategoriId") REFERENCES "KategoriMakanan"("id") ON DELETE RESTRICT ON UPDATE CASCADE;

prisma/migrations/20250701093435_nico_1_jul_25_test2/migration.sql

@@ -0,0 +1,38 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `icon` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `nama` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `urutan` on the `KontakDarurat` table. All the data in the column will be lost.
+  - You are about to drop the column `deletedAt` on the `KontakDaruratKeamanan` table. All the data in the column will be lost.
+  - You are about to drop the column `isActive` on the `KontakDaruratKeamanan` table. All the data in the column will be lost.
+  - You are about to drop the column `kontak` on the `KontakDaruratKeamanan` table. All the data in the column will be lost.
+  - Added the required column `deskripsi` to the `KontakDarurat` table without a default value. This is not possible if the table is not empty.
+  - Added the required column `imageId` to the `KontakDarurat` table without a default value. This is not possible if the table is not empty.
+  - Added the required column `name` to the `KontakDarurat` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- DropForeignKey
+ALTER TABLE "KontakItem" DROP CONSTRAINT "KontakItem_kategoriId_fkey";
+
+-- AlterTable
+ALTER TABLE "KontakDarurat" DROP COLUMN "icon",
+DROP COLUMN "nama",
+DROP COLUMN "urutan",
+ADD COLUMN     "deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+ADD COLUMN     "deskripsi" TEXT NOT NULL,
+ADD COLUMN     "imageId" TEXT NOT NULL,
+ADD COLUMN     "isActive" BOOLEAN NOT NULL DEFAULT true,
+ADD COLUMN     "name" TEXT NOT NULL;
+
+-- AlterTable
+ALTER TABLE "KontakDaruratKeamanan" DROP COLUMN "deletedAt",
+DROP COLUMN "isActive",
+DROP COLUMN "kontak",
+ADD COLUMN     "urutan" INTEGER;
+
+-- AddForeignKey
+ALTER TABLE "KontakDarurat" ADD CONSTRAINT "KontakDarurat_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "KontakItem" ADD CONSTRAINT "KontakItem_kategoriId_fkey" FOREIGN KEY ("kategoriId") REFERENCES "KontakDaruratKeamanan"("id") ON DELETE RESTRICT ON UPDATE CASCADE;

prisma/schema.prisma

@@ -82,6 +82,12 @@ model FileStorage {
   MenuTipsKeamanan MenuTipsKeamanan[]
 
   Pelapor Pelapor[]
+
+  PasarDesa PasarDesa[]
+
+  KontakDaruratKeamanan KontakDaruratKeamanan[]
+
+  KontakItem KontakItem[]
 }
 
 //========================================= MENU PPID ========================================= //
@@ -924,18 +930,27 @@ model LayananPolsek {
   PolsekTerdekat PolsekTerdekat[]
 }
 
-
-
 // ========================================= KONTAK DARURAT ========================================= //
 model KontakDaruratKeamanan {
-  id        String   @id @default(cuid())
-  nama      String // contoh: "Polisi", "Ambulans", "Pemadam Kebakaran"
-  kontak    String // contoh: "081xxxxxxxxxx"
-  icon      String? // opsional, untuk simpan nama icon-nya jika mau
-  createdAt DateTime @default(now())
-  updatedAt DateTime @updatedAt
-  deletedAt DateTime @default(now())
-  isActive  Boolean  @default(true)
+  id          String       @id @default(uuid())
+  nama        String       // contoh: "Layanan Darurat", "Fasilitas Kesehatan"
+  image       FileStorage? @relation(fields: [imageId], references: [id])
+  imageId     String?
+  kontakItems KontakItem[]
+  createdAt   DateTime     @default(now())
+  updatedAt   DateTime     @updatedAt
+}
+
+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
 }
 
 // ========================================= PENCEGAHAN KRIMINALITAS ========================================= //
@@ -1031,3 +1046,48 @@ model MenuTipsKeamanan {
   deletedAt DateTime     @default(now())
   isActive  Boolean      @default(true)
 }
+
+// ========================================= 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
+}
+
+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[]
+}
+// ========================================= 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)
+  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())
+}

src/app/admin/(dashboard)/_state/ekonomi/lowongan-kerja.ts

@@ -0,0 +1,225 @@
+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({
+  posisi: z.string(),
+  namaPerusahaan: z.string(),
+  lokasi: z.string(),
+  tipePekerjaan: z.string(),
+  gaji: z.string(),
+  deskripsi: z.string(),
+  kualifikasi: z.string(),
+});
+
+const defaultForm = {
+  posisi: "",
+  namaPerusahaan: "",
+  lokasi: "",
+  tipePekerjaan: "",
+  gaji: "",
+  deskripsi: "",
+  kualifikasi: "",
+};
+
+const lowonganKerjaState = proxy({
+  create: {
+    form: { ...defaultForm },
+    loading: false,
+    async create() {
+      const cek = templateForm.safeParse(lowonganKerjaState.create.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        lowonganKerjaState.create.loading = true;
+        const res = await ApiFetch.api.ekonomi.lowongankerja["create"].post(
+          lowonganKerjaState.create.form
+        );
+        if (res.status === 200) {
+          lowonganKerjaState.create.loading = false;
+          return toast.success("success create");
+        }
+        console.log(res);
+        return toast.error("failed create");
+      } catch (error) {
+        console.log((error as Error).message);
+      } finally {
+        lowonganKerjaState.create.loading = false;
+      }
+    },
+    resetForm() {
+      lowonganKerjaState.create.form = { ...defaultForm };
+    },
+  },
+  findMany: {
+    data: null as
+      | Prisma.LowonganPekerjaanGetPayload<{
+          omit: { isActive: true };
+        }>[]
+      | null,
+    async load() {
+      const res = await ApiFetch.api.ekonomi.lowongankerja["find-many"].get();
+      if (res.status === 200) {
+        lowonganKerjaState.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.LowonganPekerjaanGetPayload<{
+      omit: { isActive: true };
+    }> | null,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/ekonomi/lowongankerja/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          lowonganKerjaState.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          lowonganKerjaState.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        lowonganKerjaState.findUnique.data = null;
+      }
+    },
+  },
+  delete: {
+    loading: false,
+    async byId(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+
+      try {
+        lowonganKerjaState.delete.loading = true;
+        const response = await fetch(`/api/ekonomi/lowongankerja/del/${id}`, {
+          method: "DELETE",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(result.message || "Lowongan kerja berhasil dihapus");
+          await lowonganKerjaState.findMany.load(); // refresh list
+        } else {
+          toast.error(result?.message || "Gagal menghapus lowongan kerja");
+        }
+      } catch (error) {
+        console.error("Error deleting data:", error);
+        toast.error("Terjadi kesalahan saat menghapus lowongan kerja");
+      } finally {
+        lowonganKerjaState.delete.loading = false;
+      }
+    },
+  },
+  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/lowongankerja/${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 = {
+            posisi: data.posisi,
+            namaPerusahaan: data.namaPerusahaan,
+            lokasi: data.lokasi,
+            tipePekerjaan: data.tipePekerjaan,
+            gaji: data.gaji,
+            deskripsi: data.deskripsi,
+            kualifikasi: data.kualifikasi,
+          };
+          return data;
+        } else {
+          throw new Error(
+            result?.message || "Gagal memuat data lowongan kerja"
+          );
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        toast.error(
+          error instanceof Error ? error.message : "Gagal memuat data"
+        );
+        return null;
+      }
+    },
+    async update() {
+      const cek = templateForm.safeParse(lowonganKerjaState.update.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        lowonganKerjaState.update.loading = true;
+        const response = await fetch(`/api/ekonomi/lowongankerja/${this.id}`, {
+          method: "PUT",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({
+            posisi: this.form.posisi,
+            namaPerusahaan: this.form.namaPerusahaan,
+            lokasi: this.form.lokasi,
+            tipePekerjaan: this.form.tipePekerjaan,
+            gaji: this.form.gaji,
+            deskripsi: this.form.deskripsi,
+            kualifikasi: this.form.kualifikasi,
+          }),
+        });
+        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 lowongan kerja");
+            await lowonganKerjaState.findMany.load(); // refresh list
+            return true;
+        } else {
+            throw new Error(result.message || "Gagal update lowongan kerja");
+        }
+      } catch (error) {
+        console.error("Error updating data:", error);
+        toast.error(error instanceof Error ? error.message : "Terjadi kesalahan saat mengupdate lowongan kerja");
+        return false;
+      } finally {
+        lowonganKerjaState.update.loading = false;
+      }
+    },
+    reset() {
+      lowonganKerjaState.update.id = "";
+      lowonganKerjaState.update.form = { ...defaultForm };
+    },
+  },
+});
+
+export default lowonganKerjaState;

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

@@ -0,0 +1,230 @@
+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(3, "Nama minimal 3 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"),
+  imageId: z.string().min(1, "Gambar wajib dipilih"),
+  rating: z.number().min(1, "Rating minimal 1"),
+  kategoriId: z.string().min(1, "Kategori wajib dipilih"),
+});
+
+const defaultForm = {
+  nama: "",
+  harga: 0,
+  satuan: "",
+  alamat: "",
+  imageId: "",
+  rating: 0,
+  kategoriId: "",
+};
+
+const pasarDesaState = proxy({
+  create: {
+    form: { ...defaultForm },
+    loading: false,
+    async create() {
+      const cek = templateForm.safeParse(pasarDesaState.create.form);
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+      try {
+        pasarDesaState.create.loading = true;
+        const res = await ApiFetch.api.ekonomi.pasardesa["create"].post(
+          pasarDesaState.create.form
+        );
+        if (res.status === 200) {
+          pasarDesaState.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 {
+        pasarDesaState.create.loading = false;
+      }
+    },
+  },
+  findMany: {
+    data: null as
+      | Prisma.PasarDesaGetPayload<{
+          include: { kategori: true; image: true };
+        }>[]
+      | null,
+    async load() {
+      const res = await ApiFetch.api.ekonomi.pasardesa["find-many"].get();
+      if (res.status === 200) {
+        pasarDesaState.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.PasarDesaGetPayload<{
+      include: { kategori: true; image: true };
+    }> | null,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/ekonomi/pasardesa/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          pasarDesaState.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          pasarDesaState.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        pasarDesaState.findUnique.data = null;
+      }
+    },
+  },
+  delete: {
+    loading: false,
+    async byId(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+
+      try {
+        pasarDesaState.delete.loading = true;
+
+        const response = await fetch(`/api/ekonomi/pasardesa/del/${id}`, {
+          method: "DELETE",
+          headers: {
+            "Content-Type": "application/json",
+          },
+        });
+
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(result.message || "Pasar desa berhasil dihapus");
+          await pasarDesaState.findMany.load(); // refresh list
+        } else {
+          toast.error(result?.message || "Gagal menghapus pasar desa");
+        }
+      } catch (error) {
+        console.error("Gagal delete:", error);
+        toast.error("Terjadi kesalahan saat menghapus pasar desa");
+      } finally {
+        pasarDesaState.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/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,
+              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);
+          toast.error(
+            error instanceof Error ? error.message : "Gagal memuat data"
+          );
+          return null;
+        }
+      },
+  
+      async update() {
+        const cek = templateForm.safeParse(pasarDesaState.edit.form);
+        if (!cek.success) {
+          const err = `[${cek.error.issues
+            .map((v) => `${v.path.join(".")}`)
+            .join("\n")}] required`;
+          return toast.error(err);
+        }
+  
+        try {
+          pasarDesaState.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,
+                satuan: this.form.satuan,
+                alamat: this.form.alamat,
+                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 pasarDesaState.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 {
+          pasarDesaState.edit.loading = false;
+        }
+      },
+      reset() {
+        pasarDesaState.edit.id = "";
+        pasarDesaState.edit.form = { ...defaultForm };
+      },
+    },
+});
+
+export default pasarDesaState;

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

@@ -0,0 +1,259 @@
+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"),
+  imageId: z.string().nonempty(),
+  kontakItems: z.array(
+    z.object({
+      nama: z.string().min(1, "Nama minimal 1 karakter"),
+      nomorTelepon: z.string().min(1, "Nomor Telepon minimal 1 karakter"),
+      imageId: z.string().nonempty(),
+    })
+  ),
+});
+
+const defaultForm = {
+  nama: "",
+  imageId: "",
+  kontakItems: [
+    {
+      nama: "",
+      nomorTelepon: "",
+      imageId: "",
+    },
+  ],
+};
+
+const kontakDaruratKeamananState = proxy({
+  create: {
+    form: { ...defaultForm },
+    loading: false,
+    async create() {
+      const cek = templateForm.safeParse(
+        kontakDaruratKeamananState.create.form
+      );
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+      try {
+        kontakDaruratKeamananState.create.loading = true;
+        const res = await ApiFetch.api.keamanan.kontakdaruratkeamanan[
+          "create"
+        ].post(kontakDaruratKeamananState.create.form);
+        if (res.status === 200) {
+          kontakDaruratKeamananState.findMany.load();
+          return toast.success("success create");
+        }
+        console.log(res);
+        return toast.error("failed create");
+      } catch (error) {
+        console.log((error as Error).message);
+      } finally {
+        kontakDaruratKeamananState.create.loading = false;
+      }
+    },
+  },
+  findMany: {
+    data: null as
+      | Prisma.KontakDaruratKeamananGetPayload<{
+          include: {
+            kontakItems: true;
+            image: true;
+          };
+        }>[]
+      | null,
+    async load() {
+      const res = await ApiFetch.api.keamanan.kontakdaruratkeamanan[
+        "find-many"
+      ].get();
+      if (res.status === 200) {
+        kontakDaruratKeamananState.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.KontakDaruratKeamananGetPayload<{
+      include: {
+        kontakItems: {
+          include: {
+            image: true;
+          };
+        };
+        image: true;
+      };
+    }> | null,
+    loading: false,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/keamanan/kontakdaruratkeamanan/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          kontakDaruratKeamananState.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          kontakDaruratKeamananState.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        kontakDaruratKeamananState.findUnique.data = null;
+      }
+    },
+  },
+  delete: {
+    loading: false,
+    async byId(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+      try {
+        kontakDaruratKeamananState.delete.loading = true;
+        const response = await fetch(
+          `/api/keamanan/kontakdaruratkeamanan/del/${id}`,
+          {
+            method: "DELETE",
+            headers: {
+              "Content-Type": "application/json",
+            },
+          }
+        );
+
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(result.message || "Kontak darurat berhasil dihapus");
+          await kontakDaruratKeamananState.findMany.load(); // refresh list
+        } else {
+          toast.error(result?.message || "Gagal menghapus kontak darurat");
+        }
+      } catch (error) {
+        console.error("Gagal delete:", error);
+        toast.error("Terjadi kesalahan saat menghapus kontak darurat");
+      } finally {
+        kontakDaruratKeamananState.delete.loading = false;
+      }
+    },
+  },
+  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/keamanan/kontakdaruratkeamanan/${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,
+            imageId: data.imageId,
+            kontakItems: [
+              {
+                nama: data.kontakItems.nama,
+                nomorTelepon: data.kontakItems.nomorTelepon,
+                imageId: data.kontakItems.imageId,
+              },
+            ],
+          };
+          return data;
+        } else {
+          throw new Error(result?.message || "Gagal memuat data");
+        }
+      } catch (error) {
+        console.error("Error loading kontak darurat:", error);
+        toast.error(
+          error instanceof Error ? error.message : "Gagal memuat data"
+        );
+        return null;
+      }
+    },
+
+    async update() {
+      const cek = templateForm.safeParse(
+        kontakDaruratKeamananState.update.form
+      );
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        kontakDaruratKeamananState.update.loading = true;
+        const response = await fetch(
+          `/api/keamanan/kontakdaruratkeamanan/${this.id}`,
+          {
+            method: "PUT",
+            headers: {
+              "Content-Type": "application/json",
+            },
+            body: JSON.stringify({
+              nama: this.form.nama,
+              imageId: this.form.imageId,
+              kontakItems: [
+                {
+                  nama: this.form.kontakItems[0].nama,
+                  nomorTelepon: this.form.kontakItems[0].nomorTelepon,
+                  imageId: this.form.kontakItems[0].imageId,
+                },
+              ],
+            }),
+          }
+        );
+        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 kontak darurat");
+          await kontakDaruratKeamananState.findMany.load(); // refresh list
+          return true;
+        } else {
+          throw new Error(result.message || "Gagal mengupdate kontak darurat");
+        }
+      } catch (error) {
+        console.error("Error updating kontak darurat:", error);
+        toast.error(
+          error instanceof Error
+            ? error.message
+            : "Gagal mengupdate kontak darurat"
+        );
+        return false;
+      } finally {
+        kontakDaruratKeamananState.update.loading = false;
+      }
+    },
+    reset() {
+      kontakDaruratKeamananState.update.id = "";
+      kontakDaruratKeamananState.update.form = { ...defaultForm };
+    },
+  },
+});
+
+export default kontakDaruratKeamananState;

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

@@ -0,0 +1,314 @@
+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({
+  pencegahanKriminalitas: z.object({
+    programKeamanan: z.object({
+      nama: z.string().min(1, "Nama minimal 1 karakter"),
+      deskripsi: z.string().min(1, "Deskripsi minimal 1 karakter"),
+      slug: z.string().min(1, "Slug minimal 1 karakter"),
+    }),
+    tipsKeamanan: z.object({
+      judul: z.string().min(1, "Judul minimal 1 karakter"),
+      konten: z.string().min(1, "Konten minimal 1 karakter"),
+      slug: z.string().min(1, "Slug minimal 1 karakter"),
+    }),
+    videoKeamanan: z.object({
+      judul: z.string().min(1, "Judul minimal 1 karakter"),
+      deskripsi: z.string().min(1, "Deskripsi minimal 1 karakter"),
+      videoUrl: z.string().min(1, "Video URL minimal 1 karakter"),
+      slug: z.string().min(1, "Slug minimal 1 karakter"),
+    }),
+  }),
+});
+
+const defaultForm = {
+  pencegahanKriminalitas: {
+    programKeamanan: {
+      nama: "",
+      deskripsi: "",
+      slug: "",
+    },
+    tipsKeamanan: {
+      judul: "",
+      konten: "",
+      slug: "",
+    },
+    videoKeamanan: {
+      judul: "",
+      deskripsi: "",
+      videoUrl: "",
+      slug: "",
+    },
+  },
+};
+
+const pencegahanKriminalitasState = proxy({
+  create: {
+    form: { ...defaultForm },
+    loading: false,
+    async create() {
+      const cek = templateForm.safeParse(
+        pencegahanKriminalitasState.create.form
+      );
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+      try {
+        pencegahanKriminalitasState.create.loading = true;
+        const res = await ApiFetch.api.keamanan.pencegahankriminalitas[
+          "create"
+        ].post(pencegahanKriminalitasState.create.form.pencegahanKriminalitas);
+        if (res.status === 200) {
+          pencegahanKriminalitasState.findMany.load();
+          return toast.success("success create");
+        }
+        console.log(res);
+        return toast.error("failed create");
+      } catch (error) {
+        console.log((error as Error).message);
+      } finally {
+        pencegahanKriminalitasState.create.loading = false;
+      }
+    },
+  },
+  findMany: {
+    data: null as
+      | Prisma.PencegahanKriminalitasGetPayload<{
+          include: {
+            programKeamanan: true;
+            tipsKeamanan: true;
+            videoKeamanan: true;
+          };
+        }>[]
+      | null,
+    async load() {
+      const res = await ApiFetch.api.keamanan.pencegahankriminalitas[
+        "find-many"
+      ].get();
+      if (res.status === 200) {
+        pencegahanKriminalitasState.findMany.data = res.data?.data ?? [];
+      }
+    },
+  },
+  findUnique: {
+    data: null as Prisma.PencegahanKriminalitasGetPayload<{
+      include: {
+        programKeamanan: true;
+        tipsKeamanan: true;
+        videoKeamanan: true;
+      };
+    }> | null,
+    loading: false,
+    async load(id: string) {
+      try {
+        const res = await fetch(`/api/keamanan/pencegahankriminalitas/${id}`);
+        if (res.ok) {
+          const data = await res.json();
+          pencegahanKriminalitasState.findUnique.data = data.data ?? null;
+        } else {
+          console.error("Failed to fetch data", res.status, res.statusText);
+          pencegahanKriminalitasState.findUnique.data = null;
+        }
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        pencegahanKriminalitasState.findUnique.data = null;
+      }
+    },
+  },
+  delete: {
+    loading: false,
+    async byId(id: string) {
+      if (!id) return toast.warn("ID tidak valid");
+      try {
+        pencegahanKriminalitasState.delete.loading = true;
+        const response = await fetch(
+          `/api/keamanan/pencegahankriminalitas/del/${id}`,
+          {
+            method: "DELETE",
+            headers: {
+              "Content-Type": "application/json",
+            },
+          }
+        );
+
+        const result = await response.json();
+
+        if (response.ok && result?.success) {
+          toast.success(
+            result.message || "Pencegahan kriminalitas berhasil dihapus"
+          );
+          await pencegahanKriminalitasState.findMany.load(); // refresh list
+        } else {
+          toast.error(
+            result?.message || "Gagal menghapus pencegahan kriminalitas"
+          );
+        }
+      } catch (error) {
+        console.error("Gagal delete:", error);
+        toast.error("Terjadi kesalahan saat menghapus pencegahan kriminalitas");
+      } finally {
+        pencegahanKriminalitasState.delete.loading = false;
+      }
+    },
+  },
+  update: {
+    id: "",
+    form: { ...defaultForm },
+    loading: false,
+
+    async load(id: string) {
+      if (!id) {
+        toast.warn("ID tidak valid");
+        return null;
+      }
+      try {
+        pencegahanKriminalitasState.update.loading = true;
+        const response = await fetch(
+          `/api/keamanan/pencegahankriminalitas/${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;
+          pencegahanKriminalitasState.update.id = data.id;
+          pencegahanKriminalitasState.update.form = {
+            pencegahanKriminalitas: {
+              programKeamanan: {
+                nama: data.programKeamanan.nama,
+                deskripsi: data.programKeamanan.deskripsi,
+                slug: data.programKeamanan.slug,
+              },
+              tipsKeamanan: {
+                judul: data.tipsKeamanan.judul,
+                konten: data.tipsKeamanan.konten,
+                slug: data.tipsKeamanan.slug,
+              },
+              videoKeamanan: {
+                judul: data.videoKeamanan.judul,
+                deskripsi: data.videoKeamanan.deskripsi,
+                videoUrl: data.videoKeamanan.videoUrl,
+                slug: data.videoKeamanan.slug,
+              },
+            },
+          };
+          return data;
+        } else {
+          throw new Error(result?.message || "Gagal memuat data");
+        }
+      } catch (error) {
+        console.error("Gagal update:", error);
+        toast.error(
+          "Terjadi kesalahan saat mengupdate pencegahan kriminalitas"
+        );
+        return null;
+      }
+    },
+
+    async update() {
+      const cek = templateForm.safeParse(
+        pencegahanKriminalitasState.update.form
+      );
+      if (!cek.success) {
+        const err = `[${cek.error.issues
+          .map((v) => `${v.path.join(".")}`)
+          .join("\n")}] required`;
+        return toast.error(err);
+      }
+
+      try {
+        pencegahanKriminalitasState.update.loading = true;
+        const response = await fetch(
+          `/api/keamanan/pencegahankriminalitas/${pencegahanKriminalitasState.update.id}`,
+          {
+            method: "PUT",
+            headers: {
+              "Content-Type": "application/json",
+            },
+            body: JSON.stringify({
+              pencegahanKriminalitas: {
+                programKeamanan: {
+                  nama: pencegahanKriminalitasState.update.form
+                    .pencegahanKriminalitas.programKeamanan.nama,
+                  deskripsi:
+                    pencegahanKriminalitasState.update.form
+                      .pencegahanKriminalitas.programKeamanan.deskripsi,
+                  slug: pencegahanKriminalitasState.update.form
+                    .pencegahanKriminalitas.programKeamanan.slug,
+                },
+                tipsKeamanan: {
+                  judul:
+                    pencegahanKriminalitasState.update.form
+                      .pencegahanKriminalitas.tipsKeamanan.judul,
+                  konten:
+                    pencegahanKriminalitasState.update.form
+                      .pencegahanKriminalitas.tipsKeamanan.konten,
+                  slug: pencegahanKriminalitasState.update.form
+                    .pencegahanKriminalitas.tipsKeamanan.slug,
+                },
+                videoKeamanan: {
+                  judul:
+                    pencegahanKriminalitasState.update.form
+                      .pencegahanKriminalitas.videoKeamanan.judul,
+                  deskripsi:
+                    pencegahanKriminalitasState.update.form
+                      .pencegahanKriminalitas.videoKeamanan.deskripsi,
+                  videoUrl:
+                    pencegahanKriminalitasState.update.form
+                      .pencegahanKriminalitas.videoKeamanan.videoUrl,
+                  slug: pencegahanKriminalitasState.update.form
+                    .pencegahanKriminalitas.videoKeamanan.slug,
+                },
+              },
+            }),
+          }
+        );
+        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 pencegahan kriminalitas");
+          await pencegahanKriminalitasState.findMany.load(); // refresh list
+          return true;
+        } else {
+          throw new Error(
+            result.message || "Gagal mengupdate pencegahan kriminalitas"
+          );
+        }
+      } catch (error) {
+        console.error("Gagal update:", error);
+        toast.error(
+          error instanceof Error
+            ? error.message
+            : "Gagal mengupdate pencegahan kriminalitas"
+        );
+        return false;
+      } finally {
+        pencegahanKriminalitasState.update.loading = false;
+      }
+    },
+    reset() {
+      pencegahanKriminalitasState.update.id = "";
+      pencegahanKriminalitasState.update.form = { ...defaultForm };
+    },
+  },
+});
+export default pencegahanKriminalitasState;

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

@@ -5,16 +5,16 @@ import { proxy } from "valtio";
 import { z } from "zod";
 
 const templateForm = z.object({
-  nama: z.string().min(3, "Nama minimal 3 karakter"),
-  jarakKeDesa: z.string().min(3, "Jarak minimal 3 karakter"),
-  alamat: z.string().min(3, "Alamat minimal 3 karakter"),
-  nomorTelepon: z.string().min(3, "Nomor Telepon minimal 3 karakter"),
-  jamOperasional: z.string().min(3, "Jam Operasional minimal 3 karakter"),
-  embedMapUrl: z.string().min(3, "Embed Map Url minimal 3 karakter"),
-  namaTempatMaps: z.string().min(3, "Nama Tempat Maps minimal 3 karakter"),
-  alamatMaps: z.string().min(3, "Alamat Maps minimal 3 karakter"),
-  linkPetunjukArah: z.string().min(3, "Link Petunjuk Arah minimal 3 karakter"),
-  layananPolsekId: z.string().min(3, "Layanan Polsek Id minimal 3 karakter"),
+  nama: z.string().min(1, "Nama minimal 1 karakter"),
+  jarakKeDesa: z.string().min(1, "Jarak minimal 1 karakter"),
+  alamat: z.string().min(1, "Alamat minimal 1 karakter"),
+  nomorTelepon: z.string().min(1, "Nomor Telepon minimal 1 karakter"),
+  jamOperasional: z.string().min(1, "Jam Operasional minimal 1 karakter"),
+  embedMapUrl: z.string().min(1, "Embed Map Url minimal 1 karakter"),
+  namaTempatMaps: z.string().min(1, "Nama Tempat Maps minimal 1 karakter"),
+  alamatMaps: z.string().min(1, "Alamat Maps minimal 1 karakter"),
+  linkPetunjukArah: z.string().min(1, "Link Petunjuk Arah minimal 1 karakter"),
+  layananPolsekId: z.string().min(1, "Layanan Polsek Id minimal 1 karakter"),
 });
 
 const defaultForm = {

src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/[id]/edit/page.tsx

@@ -0,0 +1,155 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
+import lowonganKerjaState from '@/app/admin/(dashboard)/_state/ekonomi/lowongan-kerja';
+import colors from '@/con/colors';
+import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
+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';
+
+
+function EditLowonganKerja() {
+  const lowonganState = useProxy(lowonganKerjaState)
+  const router = useRouter();
+  const params = useParams();
+
+  const [formData, setFormData] = useState({
+    posisi: lowonganKerjaState.update.form.posisi,
+    namaPerusahaan: lowonganKerjaState.update.form.namaPerusahaan,
+    lokasi: lowonganKerjaState.update.form.lokasi,
+    tipePekerjaan: lowonganKerjaState.update.form.tipePekerjaan,
+    gaji: lowonganKerjaState.update.form.gaji,
+    deskripsi: lowonganKerjaState.update.form.deskripsi,
+    kualifikasi: lowonganKerjaState.update.form.kualifikasi,
+  })
+
+  useEffect(() => {
+    const loadLowongan = async () => {
+      const id = params?.id as string;
+      if (!id) return;
+
+      try {
+        const data = await lowonganState.update.load(id); // akses langsung, bukan dari proxy
+        if (data) {
+          setFormData({
+            posisi: data.posisi || '',
+            namaPerusahaan: data.namaPerusahaan || '',
+            lokasi: data.lokasi || '',
+            tipePekerjaan: data.tipePekerjaan || '',
+            gaji: data.gaji || '',
+            deskripsi: data.deskripsi || '',
+            kualifikasi: data.kualifikasi || '',
+          });
+        }
+      } catch (error) {
+        console.error("Error loading lowongan kerja:", error);
+        toast.error("Gagal memuat data lowongan kerja");
+      }
+    };
+
+    loadLowongan();
+  }, [params?.id])
+
+  const handleSubmit = async () => {
+    try {
+      lowonganKerjaState.update.form = {
+        ...lowonganKerjaState.update.form,
+        posisi: formData.posisi,
+        namaPerusahaan: formData.namaPerusahaan,
+        lokasi: formData.lokasi,
+        tipePekerjaan: formData.tipePekerjaan,
+        gaji: formData.gaji,
+        deskripsi: formData.deskripsi,
+        kualifikasi: formData.kualifikasi,
+      }
+      await lowonganState.update.update()
+      toast.success("Lowongan kerja berhasil diperbarui!");
+      router.push("/admin/ekonomi/lowongan-kerja-lokal");
+    } catch (error) {
+      console.error("Error updating lowongan kerja:", error);
+      toast.error("Terjadi kesalahan saat memperbarui lowongan kerja");
+    }
+  }
+
+  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 Lowongan Kerja Lokal</Title>
+          <TextInput
+            value={formData.posisi}
+            onChange={(val) => {
+              formData.posisi = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Posisi</Text>}
+            placeholder='Masukkan posisi'
+          />
+          <TextInput
+            value={formData.namaPerusahaan}
+            onChange={(val) => {
+              formData.namaPerusahaan = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Nama Perusahaan</Text>}
+            placeholder='Masukkan nama perusahaan'
+          />
+          <TextInput
+            value={formData.lokasi}
+            onChange={(val) => {
+              formData.lokasi = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Lokasi</Text>}
+            placeholder='Masukkan lokasi'
+          />
+          <TextInput
+            value={formData.tipePekerjaan}
+            onChange={(val) => {
+              formData.tipePekerjaan = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Tipe Pekerjaan</Text>}
+            placeholder='Masukkan tipe pekerjaan'
+          />
+          <TextInput
+            value={formData.gaji}
+            onChange={(val) => {
+              formData.gaji = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Gaji selama 1 bulan</Text>}
+            placeholder='Masukkan gaji'
+          />
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Lowongan Kerja</Text>
+            <EditEditor
+              value={formData.deskripsi}
+              onChange={(val) => {
+                formData.deskripsi = val;
+              }}
+            />
+          </Box>
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Kualifikasi Lowongan Kerja</Text>
+            <EditEditor
+              value={formData.kualifikasi}
+              onChange={(val) => {
+                formData.kualifikasi = val;
+              }}
+            />
+          </Box>
+          <Group>
+            <Button onClick={handleSubmit} bg={colors['blue-button']}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditLowonganKerja;

src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/[id]/page.tsx

@@ -0,0 +1,128 @@
+'use client'
+import { useProxy } from 'valtio/utils';
+
+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 colors from '@/con/colors';
+import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+import lowonganKerjaState from '../../../_state/ekonomi/lowongan-kerja';
+
+
+
+function DetailLowonganKerjaLokal() {
+  const lowonganState = useProxy(lowonganKerjaState)
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  const params = useParams()
+  const router = useRouter()
+
+  useShallowEffect(() => {
+    lowonganState.findUnique.load(params?.id as string)
+  }, [])
+
+
+  const handleHapus = () => {
+    if (selectedId) {
+      lowonganState.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+      router.push("/admin/ekonomi/lowongan-kerja-lokal")
+    }
+  }
+
+  if (!lowonganState.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 bg={colors['white-1']} w={{ base: "100%", md: "100%", lg: "50%" }} p={'md'}>
+        <Stack>
+          <Text fz={"xl"} fw={"bold"}>Detail Lowongan Kerja Lokal</Text>
+          {lowonganState.findUnique.data ? (
+            <Paper key={lowonganState.findUnique.data.id} bg={colors['BG-trans']} p={'md'}>
+              <Stack gap={"xs"}>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Bekerja Sebagai</Text>
+                  <Text fz={"lg"}>{lowonganState.findUnique.data?.posisi}</Text>
+                </Box>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Nama Usaha</Text>
+                  <Text fz={"lg"}>{lowonganState.findUnique.data?.namaPerusahaan}</Text>
+                </Box>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Lokasi</Text>
+                  <Text fz={"lg"}>{lowonganState.findUnique.data?.lokasi}</Text>
+                </Box>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Tipe Pekerjaan</Text>
+                  <Text fz={"lg"}>{lowonganState.findUnique.data?.tipePekerjaan}</Text>
+                </Box>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Gaji</Text>
+                  <Text fz={"lg"}>{lowonganState.findUnique.data?.gaji}</Text>
+                </Box>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Deskripsi</Text>
+                  <Text fz={"lg"} dangerouslySetInnerHTML={{ __html: lowonganState.findUnique.data?.deskripsi }} />
+                </Box>
+                <Box>
+                  <Text fw={"bold"} fz={"lg"}>Kualifikasi</Text>
+                  <Text fz={"lg"} dangerouslySetInnerHTML={{ __html: lowonganState.findUnique.data?.kualifikasi }} />
+                </Box>
+                <Flex gap={"xs"} mt={10}>
+                  <Button
+                    onClick={() => {
+                      if (lowonganState.findUnique.data) {
+                        setSelectedId(lowonganState.findUnique.data.id);
+                        setModalHapus(true);
+                      }
+                    }}
+                    disabled={lowonganState.delete.loading || !lowonganState.findUnique.data}
+                    color={"red"}
+                  >
+                    <IconX size={20} />
+                  </Button>
+                  <Button
+                    onClick={() => {
+                      if (lowonganState.findUnique.data) {
+                        router.push(`/admin/ekonomi/lowongan-kerja-lokal/${lowonganState.findUnique.data.id}/edit`);
+                      }
+                    }}
+                    disabled={!lowonganState.findUnique.data}
+                    color={"green"}
+                  >
+                    <IconEdit size={20} />
+                  </Button>
+                </Flex>
+              </Stack>
+            </Paper>
+          ) : null}
+        </Stack>
+      </Paper>
+
+      {/* Modal Konfirmasi Hapus */}
+      <ModalKonfirmasiHapus
+        opened={modalHapus}
+        onClose={() => setModalHapus(false)}
+        onConfirm={handleHapus}
+        text='Apakah anda yakin ingin menghapus lowongan kerja ini?'
+      />
+    </Box>
+  );
+}
+
+export default DetailLowonganKerjaLokal;

src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/create/page.tsx

@@ -3,11 +3,33 @@ 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 { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
+import { useProxy } from 'valtio/utils';
+import CreateEditor from '../../../_com/createEditor';
+import lowonganKerjaState from '../../../_state/ekonomi/lowongan-kerja';
 
 
 function CreateLowonganKerja() {
+  const lowonganState = useProxy(lowonganKerjaState)
   const router = useRouter();
+
+  const resetForm = () => {
+    lowonganState.create.form = {
+      posisi: "",
+      namaPerusahaan: "",
+      lokasi: "",
+      tipePekerjaan: "",
+      gaji: "",
+      deskripsi: "",
+      kualifikasi: "",
+    }
+  }
+
+  const handleSubmit = async () => {
+    await lowonganState.create.create()
+    resetForm()
+    router.push("/admin/ekonomi/lowongan-kerja-lokal")
+  }
+
   return (
     <Box>
       <Box mb={10}>
@@ -20,33 +42,65 @@ function CreateLowonganKerja() {
         <Stack gap={"xs"}>
           <Title order={4}>Create Lowongan Kerja Lokal</Title>
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Pekerjaan</Text>}
-          placeholder='Masukkan pekerjaan'
+          value={lowonganState.create.form.posisi}
+          onChange={(val) => {
+            lowonganState.create.form.posisi = val.target.value;
+          }}
+          label={<Text fw={"bold"} fz={"sm"}>Posisi</Text>}
+          placeholder='Masukkan posisi'
           />
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Usaha</Text>}
-          placeholder='Masukkan nama usaha'
+          value={lowonganState.create.form.namaPerusahaan}
+          onChange={(val) => {
+            lowonganState.create.form.namaPerusahaan = val.target.value;
+          }}
+          label={<Text fw={"bold"} fz={"sm"}>Nama Perusahaan</Text>}
+          placeholder='Masukkan nama perusahaan'
           />
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
-          placeholder='Masukkan alamat usaha'
+          value={lowonganState.create.form.lokasi}
+          onChange={(val) => {
+            lowonganState.create.form.lokasi = val.target.value;
+          }}
+          label={<Text fw={"bold"} fz={"sm"}>Lokasi</Text>}
+          placeholder='Masukkan lokasi'
           />
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon</Text>}
-          placeholder='Masukkan nomor telepon'
+          value={lowonganState.create.form.tipePekerjaan}
+          onChange={(val) => {
+            lowonganState.create.form.tipePekerjaan = val.target.value;
+          }}
+          label={<Text fw={"bold"} fz={"sm"}>Tipe Pekerjaan</Text>}
+          placeholder='Masukkan tipe pekerjaan'
           />
           <TextInput
+          value={lowonganState.create.form.gaji}
+          onChange={(val) => {
+            lowonganState.create.form.gaji = val.target.value;
+          }}
           label={<Text fw={"bold"} fz={"sm"}>Gaji selama 1 bulan</Text>}
           placeholder='Masukkan gaji'
           />
           <Box>
             <Text fw={"bold"} fz={"sm"}>Deskripsi Lowongan Kerja</Text>
-            <KeamananEditor
-              showSubmit={false}
+            <CreateEditor
+              value={lowonganState.create.form.deskripsi}
+              onChange={(val) => {
+                lowonganState.create.form.deskripsi = val;
+              }}
+            />
+          </Box>
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Kualifikasi Lowongan Kerja</Text>
+            <CreateEditor
+              value={lowonganState.create.form.kualifikasi}
+              onChange={(val) => {
+                lowonganState.create.form.kualifikasi = val;
+              }}
             />
           </Box>
           <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
           </Group>
        </Stack>
       </Paper>

src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/detail/page.tsx

@@ -1,78 +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 DetailLowonganKerjaLokal() {
-  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 Lowongan Kerja Lokal</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-             <Box>
-             <Text fw={"bold"}>Bekerja Sebagai</Text>
-             <Text>Karyawan</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Nama Usaha</Text>
-             <Text>BIBD</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Alamat Usaha</Text>
-             <Text>Jalan In Aja</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Nomor Telepon</Text>
-             <Text>0896232831883</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Waktu Kerja</Text>
-             <Text>Full Time</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Gaji selama 1 bulan</Text>
-             <Text>Rp. 3.000.000</Text>
-             </Box>
-             <Box>
-             <Text fw={"bold"}>Deskripsi Lowongan Kerja</Text>
-             <Text> Pekerjaan dengan gaji Rp. 3.000.000</Text>
-             </Box>
-              <Box>
-                <Flex gap={"xs"}>
-                  <Button color="red">
-                    <IconX size={20} />
-                  </Button>
-                  <Button onClick={() => router.push('/admin/ekonomi/lowongan-kerja-lokal/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 DetailLowonganKerjaLokal;
-

src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/edit/page.tsx

@@ -1,57 +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';
-import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
-
-
-function EditLowonganKerja() {
-  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 Lowongan Kerja Lokal</Title>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Pekerjaan</Text>}
-          placeholder='Masukkan pekerjaan'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Usaha</Text>}
-          placeholder='Masukkan nama usaha'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
-          placeholder='Masukkan alamat usaha'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon</Text>}
-          placeholder='Masukkan nomor telepon'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Gaji selama 1 bulan</Text>}
-          placeholder='Masukkan gaji'
-          />
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Lowongan Kerja</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
-          </Box>
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditLowonganKerja;

src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/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 lowonganKerjaState from '../../_state/ekonomi/lowongan-kerja';
+import { useProxy } from 'valtio/utils';
+import { useShallowEffect } from '@mantine/hooks';
 
 function LowonganKerjaLokal() {
   return (
@@ -20,7 +23,20 @@ function LowonganKerjaLokal() {
 }
 
 function ListLowonganKerjaLokal() {
+  const lowonganState = useProxy(lowonganKerjaState)
   const router = useRouter();
+
+  useShallowEffect(() => {
+    lowonganState.findMany.load();
+  }, [])
+
+  if (!lowonganState.findMany.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
   return (
     <Box py={10}>
       <Paper bg={colors['white-1']} p={'md'}>
@@ -38,16 +54,18 @@ function ListLowonganKerjaLokal() {
               </TableTr>
           </TableThead>
           <TableTbody>
-            <TableTr>
-              <TableTd>Karyawan</TableTd>
-              <TableTd>BIBD</TableTd>
-              <TableTd>Jalan In Aja</TableTd>
-              <TableTd>
-                <Button onClick={() => router.push('/admin/ekonomi/lowongan-kerja-lokal/detail')}>
+            {lowonganState.findMany.data?.map((item) => (
+              <TableTr key={item.id}>
+                <TableTd>{item.posisi}</TableTd>
+                <TableTd>{item.namaPerusahaan}</TableTd>
+                <TableTd>{item.lokasi}</TableTd>
+                <TableTd>
+                  <Button onClick={() => router.push(`/admin/ekonomi/lowongan-kerja-lokal/${item.id}`)}>
                   <IconDeviceImac size={20} />
                 </Button>
               </TableTd>
             </TableTr>
+          ))}
           </TableTbody>
         </Table>  
       </Paper>

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

@@ -0,0 +1,62 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import colors from '@/con/colors';
+import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
+import { usePathname, useRouter } from 'next/navigation';
+import React, { useEffect, useState } from 'react';
+
+function LayoutTabs({ children }: { children: React.ReactNode }) {
+    const router = useRouter()
+    const pathname = usePathname()
+    const tabs = [
+        {
+            label: "Produk Pasar Desa",
+            value: "produkpasardesa",
+            href: "/admin/ekonomi/pasar-desa/pasar-desa-ui"
+        },
+        {
+            label: "Kategori Makanan",
+            value: "kategorimakanan",
+            href: "/admin/ekonomi/pasar-desa/kategori-makanan"
+        },
+    ];
+    const curentTab = tabs.find(tab => tab.href === pathname)
+    const [activeTab, setActiveTab] = useState<string | null>(curentTab?.value || tabs[0].value);
+
+    const handleTabChange = (value: string | null) => {
+        const tab = tabs.find(t => t.value === value)
+        if (tab) {
+            router.push(tab.href)
+        }
+        setActiveTab(value)
+    }
+
+    useEffect(() => {
+        const match = tabs.find(tab => tab.href === pathname)
+        if (match) {
+            setActiveTab(match.value)
+        }
+    }, [pathname])
+
+    return (
+        <Stack>
+            <Title order={3}>Pasar Desa</Title>
+            <Tabs color={colors['blue-button']} variant='pills' value={activeTab} onChange={handleTabChange}>
+                <TabsList p={"xs"} bg={"#BBC8E7FF"}>
+                    {tabs.map((e, i) => (
+                        <TabsTab key={i} value={e.value}>{e.label}</TabsTab>
+                    ))}
+                </TabsList>
+                {tabs.map((e, i) => (
+                    <TabsPanel key={i} value={e.value}>
+                        {/* Konten dummy, bisa diganti tergantung routing */}
+                        <></>
+                    </TabsPanel>
+                ))}
+            </Tabs>
+            {children}
+        </Stack>
+    );
+}
+
+export default LayoutTabs;

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

@@ -0,0 +1,11 @@
+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

@@ -0,0 +1,11 @@
+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

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

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

@@ -0,0 +1,79 @@
+'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 { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import HeaderSearch from '../../../_com/header';
+import JudulList from '../../../_com/judulList';
+import pasarDesaState from '../../../_state/ekonomi/pasar-desa/pasar-desa';
+
+function PasarDesa() {
+  return (
+    <Box>
+      <HeaderSearch
+        title='Kategori Makanan'
+        placeholder='pencarian'
+        searchIcon={<IconSearch size={20} />}
+      />
+      <ListPasarDesa />
+    </Box>
+  );
+}
+
+function ListPasarDesa() {
+  const statePasar = useProxy(pasarDesaState)
+  const router = useRouter();
+
+  useShallowEffect(() => {
+    statePasar.findMany.load()
+  }, [])
+
+  if (!statePasar.findMany.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
+
+  return (
+    <Box py={10}>
+      <Paper bg={colors['white-1']} p={'md'}>
+        <JudulList
+          title='List Produk Pasar Desa'
+          href='/admin/ekonomi/pasar-desa/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>
+            </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>
+                </TableTd>
+              </TableTr>
+            ))}
+          </TableTbody>
+        </Table>
+      </Paper>
+    </Box>
+  );
+}
+
+export default PasarDesa;

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

@@ -0,0 +1,12 @@
+'use client'
+
+import LayoutTabs from "./_lib/layoutTabs"
+
+
+export default function Layout({children} : {children: React.ReactNode}) {
+    return (
+        <LayoutTabs>
+            {children}
+        </LayoutTabs>
+    )
+}

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

@@ -1,60 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Paper, 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';
-
-function PasarDesa() {
-  return (
-    <Box>
-      <HeaderSearch
-        title='Pasar Desa'
-        placeholder='pencarian'
-        searchIcon={<IconSearch size={20} />}
-      />
-      <ListPasarDesa/>
-    </Box>
-  );
-}
-
-function ListPasarDesa() {
-  const router = useRouter();
-  return (
-    <Box py={10}>
-      <Paper bg={colors['white-1']} p={'md'}>
-        <JudulList
-          title='List Pasar Desa'
-          href='/admin/ekonomi/pasar-desa/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>
-              </TableTr>
-          </TableThead>
-          <TableTbody>
-            <TableTr>
-              <TableTd>Produk 1</TableTd>
-              <TableTd>Harga Rp. 20.000</TableTd>
-              <TableTd>Rating 5</TableTd>
-              <TableTd>Jalan In Aja</TableTd>
-              <TableTd>
-                <Button onClick={() => router.push('/admin/ekonomi/pasar-desa/detail')}>
-                  <IconDeviceImac size={20} />
-                </Button>
-              </TableTd>
-            </TableTr>
-          </TableTbody>
-        </Table>  
-      </Paper>
-    </Box>
-  );
-}
-
-export default PasarDesa;

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

@@ -3,7 +3,7 @@ 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';
+import { KeamananEditor } from '../../../../keamanan/_com/keamananEditor';
 
 function CreatePasarDesa() {
   const router = useRouter();

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

@@ -3,7 +3,7 @@ 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';
+import { KeamananEditor } from '../../../../keamanan/_com/keamananEditor';
 
 function EditPasarDesa() {
   const router = useRouter();

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

@@ -0,0 +1,79 @@
+'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 { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import HeaderSearch from '../../../_com/header';
+import JudulList from '../../../_com/judulList';
+import pasarDesaState from '../../../_state/ekonomi/pasar-desa/pasar-desa';
+
+function PasarDesa() {
+  return (
+    <Box>
+      <HeaderSearch
+        title='Produk Pasar Desa'
+        placeholder='pencarian'
+        searchIcon={<IconSearch size={20} />}
+      />
+      <ListPasarDesa />
+    </Box>
+  );
+}
+
+function ListPasarDesa() {
+  const statePasar = useProxy(pasarDesaState)
+  const router = useRouter();
+
+  useShallowEffect(() => {
+    statePasar.findMany.load()
+  }, [])
+
+  if (!statePasar.findMany.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
+
+  return (
+    <Box py={10}>
+      <Paper bg={colors['white-1']} p={'md'}>
+        <JudulList
+          title='List Produk Pasar Desa'
+          href='/admin/ekonomi/pasar-desa/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>
+            </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>
+                </TableTd>
+              </TableTr>
+            ))}
+          </TableTbody>
+        </Table>
+      </Paper>
+    </Box>
+  );
+}
+
+export default PasarDesa;

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

@@ -0,0 +1,269 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import kontakDaruratKeamananState from '@/app/admin/(dashboard)/_state/keamanan/kontak-darurat-keamanan';
+import colors from '@/con/colors';
+import ApiFetch from '@/lib/api-fetch';
+import { Box, Button, Group, Image, 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 EditKontakDarurat() {
+  const router = useRouter();
+  const kontakState = useProxy(kontakDaruratKeamananState)
+  const params = useParams()
+
+  const [previewUtama, setPreviewUtama] = useState<string | null>(null);
+  const [fileUtama, setFileUtama] = useState<File | null>(null);
+  const [previewItem, setPreviewItem] = useState<string | null>(null);
+  const [fileItem, setFileItem] = useState<File | null>(null);
+  const [formData, setFormData] = useState({
+    name: kontakState.update.form.nama || '',
+    imageId: kontakState.update.form.imageId || '',
+    kontakItem: {
+      nama: kontakState.update.form.kontakItems[0].nama || '',
+      nomorTelepon: kontakState.update.form.kontakItems[0].nomorTelepon || '',
+      imageId: kontakState.update.form.kontakItems[0].imageId || '',
+    }
+  })
+
+  useEffect(() => {
+    const loadKontakDarurat = async () => {
+      const id = params?.id as string;
+      if (!id) return;
+
+      try {
+        const data = await kontakState.update.load(id);
+        if (data) {
+          setFormData({
+            name: data.nama || '',
+            imageId: data.imageId || '',
+            kontakItem: {
+              nama: data.kontakItems[0].nama || '',
+              nomorTelepon: data.kontakItems[0].nomorTelepon || '',
+              imageId: data.kontakItems[0].imageId || '',
+            },
+          });
+
+          if (data?.image?.link) {
+            setPreviewUtama(data.image.link);
+          }
+          if (data?.kontakItems[0].image?.link) {
+            setPreviewItem(data.kontakItems[0].image.link);
+          }
+        }
+      } catch (error) {
+        console.error("Error loading kontak darurat:", error);
+        toast.error("Gagal memuat data kontak darurat");
+      }
+    };
+
+    loadKontakDarurat();
+  }, [params?.id]);
+
+  const handleSubmit = async () => {
+    try {
+      kontakState.update.form = {
+        ...kontakState.update.form,
+        nama: formData.name,
+        imageId: formData.imageId,
+        kontakItems: [
+          {
+            nama: formData.kontakItem.nama,
+            nomorTelepon: formData.kontakItem.nomorTelepon,
+            imageId: formData.kontakItem.imageId,
+          },
+        ],
+      }
+
+      if(fileUtama) {
+        const res = await ApiFetch.api.fileStorage.create.post({ file: fileUtama, name: fileUtama.name });
+        const uploaded = res.data?.data;
+
+        if (!uploaded?.id) {
+          return toast.error("Gagal upload gambar");
+        }
+
+        kontakState.update.form.imageId = uploaded.id;
+      }
+      if(fileItem) {
+        const res = await ApiFetch.api.fileStorage.create.post({ file: fileItem, name: fileItem.name });
+        const uploaded = res.data?.data;
+
+        if (!uploaded?.id) {
+          return toast.error("Gagal upload gambar");
+        }
+
+        kontakState.update.form.kontakItems[0].imageId = uploaded.id;
+      }
+
+      await kontakState.update.update();
+      toast.success("Kontak Darurat berhasil diperbarui!");
+      router.push("/admin/keamanan/kontak-darurat");
+    } 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 Kontak Darurat</Title>
+          <TextInput
+            value={formData.name}
+            onChange={(val) => {
+              setFormData({ ...formData, name: val.target.value });
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Nama Kategori Darurat</Text>}
+            placeholder='Masukkan nama Kategori Darurat'
+          />
+          <Box>
+            <Text fz={"md"} fw={"bold"}>Gambar</Text>
+            <Box>
+              <Dropzone
+                onDrop={(files) => {
+                  const selectedFile = files[0]; // Ambil file pertama
+                  if (selectedFile) {
+                    setFileUtama(selectedFile);
+                    setPreviewUtama(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 */}
+              {previewUtama && (
+                <Box mt="sm">
+                  <Image
+                    src={previewUtama}
+                    alt="Preview"
+                    style={{
+                      maxWidth: '100%',
+                      maxHeight: '200px',
+                      objectFit: 'contain',
+                      borderRadius: '8px',
+                      border: '1px solid #ddd',
+                    }}
+                  />
+                </Box>
+              )}
+
+            </Box>
+          </Box>
+          <TextInput
+            label={<Text fw={"bold"} fz={"sm"}>Nama Kontak</Text>}
+            placeholder='Masukkan nama Kontak'
+            value={formData.kontakItem.nama}
+            onChange={(val) => {
+              setFormData({ ...formData, kontakItem: { ...formData.kontakItem, nama: val.target.value } });
+            }}
+          />
+          <TextInput
+            label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon Kontak</Text>}
+            placeholder='Masukkan nomor telepon Kontak'
+            value={formData.kontakItem.nomorTelepon}
+            onChange={(val) => {
+              setFormData({ ...formData, kontakItem: { ...formData.kontakItem, nomorTelepon: val.target.value } });
+            }}
+          />
+          <Box>
+            <Text fz={"md"} fw={"bold"}>Gambar</Text>
+            <Box>
+              <Dropzone
+                onDrop={(files) => {
+                  const selectedFile = files[0]; // Ambil file pertama
+                  if (selectedFile) {
+                    setFileItem(selectedFile);
+                    setPreviewItem(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 */}
+              {previewItem && (
+                <Box mt="sm">
+                  <Image
+                    src={previewItem}
+                    alt="Preview"
+                    style={{
+                      maxWidth: '100%',
+                      maxHeight: '200px',
+                      objectFit: 'contain',
+                      borderRadius: '8px',
+                      border: '1px solid #ddd',
+                    }}
+                  />
+                </Box>
+              )}
+
+            </Box>
+          </Box>
+          <Group>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditKontakDarurat;

src/app/admin/(dashboard)/keamanan/kontak-darurat/[id]/page.tsx

@@ -0,0 +1,117 @@
+'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 from 'react';
+// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+import { useProxy } from 'valtio/utils';
+import kontakDaruratKeamananState from '../../../_state/keamanan/kontak-darurat-keamanan';
+import { useShallowEffect } from '@mantine/hooks';
+import { useState } from 'react';
+import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+
+function DetailKontakDarurat() {
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  const router = useRouter();
+  const params = useParams()
+  const kontakState = useProxy(kontakDaruratKeamananState)
+
+  useShallowEffect(() => {
+    kontakState.findUnique.load(params?.id as string)
+  }, [])
+
+  const handleDelete = () => {
+    if (selectedId) {
+      kontakState.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+      router.push("/admin/keamanan/kontak-darurat")
+    }
+  }
+
+  if (!kontakState.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 bg={colors['white-1']} w={{ base: "100%", md: "100%", lg: "50%" }} p={'md'}>
+      <Stack>
+        <Text fz={"xl"} fw={"bold"}>Detail Kontak Darurat</Text>
+        {kontakState.findUnique.data ? (
+          <Paper key={kontakState.findUnique.data.id} bg={colors['BG-trans']} p={'md'}>
+            <Stack gap={"xs"}>
+              <Box>
+                <Text fw={"bold"} fz={"lg"}>Judul Kontak Darurat</Text>
+                <Text fz={"lg"}>{kontakState.findUnique.data?.nama}</Text>
+              </Box>
+              <Box>
+                <Text fw={"bold"} fz={"lg"}>Gambar</Text>
+                <Image w={{ base: 150, md: 150, lg: 150 }} src={kontakState.findUnique.data?.image?.link} alt="gambar" />
+              </Box>
+              <Box>
+                <Text fw={"bold"} fz={"lg"}>Kontak</Text>
+                <Stack>
+                  {kontakState.findUnique.data?.kontakItems.map((item, index) => (
+                    <Box key={index}>
+                      <Text fz={"lg"}>{item.nama}</Text>
+                      <Text fz={"lg"}>{item.nomorTelepon}</Text>
+                      <Image w={{ base: 150, md: 150, lg: 150 }} src={item.image?.link} alt="gambar" />
+                    </Box>
+                  ))}
+                </Stack>
+              </Box>
+              <Flex gap={"xs"} mt={10}>
+                <Button
+                  onClick={() => {
+                    if (kontakState.findUnique.data) {
+                      setSelectedId(kontakState.findUnique.data.id);
+                      setModalHapus(true);
+                    }
+                  }}
+                  disabled={kontakState.delete.loading || !kontakState.findUnique.data}
+                  color={"red"}
+                >
+                  <IconX size={20} />
+                </Button>
+                <Button
+                  onClick={() => {
+                    if (kontakState.findUnique.data) {
+                      router.push(`/admin/keamanan/kontak-darurat/${kontakState.findUnique.data.id}/edit`);
+                    }
+                  }}
+                  disabled={!kontakState.findUnique.data}
+                  color={"green"}
+                >
+                  <IconEdit size={20} />
+                </Button>
+              </Flex>
+            </Stack>
+          </Paper>
+        ) : null}
+      </Stack>
+    </Paper>
+
+    {/* Modal Konfirmasi Hapus */}
+    <ModalKonfirmasiHapus
+      opened={modalHapus}
+      onClose={() => setModalHapus(false)}
+      onConfirm={handleDelete}
+      text='Apakah anda yakin ingin menghapus kontak darurat ini?'
+    />
+  </Box>
+  );
+}
+
+export default DetailKontakDarurat;

src/app/admin/(dashboard)/keamanan/kontak-darurat/create/page.tsx

@@ -1,43 +1,236 @@
 '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 ApiFetch from '@/lib/api-fetch';
+import { Box, Button, Group, Image, 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 { KeamananEditor } from '../../_com/keamananEditor';
+import { useState } from 'react';
+import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
+import kontakDaruratKeamananState from '../../../_state/keamanan/kontak-darurat-keamanan';
+
 
 function CreateKontakDarurat() {
+  const kontakState = useProxy(kontakDaruratKeamananState)
   const router = useRouter();
+  const [fileUtama, setFileUtama] = useState<File | null>(null);
+  const [previewUtama, setPreviewUtama] = useState<string | null>(null);
+  const [fileItem, setFileItem] = useState<File | null>(null);
+  const [previewItem, setPreviewItem] = useState<string | null>(null);
+
+
+  const resetForm = () => {
+    kontakState.create.form = {
+      nama: "",
+      imageId: "",
+      kontakItems: [
+        {
+          nama: "",
+          nomorTelepon: "",
+          imageId: "",
+        },
+      ],
+    }
+    setPreviewUtama(null);
+    setFileUtama(null);
+    setPreviewItem(null);
+    setFileItem(null);
+  }
+
+  const handleSubmit = async () => {
+    if (!fileUtama) {
+      return toast.warn("Pilih file gambar terlebih dahulu");
+    }
+
+    const res = await ApiFetch.api.fileStorage.create.post({
+      file: fileUtama,
+      name: fileUtama.name,
+    })
+
+    const uploaded = res.data?.data;
+
+    if (!uploaded?.id) {
+      return toast.error("Gagal mengupload file");
+    }
+
+    kontakState.create.form.imageId = uploaded.id;
+
+    if (!fileItem) {
+      return toast.error("Pilih file gambar terlebih dahulu");
+    }
+
+    const resItem = await ApiFetch.api.fileStorage.create.post({
+      file: fileItem,
+      name: fileItem.name,
+    })
+
+    const uploadedItem = resItem.data?.data;
+
+    if (!uploadedItem?.id) {
+      return toast.error("Gagal mengupload file");
+    }
+
+    kontakState.create.form.kontakItems[0].imageId = uploadedItem.id;
+
+    await kontakState.create.create();
+
+    resetForm();
+    router.push('/admin/keamanan/kontak-darurat');
+  }
   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 Kontak Darurat</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Kontak Darurat</Text>}
-          placeholder='Masukkan nama Kontak Darurat'
+            value={kontakState.create.form.nama}
+            onChange={(val) => {
+              kontakState.create.form.nama = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Nama Kategori Darurat</Text>}
+            placeholder='Masukkan nama Kategori Darurat'
           />
           <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Kontak Darurat</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
+            <Text fz={"md"} fw={"bold"}>Gambar</Text>
+            <Box>
+              <Dropzone
+                onDrop={(files) => {
+                  const selectedFile = files[0]; // Ambil file pertama
+                  if (selectedFile) {
+                    setFileUtama(selectedFile);
+                    setPreviewUtama(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 */}
+              {previewUtama && (
+                <Box mt="sm">
+                  <Image
+                    src={previewUtama}
+                    alt="Preview"
+                    style={{
+                      maxWidth: '100%',
+                      maxHeight: '200px',
+                      objectFit: 'contain',
+                      borderRadius: '8px',
+                      border: '1px solid #ddd',
+                    }}
+                  />
+                </Box>
+              )}
+
+            </Box>
+          </Box>
+          <TextInput
+            label={<Text fw={"bold"} fz={"sm"}>Nama Kontak</Text>}
+            placeholder='Masukkan nama Kontak'
+            value={kontakState.create.form.kontakItems[0].nama}
+            onChange={(val) => {
+              kontakState.create.form.kontakItems[0].nama = val.target.value;
+            }}
+          />
+          <TextInput
+            label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon Kontak</Text>}
+            placeholder='Masukkan nomor telepon Kontak'
+            value={kontakState.create.form.kontakItems[0].nomorTelepon}
+            onChange={(val) => {
+              kontakState.create.form.kontakItems[0].nomorTelepon = val.target.value;
+            }}
+          />
+          <Box>
+            <Text fz={"md"} fw={"bold"}>Gambar</Text>
+            <Box>
+              <Dropzone
+                onDrop={(files) => {
+                  const selectedFile = files[0]; // Ambil file pertama
+                  if (selectedFile) {
+                    setFileItem(selectedFile);
+                    setPreviewItem(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 */}
+              {previewItem && (
+                <Box mt="sm">
+                  <Image
+                    src={previewItem}
+                    alt="Preview"
+                    style={{
+                      maxWidth: '100%',
+                      maxHeight: '200px',
+                      objectFit: 'contain',
+                      borderRadius: '8px',
+                      border: '1px solid #ddd',
+                    }}
+                  />
+                </Box>
+              )}
+
+            </Box>
           </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/kontak-darurat/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 DetailKontakDarurat() {
-  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 Kontak Darurat</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Nama Kontak Darurat</Text>
-                <Text fz={"lg"}>Test Judul</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Nomor Kontak Darurat</Text>
-                <Text fz={"lg"}>Test Kategori</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/kontak-darurat/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 DetailKontakDarurat;

src/app/admin/(dashboard)/keamanan/kontak-darurat/edit/page.tsx

@@ -1,44 +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 EditKontakDarurat() {
-  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 Kontak Darurat</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Kontak Darurat</Text>}
-          placeholder='Masukkan nama Kontak Darurat'
-          />
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Kontak Darurat</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
-          </Box>
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditKontakDarurat;

src/app/admin/(dashboard)/keamanan/kontak-darurat/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 kontakDaruratKeamananState from '../../_state/keamanan/kontak-darurat-keamanan';
+import { useShallowEffect } from '@mantine/hooks';
 
 function KontakDaurat() {
   return (
@@ -20,7 +23,20 @@ function KontakDaurat() {
 }
 
 function ListKontakDaurat() {
+  const kontakState = useProxy(kontakDaruratKeamananState)
   const router = useRouter();
+
+  useShallowEffect(() => {
+    kontakState.findMany.load()
+  }, [])
+
+  if (!kontakState.findMany.data) {
+    return (
+      <Stack py={10}>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
   return (
     <Box py={10}>
       <Paper bg={colors['white-1']} p={'md'}>
@@ -31,23 +47,25 @@ function ListKontakDaurat() {
         <Table striped withTableBorder withRowBorders>
           <TableThead>
             <TableTr>
-              <TableTh>Nama Kontak Darurat</TableTh>
-              <TableTh>Nomor Kontak Darurat</TableTh>
-              <TableTh>Deskripsi</TableTh>
+              <TableTh>Nama Kategori Darurat</TableTh>
+              <TableTh>Nama Kontak</TableTh>
+              <TableTh>Nomor Kontak</TableTh>
               <TableTh>Detail</TableTh>
               </TableTr>
           </TableThead>
           <TableTbody>
-            <TableTr>
-              <TableTd>Kontak Darurat 1</TableTd>
-              <TableTd>0896232831883</TableTd>
-              <TableTd>Kontak Darurat 1</TableTd>
-              <TableTd>
-                <Button onClick={() => router.push('/admin/keamanan/kontak-darurat/detail')}>
-                  <IconDeviceImac size={20} />
-                </Button>
-              </TableTd>
-            </TableTr>
+            {kontakState.findMany.data?.map((item) => (
+              <TableTr key={item.id}>
+                <TableTd>{item.nama}</TableTd>
+                <TableTd>{item.kontakItems[0].nama}</TableTd>
+                <TableTd>{item.kontakItems[0].nomorTelepon}</TableTd>
+                <TableTd>
+                  <Button onClick={() => router.push(`/admin/keamanan/kontak-darurat/${item.id}`)}>
+                    <IconDeviceImac size={20} />
+                  </Button>
+                </TableTd>
+              </TableTr>
+            ))}
           </TableTbody>
         </Table>  
       </Paper>

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

@@ -0,0 +1,214 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
+import pencegahanKriminalitasState from '@/app/admin/(dashboard)/_state/keamanan/pencegahan-kriminalitas';
+import colors from '@/con/colors';
+import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
+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';
+
+
+function EditPencegahanKriminalitas() {
+  const router = useRouter();
+  const params = useParams()
+  const kriminalitasState = useProxy(pencegahanKriminalitasState)
+  const [formData, setFormData] = useState({
+    pencegahanKriminalitas: {
+      programKeamanan: {
+        nama: kriminalitasState.update.form.pencegahanKriminalitas.programKeamanan.nama,
+        deskripsi: kriminalitasState.update.form.pencegahanKriminalitas.programKeamanan.deskripsi,
+        slug: kriminalitasState.update.form.pencegahanKriminalitas.programKeamanan.slug,
+      },
+      tipsKeamanan: {
+        judul: kriminalitasState.update.form.pencegahanKriminalitas.tipsKeamanan.judul,
+        konten: kriminalitasState.update.form.pencegahanKriminalitas.tipsKeamanan.konten,
+        slug: kriminalitasState.update.form.pencegahanKriminalitas.tipsKeamanan.slug,
+      },
+      videoKeamanan: {
+        judul: kriminalitasState.update.form.pencegahanKriminalitas.videoKeamanan.judul,
+        deskripsi: kriminalitasState.update.form.pencegahanKriminalitas.videoKeamanan.deskripsi,
+        videoUrl: kriminalitasState.update.form.pencegahanKriminalitas.videoKeamanan.videoUrl,
+        slug: kriminalitasState.update.form.pencegahanKriminalitas.videoKeamanan.slug,
+      },
+    },
+  })
+
+  useEffect(() => {
+    const loadKriminalitas = async () => {
+      const id = params?.id as string;
+      if (!id) return;
+
+      try {
+        const data = await kriminalitasState.update.load(id);
+        if (data && data.pencegahanKriminalitas) {
+          const { programKeamanan, tipsKeamanan, videoKeamanan } = data.pencegahanKriminalitas;
+        
+          setFormData({
+            pencegahanKriminalitas: {
+              programKeamanan: {
+                nama: programKeamanan?.nama || "",
+                deskripsi: programKeamanan?.deskripsi || "",
+                slug: programKeamanan?.slug || "",
+              },
+              tipsKeamanan: {
+                judul: tipsKeamanan?.judul || "",
+                konten: tipsKeamanan?.konten || "",
+                slug: tipsKeamanan?.slug || "",
+              },
+              videoKeamanan: {
+                judul: videoKeamanan?.judul || "",
+                deskripsi: videoKeamanan?.deskripsi || "",
+                videoUrl: videoKeamanan?.videoUrl || "",
+                slug: videoKeamanan?.slug || "",
+              },
+            },
+          });
+        }
+        
+      } catch (error) {
+        console.error("Error loading pencegahan kriminalitas:", error);
+        toast.error("Gagal memuat data pencegahan kriminalitas");
+      }
+    }
+
+    loadKriminalitas();
+  }, [params.id]);
+
+  const handleSubmit = async () => {
+    try {
+      kriminalitasState.update.form = {
+        ...kriminalitasState.update.form,
+        pencegahanKriminalitas: {
+          programKeamanan: {
+            nama: formData.pencegahanKriminalitas.programKeamanan.nama,
+            deskripsi: formData.pencegahanKriminalitas.programKeamanan.deskripsi,
+            slug: formData.pencegahanKriminalitas.programKeamanan.slug,
+          },
+          tipsKeamanan: {
+            judul: formData.pencegahanKriminalitas.tipsKeamanan.judul,
+            konten: formData.pencegahanKriminalitas.tipsKeamanan.konten,
+            slug: formData.pencegahanKriminalitas.tipsKeamanan.slug,
+          },
+          videoKeamanan: {
+            judul: formData.pencegahanKriminalitas.videoKeamanan.judul,
+            deskripsi: formData.pencegahanKriminalitas.videoKeamanan.deskripsi,
+            videoUrl: formData.pencegahanKriminalitas.videoKeamanan.videoUrl,
+            slug: formData.pencegahanKriminalitas.videoKeamanan.slug,
+          },
+        },
+      }
+      await kriminalitasState.update.update();
+      toast.success("Pencegahan Kriminalitas berhasil diperbarui!");
+      router.push("/admin/keamanan/pencegahan-kriminalitas");
+    } catch (error) {
+      console.error("Error updating pencegahan kriminalitas:", error);
+      toast.error("Gagal memuat data pencegahan kriminalitas");
+    }
+  }
+  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 Pencegahan Kriminalitas</Title>
+          <TextInput
+            value={formData.pencegahanKriminalitas.programKeamanan.nama}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.programKeamanan.nama = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Program Keamanan</Text>}
+            placeholder='Masukkan judul Program Keamanan'
+          />
+          <TextInput
+            value={formData.pencegahanKriminalitas.programKeamanan.slug}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.programKeamanan.slug = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Slug Program Keamanan</Text>}
+            placeholder='Masukkan slug Program Keamanan'
+          />
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Program Keamanan</Text>
+            <EditEditor
+              value={formData.pencegahanKriminalitas.programKeamanan.deskripsi}
+              onChange={(val) => {
+                formData.pencegahanKriminalitas.programKeamanan.deskripsi = val;
+              }}
+            />
+          </Box>
+          <TextInput
+            value={formData.pencegahanKriminalitas.tipsKeamanan.judul}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.tipsKeamanan.judul = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Tips Keamanan</Text>}
+            placeholder='Masukkan judul Tips Keamanan'
+          />
+          <TextInput
+            value={formData.pencegahanKriminalitas.tipsKeamanan.slug}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.tipsKeamanan.slug = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Slug Tips Keamanan</Text>}
+            placeholder='Masukkan slug Tips Keamanan'
+          />
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Tips Keamanan</Text>
+            <EditEditor
+              value={formData.pencegahanKriminalitas.tipsKeamanan.konten}
+              onChange={(val) => {
+                formData.pencegahanKriminalitas.tipsKeamanan.konten = val;
+              }}
+            />
+          </Box>
+          <TextInput
+            value={formData.pencegahanKriminalitas.videoKeamanan.judul}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.videoKeamanan.judul = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Video Keamanan</Text>}
+            placeholder='Masukkan judul Video Keamanan'
+          />
+          <TextInput
+            value={formData.pencegahanKriminalitas.videoKeamanan.slug}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.videoKeamanan.slug = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Slug Video Keamanan</Text>}
+            placeholder='Masukkan slug Video Keamanan'
+          />
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Tips Keamanan</Text>
+            <EditEditor
+              value={formData.pencegahanKriminalitas.videoKeamanan.deskripsi}
+              onChange={(val) => {
+                formData.pencegahanKriminalitas.videoKeamanan.deskripsi = val;
+              }}
+            />
+          </Box>
+          <TextInput
+            value={formData.pencegahanKriminalitas.videoKeamanan.videoUrl}
+            onChange={(val) => {
+              formData.pencegahanKriminalitas.videoKeamanan.videoUrl = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Video URL</Text>}
+            placeholder='Masukkan video URL'
+          />
+          <Group>
+            <Button bg={colors['blue-button']} onClick={handleSubmit}>Submit</Button>
+          </Group>
+        </Stack>
+      </Paper>
+    </Box>
+  );
+}
+
+export default EditPencegahanKriminalitas;

src/app/admin/(dashboard)/keamanan/pencegahan-kriminalitas/[id]/page.tsx

@@ -0,0 +1,121 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Flex, Paper, Skeleton, Stack, Text } from '@mantine/core';
+import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
+import { useRouter } from 'next/navigation';
+import { useState } from 'react';
+import { useShallowEffect } from '@mantine/hooks';
+import { useParams } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+import pencegahanKriminalitasState from '../../../_state/keamanan/pencegahan-kriminalitas';
+
+function DetailPencegahanKriminalitas() {
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
+  const router = useRouter();
+  const params = useParams()
+  const kriminalitasState = useProxy(pencegahanKriminalitasState)
+
+  useShallowEffect(() => {
+    kriminalitasState.findUnique.load(params?.id as string)
+  }, [])
+
+  const handleDelete = () => {
+    if (selectedId) {
+      kriminalitasState.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+      router.push("/admin/keamanan/pencegahan-kriminalitas")
+    }
+  }
+
+  if (!kriminalitasState.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>
+          <Paper bg={colors['BG-trans']} p={'md'}>
+            <Text fz={"xl"} fw={"bold"}>Detail Pencegahan Kriminalitas</Text>
+            {kriminalitasState.findUnique.data ? (
+              <Paper key={kriminalitasState.findUnique.data.id} bg={colors['BG-trans']}>
+                <Stack gap={"xs"} py={'md'}>
+                  <Box>
+                    <Text fw={"bold"} fz={"lg"}>Judul Program Keamanan</Text>
+                    <Text fz={"lg"}>{kriminalitasState.findUnique.data?.programKeamanan.nama}</Text>
+                  </Box>
+                  <Box>
+                    <Text fw={"bold"} fz={"lg"}>Slug</Text>
+                    <Text fz={"lg"}>{kriminalitasState.findUnique.data?.programKeamanan.slug}</Text>
+                  </Box>
+                  <Box>
+                    <Text fw={"bold"} fz={"lg"}>Deskripsi</Text>
+                    <Text fz={"lg"} dangerouslySetInnerHTML={{ __html: kriminalitasState.findUnique.data?.programKeamanan.deskripsi || '' }} />
+                  </Box>
+                  <Box>
+                    <Text fw={"bold"} fz={"lg"}>Judul Tips Keamanan</Text>
+                    <Text fz={"lg"}>{kriminalitasState.findUnique.data?.tipsKeamanan.judul}</Text>
+                  </Box>
+                  <Box>
+                    <Text fw={"bold"} fz={"lg"}>Slug Tips Keamanan</Text>
+                    <Text fz={"lg"}>{kriminalitasState.findUnique.data?.tipsKeamanan.slug}</Text>
+                  </Box>
+                  <Box>
+                    <Text fw={"bold"} fz={"lg"}>Deskripsi Tips Keamanan</Text>
+                    <Text fz={"lg"} dangerouslySetInnerHTML={{ __html: kriminalitasState.findUnique.data?.tipsKeamanan.konten || '' }} />
+                  </Box>
+                  <Flex gap={"xs"} mt={10}>
+                    <Button
+                      onClick={() => {
+                        if (kriminalitasState.findUnique.data) {
+                          setSelectedId(kriminalitasState.findUnique.data.id);
+                          setModalHapus(true);
+                        }
+                      }}
+                      disabled={kriminalitasState.delete.loading || !kriminalitasState.findUnique.data}
+                      color={"red"}
+                    >
+                      <IconX size={20} />
+                    </Button>
+                    <Button
+                      onClick={() => {
+                        if (kriminalitasState.findUnique.data) {
+                          router.push(`/admin/keamanan/pencegahan-kriminalitas/${kriminalitasState.findUnique.data.id}/edit`);
+                        }
+                      }}
+                      disabled={!kriminalitasState.findUnique.data}
+                      color={"green"}
+                    >
+                      <IconEdit size={20} />
+                    </Button>
+                  </Flex>
+                </Stack>
+              </Paper>
+            ) : null}
+          </Paper>
+        </Stack>
+      </Paper>
+
+      {/* Modal Hapus */}
+      <ModalKonfirmasiHapus
+        opened={modalHapus}
+        onClose={() => setModalHapus(false)}
+        onConfirm={handleDelete}
+        text="Apakah anda yakin ingin menghapus pencegahan kriminalitas ini?"
+      />
+    </Box>
+  );
+}
+
+export default DetailPencegahanKriminalitas;

src/app/admin/(dashboard)/keamanan/pencegahan-kriminalitas/create/page.tsx

@@ -1,43 +1,145 @@
 '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 { 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 pencegahanKriminalitasState from '../../../_state/keamanan/pencegahan-kriminalitas';
+
 
 function CreatePencegahanKriminalitas() {
   const router = useRouter();
+  const kriminalitasState = useProxy(pencegahanKriminalitasState)
+
+  const resetForm = () => {
+    kriminalitasState.create.form = {
+      pencegahanKriminalitas: {
+        programKeamanan: {
+          nama: "",
+          deskripsi: "",
+          slug: "",
+        },
+        tipsKeamanan: {
+          judul: "",
+          konten: "",
+          slug: "",
+        },
+        videoKeamanan: {
+          judul: "",
+          deskripsi: "",
+          videoUrl: "",
+          slug: "",
+        },
+      },
+    }
+  }
+
+  const handleSubmit = async () => {
+    await kriminalitasState.create.create();
+    resetForm();
+    router.push('/admin/keamanan/pencegahan-kriminalitas');
+  }
   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 Pencegahan Kriminalitas</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
           <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Pencegahan Kriminalitas</Text>}
-          placeholder='Masukkan nama Pencegahan Kriminalitas'
+            value={kriminalitasState.create.form.pencegahanKriminalitas.programKeamanan.nama}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.programKeamanan.nama = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Program Keamanan</Text>}
+            placeholder='Masukkan judul Program Keamanan'
+          />
+          <TextInput
+            value={kriminalitasState.create.form.pencegahanKriminalitas.programKeamanan.slug}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.programKeamanan.slug = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Slug Program Keamanan</Text>}
+            placeholder='Masukkan slug Program Keamanan'
           />
           <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Pencegahan Kriminalitas</Text>
-            <KeamananEditor
-              showSubmit={false}
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Program Keamanan</Text>
+            <CreateEditor
+              value={kriminalitasState.create.form.pencegahanKriminalitas.programKeamanan.deskripsi}
+              onChange={(val) => {
+                kriminalitasState.create.form.pencegahanKriminalitas.programKeamanan.deskripsi = val;
+              }}
             />
           </Box>
+          <TextInput
+            value={kriminalitasState.create.form.pencegahanKriminalitas.tipsKeamanan.judul}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.tipsKeamanan.judul = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Tips Keamanan</Text>}
+            placeholder='Masukkan judul Tips Keamanan'
+          />
+          <TextInput
+            value={kriminalitasState.create.form.pencegahanKriminalitas.tipsKeamanan.slug}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.tipsKeamanan.slug = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Slug Tips Keamanan</Text>}
+            placeholder='Masukkan slug Tips Keamanan'
+          />
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Tips Keamanan</Text>
+            <CreateEditor
+              value={kriminalitasState.create.form.pencegahanKriminalitas.tipsKeamanan.konten}
+              onChange={(val) => {
+                kriminalitasState.create.form.pencegahanKriminalitas.tipsKeamanan.konten = val;
+              }}
+            />
+          </Box>
+          <TextInput
+            value={kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.judul}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.judul = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Judul Video Keamanan</Text>}
+            placeholder='Masukkan judul Video Keamanan'
+          />
+          <TextInput
+            value={kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.slug}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.slug = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Slug Video Keamanan</Text>}
+            placeholder='Masukkan slug Video Keamanan'
+          />
+          <Box>
+            <Text fw={"bold"} fz={"sm"}>Deskripsi Tips Keamanan</Text>
+            <CreateEditor
+              value={kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.deskripsi}
+              onChange={(val) => {
+                kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.deskripsi = val;
+              }}
+            />
+          </Box>
+          <TextInput
+            value={kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.videoUrl}
+            onChange={(val) => {
+              kriminalitasState.create.form.pencegahanKriminalitas.videoKeamanan.videoUrl = val.target.value;
+            }}
+            label={<Text fw={"bold"} fz={"sm"}>Video URL</Text>}
+            placeholder='Masukkan video URL'
+          />
           <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/pencegahan-kriminalitas/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 DetailPencegahanKriminalitas() {
-  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 Pencegahan Kriminalitas</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Nama Pencegahan Kriminalitas</Text>
-                <Text fz={"lg"}>Test Judul</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Nomor Pencegahan Kriminalitas</Text>
-                <Text fz={"lg"}>Test Kategori</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/pencegahan-kriminalitas/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 DetailPencegahanKriminalitas;

src/app/admin/(dashboard)/keamanan/pencegahan-kriminalitas/edit/page.tsx

@@ -1,44 +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 EditPencegahanKriminalitas() {
-  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 Pencegahan Kriminalitas</Title>
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
-            <IconImageInPicture size={50} />
-          </Box>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Nama Pencegahan Kriminalitas</Text>}
-          placeholder='Masukkan nama Pencegahan Kriminalitas'
-          />
-          <Box>
-            <Text fw={"bold"} fz={"sm"}>Deskripsi Pencegahan Kriminalitas</Text>
-            <KeamananEditor
-              showSubmit={false}
-            />
-          </Box>
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditPencegahanKriminalitas;

src/app/admin/(dashboard)/keamanan/pencegahan-kriminalitas/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, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } 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 pencegahanKriminalitasState from '../../_state/keamanan/pencegahan-kriminalitas';
+import { useShallowEffect } from '@mantine/hooks';
 
 function PencegahanKriminalitas() {
   return (
@@ -20,34 +23,52 @@ function PencegahanKriminalitas() {
 }
 
 function ListPencegahanKriminalitas() {
+  const kriminalitasState = useProxy(pencegahanKriminalitasState)
   const router = useRouter();
+
+  useShallowEffect(() => {
+    kriminalitasState.findMany.load()
+  }, [])
+
+  if (!kriminalitasState.findMany.data) {
+    return (
+      <Box py={10}>
+        <Skeleton h={500}/>
+      </Box>
+    )
+  }
+
   return (
-    <Box py={10}>
-      <Paper bg={colors['white-1']} p={'md'}>
-        <JudulList
-          title='List Pencegahan Kriminalitas'
+      <Box py={10}>
+        <Paper bg={colors['white-1']} p={'md'}>
+          <JudulList
+            title='List Pencegahan Kriminalitas'
           href='/admin/keamanan/pencegahan-kriminalitas/create'
         />
         <Table striped withTableBorder withRowBorders>
           <TableThead>
             <TableTr>
               <TableTh>Nama Pencegahan Kriminalitas</TableTh>
-              <TableTh>Nomor Pencegahan Kriminalitas</TableTh>
+              <TableTh>Slug</TableTh>
               <TableTh>Deskripsi</TableTh>
               <TableTh>Detail</TableTh>
               </TableTr>
           </TableThead>
           <TableTbody>
-            <TableTr>
-              <TableTd>Pencegahan Kriminalitas 1</TableTd>
-              <TableTd>0896232831883</TableTd>
-              <TableTd>Pencegahan Kriminalitas 1</TableTd>
-              <TableTd>
-                <Button onClick={() => router.push('/admin/keamanan/pencegahan-kriminalitas/detail')}>
+            {kriminalitasState.findMany.data?.map((item) => (
+              <TableTr key={item.id}>
+                <TableTd>{item.programKeamanan.nama}</TableTd>
+                <TableTd>{item.programKeamanan.slug}</TableTd>
+                <TableTd>
+                  <Text fz={'sm'} dangerouslySetInnerHTML={{__html: item.programKeamanan.deskripsi || ''}} />
+                </TableTd>
+                <TableTd>
+                  <Button onClick={() => router.push(`/admin/keamanan/pencegahan-kriminalitas/${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"
+        path: "/admin/ekonomi/pasar-desa/pasar-desa-ui"
       },
       {
         id: "Ekonomi_2",

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

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

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

@@ -0,0 +1,26 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+
+export default async function kategoriMakananCreate(context: Context) {
+    const body = context.body as {nama: string};
+
+    if (!body.nama) {
+        return {
+            success: false,
+            message: "Nama is required",
+        };
+    }
+
+    const kategoriMakanan = await prisma.kategoriMakanan.create({
+        data: {
+            nama: body.nama,
+            deletedAt: null,
+        },
+    });
+    return {
+        success: true,
+        message: "Success create kategori makanan",
+        data: kategoriMakanan
+    };
+}

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

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

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

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

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

@@ -0,0 +1,47 @@
+import { Context } from "elysia";
+import prisma from "@/lib/prisma";
+
+export default async function kategoriMakananFindUnique(context: Context) {
+    const url = new URL(context.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.kategoriMakanan.findUnique({
+            where: { id },
+        });
+
+        if (!data) {
+            return {
+                success: false,
+                message: "Kategori makanan tidak ditemukan",
+            }
+        }
+
+        return {
+            success: true,
+            message: "Success find kategori makanan",
+            data,
+        }
+    } catch (error) {
+        console.error("Find by ID error:", error);
+        return {
+            success: false,
+            message: "Gagal mengambil kategori makanan: " + (error instanceof Error ? error.message : 'Unknown error'),
+        }
+    }
+}

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

@@ -0,0 +1,30 @@
+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

@@ -0,0 +1,35 @@
+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/lowongan-kerja/create.ts

@@ -0,0 +1,34 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+type FormCreate = {
+    posisi: string;
+    namaPerusahaan: string;
+    lokasi: string;
+    tipePekerjaan: string;
+    gaji: string;
+    deskripsi: string;
+    kualifikasi: string;
+}
+
+export default async function lowonganKerjaCreate(context: Context) {
+    const body = context.body as FormCreate;
+
+    const lowonganKerja = await prisma.lowonganPekerjaan.create({
+        data: {
+            posisi: body.posisi,
+            namaPerusahaan: body.namaPerusahaan,
+            lokasi: body.lokasi,
+            tipePekerjaan: body.tipePekerjaan,
+            gaji: body.gaji,
+            deskripsi: body.deskripsi,
+            kualifikasi: body.kualifikasi,
+        },
+    });
+
+    return {
+        success: true,
+        message: "Success create lowongan kerja",
+        data: lowonganKerja,
+    };
+}

src/app/api/[[...slugs]]/_lib/ekonomi/lowongan-kerja/del.ts

@@ -1,7 +1,7 @@
 import prisma from "@/lib/prisma";
 import { Context } from "elysia";
 
-export default async function kontakDaruratKeamananDelete(context: Context){
+const lowonganKerjaDelete = async (context: Context) => {
     const id = context.params?.id as string;
 
     if (!id) {
@@ -11,23 +11,24 @@ export default async function kontakDaruratKeamananDelete(context: Context){
         };
     }
 
-    const kontakDaruratKeamanan = await prisma.kontakDaruratKeamanan.findUnique({
+    const lowonganKerja = await prisma.lowonganPekerjaan.findUnique({
         where: { id },
     });
-
-    if (!kontakDaruratKeamanan) {
+    
+    if (!lowonganKerja) {
         return {
             status: 404,
-            body: "Kontak darurat keamanan tidak ditemukan",
+            body: "Lowongan kerja tidak ditemukan",
         };
     }
-
-    await prisma.kontakDaruratKeamanan.delete({
+    
+    await prisma.lowonganPekerjaan.delete({
         where: { id },
     });
-
     return {
         status: 200,
-        body: "Kontak darurat keamanan berhasil dihapus",
+        success: true,
+        message: "Lowongan kerja berhasil dihapus",
     };
-}
+};
+export default lowonganKerjaDelete;

src/app/api/[[...slugs]]/_lib/ekonomi/lowongan-kerja/findMany.ts

@@ -0,0 +1,21 @@
+import prisma from "@/lib/prisma";
+
+export default async function lowonganKerjaFindMany() {
+    try {
+        const data = await prisma.lowonganPekerjaan.findMany({
+            where: { isActive: true },
+        });
+
+        return {
+            success: true,
+            message: "Success fetch lowongan kerja",
+            data,
+        };
+    } catch (e) {
+        console.error("Find many error:", e);
+        return {
+            success: false,
+            message: "Failed fetch lowongan kerja",
+        };
+    }
+}

src/app/api/[[...slugs]]/_lib/ekonomi/lowongan-kerja/findUnique.ts

@@ -1,6 +1,6 @@
 import prisma from "@/lib/prisma";
 
-export default async function kontakDaruratKeamananFindUnique(request: Request){
+export default async function lowonganKerjaFindUnique(request: Request){
     const url = new URL(request.url);
     const pathSegments = url.pathname.split('/');
     const id = pathSegments[pathSegments.length - 1];
@@ -20,27 +20,31 @@ export default async function kontakDaruratKeamananFindUnique(request: Request){
             }, { status: 400 });
         }
 
-        const data = await prisma.kontakDaruratKeamanan.findUnique({
+        const data = await prisma.lowonganPekerjaan.findUnique({
             where: { id },
         });
 
         if (!data) {
             return Response.json({
                 success: false,
-                message: "Kontak darurat keamanan tidak ditemukan",
+                message: "Lowongan kerja tidak ditemukan",
             }, { status: 404 });
         }
 
         return Response.json({
             success: true,
-            message: "Success fetch kontak darurat keamanan by ID",
+            message: "Success fetch lowongan kerja by ID",
             data,
-        }, { status: 200 });
-    } catch (error) {
-        console.error("Find by ID error:", error);
+        }, {
+            status: 200,
+        });
+    } catch (e) {
+        console.error("Find by ID error:", e);
         return Response.json({
             success: false,
-            message: "Gagal mengambil kontak darurat keamanan: " + (error instanceof Error ? error.message : 'Unknown error'),
-        }, { status: 500 });
+            message: "Gagal mengambil lowongan kerja: " + (e instanceof Error ? e.message : 'Unknown error'),
+        }, {
+            status: 500,
+        });
     }
 }

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

@@ -0,0 +1,42 @@
+import Elysia, { t } from "elysia";
+import lowonganKerjaCreate from "./create";
+import lowonganKerjaFindMany from "./findMany";
+import lowonganKerjaFindUnique from "./findUnique";
+import lowonganKerjaDelete from "./del";
+import lowonganKerjaUpdate from "./updt";
+
+const LowonganKerja = new Elysia({prefix: "/lowongankerja", tags: ["Ekonomi/Lowongan Kerja"]})
+.post("/create", lowonganKerjaCreate, {
+    body: t.Object({
+        posisi: t.String(),
+        namaPerusahaan: t.String(),
+        lokasi: t.String(),
+        tipePekerjaan: t.String(),
+        gaji: t.String(),
+        deskripsi: t.String(),
+        kualifikasi: t.String(),
+    })
+})
+.get("/find-many", lowonganKerjaFindMany)
+.get("/:id", async (context) => {
+    const response = await lowonganKerjaFindUnique(new Request(context.request));
+    return response;
+})
+.delete("/del/:id", lowonganKerjaDelete)
+.put("/:id", async (context) => {
+    const response = await lowonganKerjaUpdate(context);
+    return response;
+}, {
+    body: t.Object({
+        posisi: t.String(),
+        namaPerusahaan: t.String(),
+        lokasi: t.String(),
+        tipePekerjaan: t.String(),
+        gaji: t.String(),
+        deskripsi: t.String(),
+        kualifikasi: t.String(),
+    })
+})
+
+
+export default LowonganKerja;

src/app/api/[[...slugs]]/_lib/ekonomi/lowongan-kerja/updt.ts

@@ -0,0 +1,64 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+type FormUpdate = {
+    posisi: string;
+    namaPerusahaan: string;
+    lokasi: string;
+    tipePekerjaan: string;
+    gaji: string;
+    deskripsi: string;
+    kualifikasi: string;
+}
+
+export default async function lowonganKerjaUpdate(context: Context){
+    try {
+        const id = context.params?.id;
+        const body = context.body as FormUpdate;
+
+        const { posisi, namaPerusahaan, lokasi, tipePekerjaan, gaji, deskripsi, kualifikasi } = body;
+        
+        if (!id) {
+            return Response.json({
+                success: false,
+                message: "ID tidak boleh kosong",
+            }, { status: 400 });
+        }
+
+        const existing = await prisma.lowonganPekerjaan.findUnique({
+            where: { id },
+        });
+
+        if (!existing) {
+            return Response.json({
+                success: false,
+                message: "Lowongan kerja tidak ditemukan",
+            }, { status: 404 });
+        }
+
+        const updated = await prisma.lowonganPekerjaan.update({
+            where: { id },
+            data: {
+                posisi,
+                namaPerusahaan,
+                lokasi,
+                tipePekerjaan,
+                gaji,
+                deskripsi,
+                kualifikasi,
+            },
+        });
+
+        return Response.json({
+            success: true,
+            message: "Success update lowongan kerja",
+            data: updated,
+        }, { status: 200 });
+    } catch (e) {
+        console.error("Update error:", e);
+        return Response.json({
+            success: false,
+            message: "Gagal mengupdate lowongan kerja: " + (e instanceof Error ? e.message : 'Unknown error'),
+        }, { status: 500 });
+    }
+}

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

@@ -0,0 +1,38 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+type FormCreate = {
+  nama: string;
+  harga: number;
+  satuan: string;
+  alamat: string;
+  imageId: string;
+  rating: number;
+  kategoriId: string; // Array of KategoriMakanan IDs
+};
+export default async function pasarDesaCreate(context: Context) {
+  const body = context.body as FormCreate;
+
+  // First, create the PasarDesa record
+  const pasarDesa = await prisma.pasarDesa.create({
+    data: {
+      nama: body.nama,
+      harga: Number(body.harga),
+      satuan: body.satuan,
+      alamat: body.alamat,
+      imageId: body.imageId,
+      rating: Number(body.rating),
+      kategoriId: body.kategoriId,
+    },
+    include: {
+      image: true,
+      kategori: true,
+    },
+  });
+
+    return {
+      success: true,
+      message: "Success create pasar desa",
+      data: pasarDesa,
+    };
+}

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

@@ -0,0 +1,54 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+import fs from "fs/promises";
+import path from "path";
+
+const pasarDesaDelete = async (context: Context) => {
+  const id = context.params?.id as string;
+
+  if (!id) {
+    return {
+      status: 400,
+      body: "ID tidak diberikan",
+    };
+  }
+
+  const pasarDesa = await prisma.pasarDesa.findUnique({
+    where: { id },
+    include: {
+      image: true,
+      kategori: true,
+    },
+  });
+
+  if (!pasarDesa) {
+    return {
+      status: 404,
+      body: "Pasar desa tidak ditemukan",
+    };
+  }
+
+  if (pasarDesa.image) {
+    try {
+      const filePath = path.join(pasarDesa.image.path, pasarDesa.image.name);
+      await fs.unlink(filePath);
+      await prisma.fileStorage.delete({
+        where: { id: pasarDesa.image.id },
+      });
+    } catch (err) {
+      console.error("Gagal hapus file image:", err);
+    }
+  }
+  
+
+  await prisma.pasarDesa.delete({
+    where: { id },
+  });
+
+  return {
+    status: 200,
+    success: true,
+    message: "Pasar desa berhasil dihapus",
+  };
+};
+export default pasarDesaDelete;

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

@@ -0,0 +1,25 @@
+import prisma from "@/lib/prisma";
+
+export default async function pasarDesaFindMany() {
+    try {
+        const data = await prisma.pasarDesa.findMany({
+            where: { isActive: true },
+            include: {
+                image: true,
+                kategori: true,
+            },
+        });
+
+        return {
+            success: true,
+            message: "Success fetch pasar desa",
+            data,
+        };
+    } catch (e) {
+        console.error("Find many error:", e);
+        return {
+            success: false,
+            message: "Failed fetch pasar desa",
+        };
+    }
+}

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

@@ -0,0 +1,54 @@
+import prisma from "@/lib/prisma";
+
+export default async function pasarDesaFindUnique(request: Request){
+    const url = new URL(request.url);
+    const pathSegments = url.pathname.split('/');
+    const id = pathSegments[pathSegments.length - 1];
+
+    if(!id){
+        return Response.json({
+            success: false,
+            message: "ID tidak boleh kosong",
+        }, { status: 400 });
+    }
+
+    try {
+        if (typeof id !== 'string') {
+            return Response.json({
+                success: false,
+                message: "ID tidak valid",
+            }, { status: 400 });
+        }
+
+        const data = await prisma.pasarDesa.findUnique({
+            where: { id },
+            include: {
+                image: true,
+                kategori: true,
+            },
+        });
+
+        if (!data) {
+            return Response.json({
+                success: false,
+                message: "Pasar desa tidak ditemukan",
+            }, { status: 404 });
+        }
+
+        return Response.json({
+            success: true,
+            message: "Success fetch pasar desa by ID",
+            data,
+        }, {
+            status: 200,
+        });
+    } catch (e) {
+        console.error("Find by ID error:", e);
+        return Response.json({
+            success: false,
+            message: "Gagal mengambil pasar desa: " + (e instanceof Error ? e.message : 'Unknown error'),
+        }, {
+            status: 500,
+        });
+    }
+}

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

@@ -0,0 +1,48 @@
+import Elysia, { t } from "elysia";
+import pasarDesaCreate from "./create";
+import pasarDesaDelete from "./del";
+import pasarDesaFindMany from "./findMany";
+import pasarDesaUpdate from "./updt";
+import pasarDesaFindUnique from "./findUnique";
+
+const PasarDesa = new Elysia({
+  prefix: "/pasardesa",
+  tags: ["Ekonomi/Pasar Desa"],
+})
+  .get("/find-many", pasarDesaFindMany)
+  .get("/:id", async (context) => {
+    const response = await pasarDesaFindUnique(new Request(context.request));
+    return response;
+  })
+  .post("/create", pasarDesaCreate, {
+    body: t.Object({
+      nama: t.String(),
+      harga: t.Number(),
+      satuan: t.String(),
+      alamat: t.String(),
+      imageId: t.String(),
+      rating: t.Number(),
+      kategoriId:t.String(),
+    }),
+  })
+  .delete("/del/:id", pasarDesaDelete)
+  .put(
+    "/:id",
+    async (context) => {
+      const response = await pasarDesaUpdate(context);
+      return response;
+    },
+    {
+      body: t.Object({
+        nama: t.String(),
+        harga: t.Number(),
+        satuan: t.String(),
+        alamat: t.String(),
+        imageId: t.String(),
+        rating: t.Number(),
+        kategoriId: t.String(),
+      }),
+    }
+  );
+
+export default PasarDesa;

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

@@ -0,0 +1,98 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+import fs from "fs/promises";
+import path from "path";
+
+type FormUpdate = {
+    nama: string;
+    harga: number;
+    satuan: string;
+    alamat: string;
+    imageId: string;
+    rating: number;
+    kategoriId: string; // Array of KategoriMakanan IDs
+  };
+
+export default async function pasarDesaUpdate(context: Context){
+    try {
+        const id = context.params?.id;
+        const body = context.body as FormUpdate;
+
+        const { nama, harga, satuan, alamat, imageId, rating, kategoriId } = body;
+        
+        if (!id) {
+            return Response.json({
+                success: false,
+                message: "ID tidak boleh kosong",
+            }, { status: 400 });
+        }
+
+        const existing = await prisma.pasarDesa.findUnique({
+            where: { id },
+            include: {
+                image: true,
+                kategori: true,
+            },
+        })
+
+        if (!existing) {
+            return Response.json({
+                success: false,
+                message: "Pasar desa tidak ditemukan",
+            }, { status: 404 });
+        }
+
+        if (existing.imageId && existing.imageId !== imageId) {
+            const oldImage = existing.image;
+            if (oldImage) {
+              try {
+                const filePath = path.join(oldImage.path, oldImage.name);
+                await fs.unlink(filePath);
+                await prisma.fileStorage.delete({
+                  where: { id: oldImage.id },
+                });
+              } catch (err) {
+                console.error("Gagal hapus gambar lama:", err);
+              }
+            }
+          }
+
+        // First, update the main PasarDesa record
+        await prisma.pasarDesa.update({
+            where: { id },
+            data: {
+                nama,
+                harga,
+                satuan,
+                alamat,
+                imageId,
+                rating,
+                kategoriId,
+            },
+        });
+
+        // Fetch the updated record with all relations
+        const updated = await prisma.pasarDesa.findUnique({
+            where: { id },
+            include: {
+                image: true,
+                kategori: true,
+            }
+        });
+        return Response.json({
+            success: true,
+            message: "Success update pasar desa",
+            data: updated,
+        }, {
+            status: 200,
+        });
+    } catch (e) {
+        console.error("Update error:", e);
+        return Response.json({
+            success: false,
+            message: "Gagal mengupdate pasar desa: " + (e instanceof Error ? e.message : 'Unknown error'),
+        }, {
+            status: 500,
+        });
+    }
+}

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

@@ -1,18 +1,18 @@
 import Elysia from "elysia";
 import KeamananLingkungan from "./keamanan-lingkungan";
 import PolsekTerdekat from "./polsek-terdekat";
-import KontakDarurat from "./kontak-darurat";
 import PencegahanKriminalitas from "./pencegahan-kriminalitas";
 import MenuTipsKeamanan from "./tips-keamanan";
 import LaporanPublik from "./laporan-publik";
 import LayananPolsek from "./layanan-polsek";
+import KontakDaruratKeamanan from "./kontak-darurat-keamanan";
 
 const Keamanan = new Elysia({ prefix: "/api/keamanan", tags: ["Keamanan"] })
 .use(KeamananLingkungan)
 .use(PolsekTerdekat)
-.use(KontakDarurat)
 .use(PencegahanKriminalitas)
 .use(MenuTipsKeamanan)
 .use(LaporanPublik)
 .use(LayananPolsek)
+.use(KontakDaruratKeamanan)
 export default Keamanan;

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat-keamanan/create.ts

@@ -1,22 +1,28 @@
 import prisma from "@/lib/prisma";
-import { Prisma } from "@prisma/client";
 import { Context } from "elysia";
 
-type FormCreate = Prisma.KontakDaruratKeamananGetPayload<{
-    select: {
-        nama: true,
-        kontak: true,
-        icon: true,
-    }
-}>
+type FormCreate = {
+        nama: string,
+        imageId?: string,
+        kontakItems: {
+            nama: string,
+            nomorTelepon: string,
+            imageId?: string
+        }[]
+}
 export default async function kontakDaruratKeamananCreate(context: Context){
     const body = context.body as FormCreate
 
     await prisma.kontakDaruratKeamanan.create({
         data: {
             nama: body.nama,
-            kontak: body.kontak,
-            icon: body.icon,
+            imageId: body.imageId,
+            kontakItems: {
+                create: body.kontakItems,
+            },
+        },
+        include: {
+            kontakItems: true,
         }
     })
     return {

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

@@ -0,0 +1,58 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+import fs from "fs/promises";
+import path from "path";
+
+export default async function kontakDaruratKeamananDelete(context: Context){
+    const id = context.params?.id as string;
+
+    if (!id) {
+        return {
+            status: 400,
+            body: "ID tidak diberikan",
+        };
+    }
+
+    await prisma.kontakItem.deleteMany({
+        where: {
+          kategoriId: id,
+        },
+      });
+
+    const kontakDaruratKeamanan = await prisma.kontakDaruratKeamanan.findUnique({
+        where: { id },
+        include: {
+            kontakItems: true,
+            image: true,
+        }
+    });
+
+    if (!kontakDaruratKeamanan) {
+        return {
+            status: 404,
+            body: "Kontak darurat keamanan tidak ditemukan",
+        };
+    }
+
+    if (kontakDaruratKeamanan.image) {
+        try {
+            const filePath = path.join(kontakDaruratKeamanan.image.path, kontakDaruratKeamanan.image.name);
+            await fs.unlink(filePath);
+            await prisma.fileStorage.delete({
+              where: { id: kontakDaruratKeamanan.image.id },
+            });
+          } catch (err) {
+            console.error("Gagal hapus file image:", err);
+          }
+    }
+
+    await prisma.kontakDaruratKeamanan.delete({
+        where: { id },
+    });
+
+    return {
+        status: 200,
+        success: true,
+        message: "Kontak darurat keamanan berhasil dihapus",
+    };
+}

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat-keamanan/findMany.ts

@@ -3,7 +3,13 @@ import prisma from "@/lib/prisma";
 export default async function kontakDaruratKeamananFindMany() {
     try {
         const data = await prisma.kontakDaruratKeamanan.findMany({
-            where: { isActive: true },
+            include: {
+                kontakItems: true,
+                image: true,
+            },
+            orderBy: {
+                createdAt: "desc",
+            }
         });
 
         return {

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat-keamanan/findUnique.ts

@@ -0,0 +1,73 @@
+import prisma from "@/lib/prisma";
+
+export default async function kontakDaruratKeamananFindUnique(
+  request: Request
+) {
+  const url = new URL(request.url);
+  const pathSegments = url.pathname.split("/");
+  const id = pathSegments[pathSegments.length - 1];
+
+  if (!id) {
+    return Response.json(
+      {
+        success: false,
+        message: "ID tidak boleh kosong",
+      },
+      { status: 400 }
+    );
+  }
+
+  try {
+    if (typeof id !== "string") {
+      return Response.json(
+        {
+          success: false,
+          message: "ID tidak valid",
+        },
+        { status: 400 }
+      );
+    }
+
+    const data = await prisma.kontakDaruratKeamanan.findUnique({
+      where: { id },
+      include: {
+        kontakItems: {
+          include: {
+            image: true,
+          },
+        },
+        image: true,
+      },
+    });
+
+    if (!data) {
+      return Response.json(
+        {
+          success: false,
+          message: "Kontak darurat keamanan tidak ditemukan",
+        },
+        { status: 404 }
+      );
+    }
+
+    return Response.json(
+      {
+        success: true,
+        message: "Success fetch kontak darurat keamanan by ID",
+        data,
+      },
+      { status: 200 }
+    );
+  } catch (error) {
+    console.error("Find by ID error:", error);
+    return Response.json(
+      {
+        success: false,
+        message:
+          "Gagal mengambil kontak darurat keamanan: " +
+          (error instanceof Error ? error.message : "Unknown error"),
+      },
+      { status: 500 }
+    );
+  }
+}

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat-keamanan/index.ts

@@ -0,0 +1,53 @@
+import Elysia, { t } from "elysia";
+import kontakDaruratKeamananCreate from "./create";
+import kontakDaruratKeamananDelete from "./del";
+import kontakDaruratKeamananFindMany from "./findMany";
+import kontakDaruratKeamananFindUnique from "./findUnique";
+import kontakDaruratKeamananUpdate from "./updt";
+
+const KontakDaruratKeamanan = new Elysia({
+  prefix: "/kontakdaruratkeamanan",
+  tags: ["Keamanan/Kontak Darurat"],
+})
+  .get("/find-many", kontakDaruratKeamananFindMany)
+  .get("/:id", async (context) => {
+    const response = await kontakDaruratKeamananFindUnique(
+      new Request(context.request)
+    );
+    return response;
+  })
+  .post("/create", kontakDaruratKeamananCreate, {
+    body: t.Object({
+      nama: t.String(),
+      imageId: t.Optional(t.String()),
+      kontakItems: t.Array(
+        t.Object({
+          nama: t.String(),
+          nomorTelepon: t.String(),
+          imageId: t.Optional(t.String()),
+        })
+      ),
+    }),
+  })
+  .delete("/del/:id", kontakDaruratKeamananDelete)
+  .put(
+    "/:id",
+    async (context) => {
+      const response = await kontakDaruratKeamananUpdate(context);
+      return response;
+    },
+    {
+      body: t.Object({
+        nama: t.String(),
+        imageId: t.Optional(t.String()),
+        kontakItems: t.Array(
+          t.Object({
+            nama: t.String(),
+            nomorTelepon: t.String(),
+            imageId: t.Optional(t.String()),
+          })
+        ),
+      }),
+    }
+  );
+export default KontakDaruratKeamanan;

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat-keamanan/updt.ts

@@ -0,0 +1,57 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+type FormUpdate = {
+    nama: string;
+    imageId?: string;
+    kontakItems: {
+      nama: string;
+      nomorTelepon: string;
+      imageId?: string;
+    }[];
+  };
+
+export default async function kontakDaruratKeamananUpdate(context: Context){
+    try {
+        const { id } = context.params as { id: string };
+        const body = context.body as FormUpdate;
+      
+        // Hapus kontakItems lama
+        await prisma.kontakItem.deleteMany({
+          where: {
+            kategoriId: id,
+          },
+        });
+      
+        // Update utama
+        const updated = await prisma.kontakDaruratKeamanan.update({
+          where: { id },
+          data: {
+            nama: body.nama,
+            imageId: body.imageId,
+            kontakItems: {
+              create: body.kontakItems,
+            },
+          },
+          include: {
+            kontakItems: true,
+          },
+        });
+      
+        return {
+          success: true,
+          message: "Success update kontak darurat keamanan",
+          data: updated,
+        };
+    } catch (error) {
+        console.error("Error updating kontak darurat keamanan:", error);
+        return Response.json({
+            success: false,
+            message: "Terjadi kesalahan saat mengupdate kontak darurat keamanan",
+        }, { status: 500 ,
+            headers: {
+                "Content-Type": "application/json",
+            },
+        });
+    }
+}

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat/index.ts

@@ -1,32 +0,0 @@
-import Elysia, { t } from "elysia";
-import kontakDaruratKeamananFindMany from "./findMany";
-import kontakDaruratKeamananFindUnique from "./findUnique";
-import kontakDaruratKeamananCreate from "./create";
-import kontakDaruratKeamananDelete from "./del";
-
-const kontakDaruratKeamanan = new Elysia({ prefix: "/kontak-darurat", tags: ["Keamanan/Kontak Darurat"] })
-.get("/find-many", kontakDaruratKeamananFindMany)
-.get("/:id", async (context) => {
-    const response = await kontakDaruratKeamananFindUnique(new Request(context.request));
-    return response;
-})
-.post("/create", kontakDaruratKeamananCreate, {
-    body: t.Object({
-        nama: t.String(),
-        kontak: t.String(),
-        icon: t.String(),
-    }),
-})
-.delete("/del/:id", kontakDaruratKeamananDelete)
-.put("/:id", async (context) => {
-    const response = await kontakDaruratKeamananCreate(context);
-    return response;
-},
-{
-    body: t.Object({
-        nama: t.String(),
-        kontak: t.String(),
-        icon: t.String(),
-    }),
-})
-export default kontakDaruratKeamanan;

src/app/api/[[...slugs]]/_lib/keamanan/kontak-darurat/updt.ts

@@ -1,61 +0,0 @@
-import prisma from "@/lib/prisma";
-import { Prisma } from "@prisma/client";
-import { Context } from "elysia";
-
-type FormUpdate = Prisma.KontakDaruratKeamananGetPayload<{
-    select: {
-        nama: true;
-        kontak: true;
-        icon: true;
-    }
-}>
-export default async function kontakDaruratUpdate(context: Context){
-    try {
-        const id = context.params?.id;
-        const body = (await context.body) as Omit<FormUpdate, "id">;
-
-        const {nama, kontak, icon} = body;
-
-        if(!id){
-            return Response.json({
-                success: false,
-                message: "ID tidak diberikan",
-            }, { status: 400 });
-        }
-
-        const existing = await prisma.kontakDaruratKeamanan.findUnique({
-            where: { id },
-        });
-
-        if (!existing) {
-            return Response.json({
-                success: false,
-                message: "Kontak darurat keamanan tidak ditemukan",
-            }, { status: 404 });
-        }
-        const updated = await prisma.kontakDaruratKeamanan.update({
-            where: { id },
-            data: {
-                nama,
-                kontak,
-                icon,
-            },
-        });
-
-        return Response.json({
-            success: true,
-            message: "Success update kontak darurat keamanan",
-            data: updated,
-        }, { status: 200 });
-    } catch (error) {
-        console.error("Error updating kontak darurat keamanan:", error);
-        return Response.json({
-            success: false,
-            message: "Terjadi kesalahan saat mengupdate kontak darurat keamanan",
-        }, { status: 500 ,
-            headers: {
-                "Content-Type": "application/json",
-            },
-        });
-    }
-}

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

@@ -23,7 +23,8 @@ const pencegahanKriminalitasDelete = async (context: Context) => {
     if (!pencegahanKriminalitas) {
         return {
             status: 404,
-            body: "Pencegahan kriminalitas tidak ditemukan",
+            success: false,
+            message: "Pencegahan kriminalitas tidak ditemukan",
         };
     }
 
@@ -33,7 +34,8 @@ const pencegahanKriminalitasDelete = async (context: Context) => {
 
     return {
         status: 200,
-        body: "Pencegahan kriminalitas berhasil dihapus",
+        success: true,
+        message: "Pencegahan kriminalitas berhasil dihapus",
     };
 };
 export default pencegahanKriminalitasDelete;

src/app/api/[[...slugs]]/route.ts

@@ -18,6 +18,7 @@ import uplImg from "./_lib/upl-img";
 import { uplImgSingle } from "./_lib/upl-img-single";
 import FileStorage from "./_lib/fileStorage";
 import Keamanan from "./_lib/keamanan";
+import Ekonomi from "./_lib/ekonomi";
 
 
 const ROOT = process.cwd();
@@ -79,6 +80,7 @@ const ApiServer = new Elysia()
   .use(Keamanan)
   .use(Utils)
   .use(FileStorage)
+  .use(Ekonomi)
   .onError(({ code }) => {
     if (code === "NOT_FOUND") {
       return {

src/app/darmasaba/(pages)/ppid/profile-ppid/page.tsx

@@ -9,7 +9,7 @@ import BackButton from '../../desa/layanan/_com/BackButto';
 function Page() {
   const allList = useProxy(stateProfilePPID)
   useShallowEffect(() => {
-    allList.profile.load("1") // Assuming "1" is your default ID, adjust as needed
+    allList.profile.load("edit") // Assuming "1" is your default ID, adjust as needed
   }, [])
 
   if (!allList.profile.data) return <Stack bg={colors.Bg} py={"xl"} gap={"22"}>
@@ -47,7 +47,7 @@ function Page() {
           <Paper p={"xl"} bg={colors['white-trans-1']}>
             <Box px={{ base: "md", md: 100 }}>
               <Flex align={"center"} gap={50}>
-                <Image src={"/api/img/darmasaba-icon.png"} h={{ base: 80, md: 150 }} alt='' />
+                <Image src={"/darmasaba-icon.png"} h={{ base: 80, md: 150 }} alt='' />
                 <Text fz={{ base: "1.4rem", md: "2rem", lg: "2.5rem", xl: "3rem" }} fw={'bold'}>PROFIL PIMPINAN BADAN PUBLIK DESA DARMASABA </Text>
               </Flex>
             </Box>

src/app/darmasaba/_com/main-page/landing-page/index.tsx

@@ -134,7 +134,7 @@ function LandingPage() {
                       p={"sm"}
                     >
                       <Image
-                        src={"/assets/images/darmasaba-icon.png"}
+                        src={"/darmasaba-icon.png"}
                         alt="icon"
                         sizes="100%"
                       />
@@ -163,7 +163,7 @@ function LandingPage() {
                       bg={"white"}
                     >
                       <Image
-                        src={"/api/img/pudak-icon.png"}
+                        src={"/pudak-icon.png"}
                         alt="icon"
                         sizes={"100%"}
                         fit="contain"