UI & API Menu Ekonomi, Submenu Jumlah Penduduk Miskin

prisma/schema.prisma

@@ -1227,3 +1227,14 @@ model GrafikMenganggurBerdasarkanPendidikan {
   deletedAt DateTime @default(now())
   isActive  Boolean  @default(true)
 }
+
+// ========================================= JUMLAH PENDUDUK MISKIN ========================================= //
+model GrafikJumlahPendudukMiskin {
+  id                      String    @id @default(uuid()) @db.Uuid // Menggunakan UUID sebagai primary key
+  year                    Int       @unique                        // Tahun data (e.g., 2024, 2025)
+  totalPoorPopulation     Int                                      // Jumlah penduduk miskin (e.g., 4800000)
+  createdAt               DateTime  @default(now())
+  updatedAt               DateTime  @updatedAt
+  deletedAt DateTime @default(now())
+  isActive  Boolean  @default(true)
+}

src/app/admin/(dashboard)/_state/ekonomi/jumlah-penduduk-miskin.ts

@@ -0,0 +1,180 @@
+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 templateJumlahPendudukMiskin = z.object({
+    year: z.number().min(1, "Data tahun harus diisi"),
+    totalPoorPopulation: z.number().min(1, "Data total penduduk miskin harus diisi"),
+});
+
+type JumlahPendudukMiskin = Prisma.GrafikJumlahPendudukMiskinGetPayload<{
+    select: {
+        id: true;
+        year: true;
+        totalPoorPopulation: true;
+    };
+}>;
+
+const defaultForm: Omit<JumlahPendudukMiskin, 'id'> & { id?: string } = {
+    year: 0,
+    totalPoorPopulation: 0,
+};
+
+const jumlahPendudukMiskin = proxy({
+    create: {
+        form: defaultForm,
+        loading: false,
+        async create() {
+          const cek = templateJumlahPendudukMiskin.safeParse(
+            jumlahPendudukMiskin.create.form
+          );
+          if (!cek.success) {
+            const err = `[${cek.error.issues
+              .map((v) => `${v.path.join(".")}`)
+              .join("\n")}] required`;
+            return toast.error(err);
+          }
+          try {
+            jumlahPendudukMiskin.create.loading = true;
+            const res = await ApiFetch.api.ekonomi.jumlahpendudukmiskin[
+              "create"
+            ].post(jumlahPendudukMiskin.create.form);
+            if (res.status === 200) {
+              const id = res.data?.data?.id;
+              if (id) {
+                toast.success("Success create");
+                jumlahPendudukMiskin.create.form = {
+                  year: 0,
+                  totalPoorPopulation: 0,
+                };
+                jumlahPendudukMiskin.findMany.load();
+                return id;
+              }
+            }
+            return toast.error("failed create");
+          } catch (error) {
+            console.log((error as Error).message);
+          } finally {
+            jumlahPendudukMiskin.create.loading = false;
+          }
+        },
+      },
+      findMany: {
+        data: null as
+          | Prisma.GrafikJumlahPendudukMiskinGetPayload<{
+              select: { id: true; year: true; totalPoorPopulation: true; };
+            }>[]
+          | null,
+        loading: false,
+        async load() {
+          const res = await ApiFetch.api.ekonomi.jumlahpendudukmiskin[
+            "find-many"
+          ].get();
+          if (res.status === 200) {
+            jumlahPendudukMiskin.findMany.data = res.data?.data ?? [];
+          }
+        },
+      },
+      findUnique: {
+        data: null as Prisma.GrafikJumlahPendudukMiskinGetPayload<{
+          select: { id: true; year: true; totalPoorPopulation: true; };
+        }> | null,
+        async load(id: string) {
+          try {
+            const res = await fetch(
+              `/api/ekonomi/jumlahpendudukmiskin/${id}`
+            );
+            if (res.ok) {
+              const data = await res.json();
+              jumlahPendudukMiskin.findUnique.data = data.data ?? null;
+            } else {
+              console.error("Failed to fetch data", res.status, res.statusText);
+              jumlahPendudukMiskin.findUnique.data = null;
+            }
+          } catch (error) {
+            console.error("Error loading grafik jumlah penduduk miskin:", error);
+            jumlahPendudukMiskin.findUnique.data = null;
+          }
+        },
+      },
+      update: {
+        id: "",
+        form: {...defaultForm},
+        loading: false,
+        async byId() {
+          // Method implementation if needed
+        },
+        async submit() {
+          const id = this.id;
+          if (!id) {
+            toast.warn("ID tidak valid");
+            return null;
+          }
+          const cek = templateJumlahPendudukMiskin.safeParse(this.form);
+          if (!cek.success) {
+            const err = `[${cek.error.issues.map((v) => (v.path as string[]).join(".")).join("\n")}] required`;
+            toast.error(err);
+            return null;
+          }
+          this.loading = true;
+          try {
+            const response = await fetch(
+              `/api/ekonomi/jumlahpendudukmiskin/${id}`, {
+              method: "PUT",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify(this.form),
+            });
+            const result = await response.json();
+            if (!response.ok || !result?.success) {
+              throw new Error(result?.message || "Gagal update data");
+            }
+            toast.success("Berhasil update data!");
+            await jumlahPendudukMiskin.findMany.load();
+            return result.data;
+          } catch (error) {
+            console.error("Error update data grafik jumlah penduduk miskin:", error);
+            toast.error("Gagal update data grafik jumlah penduduk miskin");
+          } finally {
+            this.loading = false;
+          }
+        },
+      },
+      delete: {
+        loading: false,
+        async byId(id: string) {
+          if (!id) return toast.warn("ID tidak valid");
+    
+          try {
+            jumlahPendudukMiskin.delete.loading = true;
+    
+            const response = await fetch(`/api/ekonomi/jumlahpendudukmiskin/del/${id}`, {
+              method: "DELETE",
+              headers: {
+                "Content-Type": "application/json",
+              },
+            });
+    
+            const result = await response.json();
+    
+            if (response.ok && result?.success) {
+              toast.success(result.message || "Grafik jumlah penduduk miskin berhasil dihapus");
+              await jumlahPendudukMiskin.findMany.load(); // refresh list
+            } else {
+              toast.error(result?.message || "Gagal menghapus grafik jumlah penduduk miskin");
+            }
+          } catch (error) {
+            console.error("Gagal delete grafik jumlah penduduk miskin:", error);
+            toast.error("Terjadi kesalahan saat menghapus grafik jumlah penduduk miskin");
+          } finally {
+            jumlahPendudukMiskin.delete.loading = false;
+          }
+        },
+      }
+})
+export default jumlahPendudukMiskin
+    
+    

src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/[id]/page.tsx

@@ -0,0 +1,80 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+
+import jumlahPendudukMiskin from '@/app/admin/(dashboard)/_state/ekonomi/jumlah-penduduk-miskin';
+import colors from '@/con/colors';
+import { Box, Button, Paper, Stack, TextInput, Title } from '@mantine/core';
+import { IconArrowBack } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect } from 'react';
+import { useProxy } from 'valtio/utils';
+
+function EditJumlahPendudukMiskin() {
+  const router = useRouter()
+  const params = useParams() as { id: string }
+  const stateJPM = useProxy(jumlahPendudukMiskin)
+
+  const id = params.id
+
+  // Load data saat komponen mount
+  useEffect(() => {
+    if (id) {
+      stateJPM.findUnique.load(id).then(() => {
+        const data = stateJPM.findUnique.data
+        if (data) {
+          stateJPM.update.form = {
+            year: data.year || 0,
+            totalPoorPopulation: data.totalPoorPopulation || 0,
+          }
+        }
+      })
+    }
+  }, [id])
+
+  const handleSubmit = async () => {
+    // Set the ID before submitting
+    stateJPM.update.id = id;
+    await stateJPM.update.submit();
+    router.push('/admin/ekonomi/jumlah-penduduk-miskin-2024-2025')
+  }
+return (
+    <Box>
+      <Box mb={10}>
+        <Button variant="subtle" onClick={() => router.back()}>
+          <IconArrowBack size={20} />
+        </Button>
+      </Box>
+      <Paper bg={colors['white-1']} w={{ base: '100%', md: '50%' }} p={'md'}>
+        <Stack>
+          <Title order={3}>Edit Jumlah Penduduk Miskin</Title>
+          <TextInput
+            label="Tahun"
+            placeholder="masukkan tahun"
+            value={stateJPM.update.form.year}
+            onChange={(val) => {
+              stateJPM.update.form.year = Number(val.currentTarget.value);
+            }}
+          />
+          <TextInput
+            label="Jumlah Penduduk Miskin"
+            type="number"
+            placeholder="masukkan jumlah penduduk miskin"
+            value={stateJPM.update.form.totalPoorPopulation}
+            onChange={(val) => {
+              stateJPM.update.form.totalPoorPopulation = Number(val.currentTarget.value);
+            }}
+          />
+          <Button
+            mt={10}
+            bg={colors['blue-button']}
+            onClick={handleSubmit}
+          >
+            Simpan
+          </Button>
+        </Stack>
+      </Paper>
+    </Box>
+  )
+}
+
+export default EditJumlahPendudukMiskin;

src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/create/page.tsx

@@ -1,37 +1,81 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 'use client'
+import grafikkepuasan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/grafikKepuasan';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
-
+import { useState } from 'react';
+import { useProxy } from 'valtio/utils';
+import jumlahPendudukMiskin from '../../../_state/ekonomi/jumlah-penduduk-miskin';
 
 function CreateJumlahPendudukMiskin() {
-  const router = useRouter();
+  const stateJPM = useProxy(jumlahPendudukMiskin);
+  const [chartData, setChartData] = useState<any[]>([]);
+  const router = useRouter()
+
+  const resetForm = () => {
+    stateJPM.create.form = {
+      year: 0,
+      totalPoorPopulation: 0,
+    }
+  }
+
+  const handleSubmit = async () => {
+    const id = await stateJPM.create.create();
+    if (id) {
+      const idStr = String(id);
+      await stateJPM.findUnique.load(idStr);
+      if (stateJPM.findUnique.data) {
+        setChartData([stateJPM.findUnique.data]);
+      }
+    }
+    resetForm();
+    router.push("/admin/ekonomi/jumlah-penduduk-miskin-2024-2025");
+  }
   return (
     <Box>
       <Box mb={10}>
-        <Button onClick={() => router.back()} variant='subtle' color={'blue'}>
+        <Button variant="subtle" onClick={() => router.back()}>
-          <IconArrowBack color={colors['blue-button']} size={25}/>
+          <IconArrowBack size={20} />
         </Button>
       </Box>
-
+      <Box>
         <Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
+          <Title order={4}>Tambah Grafik Hasil Kepuasan Masyarakat</Title>
           <Stack gap={"xs"}>
-          <Title order={4}>Create Jumlah Penduduk Miskin</Title>
             <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Tahun</Text>}
+              label="Tahun"
-          placeholder='Masukkan tahun'
+              type="number"
+              value={stateJPM.create.form.year}
+              placeholder="Masukkan tahun"
+              onChange={(val) => {
+                stateJPM.create.form.year = Number(val.currentTarget.value);
+              }}
             />
             <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Jumlah Penduduk Miskin</Text>}
+              label="Jumlah Penduduk Miskin"
-          placeholder='Masukkan jumlah penduduk miskin'
+              type="number"
+              value={stateJPM.create.form.totalPoorPopulation}
+              placeholder="Masukkan jumlah penduduk miskin"
+              onChange={(val) => {
+                stateJPM.create.form.totalPoorPopulation = Number(val.currentTarget.value);
+              }}
             />
             <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
+              <Button
+                bg={colors['blue-button']}
+                mt={10}
+                onClick={handleSubmit}
+              >
+                Submit
+              </Button>
             </Group>
           </Stack>
         </Paper>
       </Box>
+    </Box>
   );
 }
 

src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/detail/page.tsx

@@ -1,58 +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 DetailJumlahPendudukMiskin() {
-  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 Jumlah Penduduk Miskin</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-              <Box>
-                <Text fw={"bold"}>Tahun</Text>
-                <Text>2024</Text>
-              </Box>
-              <Box>
-                <Text fw={"bold"}>Jumlah Penduduk Miskin</Text>
-                <Text>100</Text>
-              </Box>
-              <Box>
-                <Flex gap={"xs"}>
-                  <Button color="red">
-                    <IconX size={20} />
-                  </Button>
-                  <Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-miskin-2024-2025/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 DetailJumlahPendudukMiskin;
-

src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/edit/page.tsx

@@ -1,38 +0,0 @@
-'use client'
-import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-
-
-function EditJumlahPendudukMiskin() {
-  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 Jumlah Penduduk Miskin</Title>
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Tahun</Text>}
-          placeholder='Masukkan tahun'
-          />
-          <TextInput
-          label={<Text fw={"bold"} fz={"sm"}>Jumlah Penduduk Miskin</Text>}
-          placeholder='Masukkan jumlah penduduk miskin'
-          />
-          <Group>
-            <Button bg={colors['blue-button']}>Submit</Button>
-          </Group>
-       </Stack>
-      </Paper>
-   </Box>
-  );
-}
-
-export default EditJumlahPendudukMiskin;

src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/page.tsx

@@ -1,28 +1,93 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
+import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
-import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
+import { IconEdit, IconSearch, IconTrash } from '@tabler/icons-react';
 import HeaderSearch from '../../_com/header';
 import JudulList from '../../_com/judulList';
 import { useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
+import { useProxy } from 'valtio/utils';
+import jumlahPendudukMiskin from '../../_state/ekonomi/jumlah-penduduk-miskin';
+import { Bar, BarChart, Legend, XAxis, YAxis, Tooltip } from 'recharts';
+import { ModalKonfirmasiHapus } from '../../_com/modalKonfirmasiHapus';
 
 function JumlahPendudukMiskin() {
+  const [search, setSearch] = useState("");
   return (
     <Box>
       <HeaderSearch
         title='Jumlah Penduduk Miskin'
         placeholder='pencarian'
         searchIcon={<IconSearch size={20} />}
+        value={search}
+        onChange={(e) => setSearch(e.currentTarget.value)}
       />
-      <ListJumlahPendudukMiskin/>
+      <ListJumlahPendudukMiskin search={search} />
     </Box>
   );
 }
 
-function ListJumlahPendudukMiskin() {
+function ListJumlahPendudukMiskin({ search }: { search: string }) {
+  type JPMGrafik = {
+    id: string;
+    year: number;
+    totalPoorPopulation: number;
+  }
+  const stateJPM = useProxy(jumlahPendudukMiskin);
+  const [chartData, setChartData] = useState<JPMGrafik[]>([]);
+  const [mounted, setMounted] = useState(false); // untuk memastikan DOM sudah ready
+  const isTablet = useMediaQuery('(max-width: 1024px)')
+  const isMobile = useMediaQuery('(max-width: 768px)')
+  const [modalHapus, setModalHapus] = useState(false)
+  const [selectedId, setSelectedId] = useState<string | null>(null)
   const router = useRouter();
+
+  const handleDelete = () => {
+    if (selectedId) {
+      stateJPM.delete.byId(selectedId)
+      setModalHapus(false)
+      setSelectedId(null)
+
+      stateJPM.findMany.load()
+    }
+  }
+
+  useShallowEffect(() => {
+    setMounted(true)
+    stateJPM.findMany.load()
+  }, [])
+
+  useEffect(() => {
+    setMounted(true);
+    if (stateJPM.findMany.data) {
+      setChartData(stateJPM.findMany.data.map((item) => ({
+        id: item.id,
+        year: Number(item.year),
+        totalPoorPopulation: Number(item.totalPoorPopulation),
+      })));
+    }
+  }, [stateJPM.findMany.data]);
+
+  const filteredData = (stateJPM.findMany.data || []).filter(item => {
+    const keyword = search.toLowerCase();
+    return (
+      item.year.toString().toLowerCase().includes(keyword) ||
+      item.totalPoorPopulation.toString().toLowerCase().includes(keyword)
+    );
+  });
+
+  if (!stateJPM.findMany.data) {
+    return (
+      <Stack>
+        <Skeleton h={500} />
+      </Stack>
+    )
+  }
+
   return (
     <Box py={10}>
+      <Stack gap={'xs'}>
         <Paper bg={colors['white-1']} p={'md'}>
           <JudulList
             title='List Jumlah Penduduk Miskin'
@@ -33,22 +98,70 @@ function ListJumlahPendudukMiskin() {
               <TableTr>
                 <TableTh>Tahun</TableTh>
                 <TableTh>Jumlah Penduduk Miskin</TableTh>
-              <TableTh>Detail</TableTh>
+                <TableTh>Edit</TableTh>
+                <TableTh>Delete</TableTh>
               </TableTr>
             </TableThead>
             <TableTbody>
-            <TableTr>
+              {filteredData.map((item) => (
-              <TableTd>2024</TableTd>
+                <TableTr key={item.id}>
-              <TableTd>100</TableTd>
+                  <TableTd>{item.year}</TableTd>
+                  <TableTd>{item.totalPoorPopulation}</TableTd>
                   <TableTd>
-                <Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-miskin-2024-2025/detail')}>
+                    <Button color='green' onClick={() => router.push(`/admin/ekonomi/jumlah-penduduk-miskin-2024-2025/${item.id}`)}>
-                  <IconDeviceImac size={20} />
+                      <IconEdit size={20} />
+                    </Button>
+                  </TableTd>
+                  <TableTd>
+                    <Button
+                      color='red'
+                      disabled={stateJPM.delete.loading}
+                      onClick={() => {
+                        setSelectedId(item.id)
+                        setModalHapus(true)
+                      }}>
+                      <IconTrash size={20} />
                     </Button>
                   </TableTd>
                 </TableTr>
+              ))}
             </TableTbody>
           </Table>
         </Paper>
+
+        {/* Chart */}
+        {!mounted && !chartData ? (
+          <Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
+            <Paper bg={colors['white-1']} p={'md'}>
+              <Title pb={10} order={3}>Grafik Jumlah Penduduk Miskin</Title>
+              <Text c='dimmed'>Belum ada data untuk ditampilkan dalam grafik</Text>
+            </Paper>
+          </Box>
+        ) : (
+          <Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
+            <Paper bg={colors['white-1']} p={'md'}>
+              <Title pb={10} order={4}>Grafik Jumlah Penduduk Miskin</Title>
+              {mounted && chartData.length > 0 && (
+                <BarChart width={isMobile ? 450 : isTablet ? 500 : 550} height={350} data={chartData} >
+                  <XAxis dataKey="year" />
+                  <YAxis />
+                  <Tooltip />
+                  <Legend />
+                  <Bar dataKey="totalPoorPopulation" fill={colors['blue-button']} name="Jumlah Penduduk Miskin" />
+                </BarChart>
+              )}
+            </Paper>
+          </Box>
+        )}
+      </Stack>
+
+      {/* Modal Konfirmasi Hapus */}
+      <ModalKonfirmasiHapus
+        opened={modalHapus}
+        onClose={() => setModalHapus(false)}
+        onConfirm={handleDelete}
+        text='Apakah anda yakin ingin menghapus grafik jumlah penduduk miskin ini?'
+      />
     </Box>
   );
 }

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

@@ -6,6 +6,7 @@ import KategoriProduk from "./pasar-desa/kategori-produk";
 import StrukturOrganisasi from "./struktur-organisasi";
 import GrafikUsiaKerjaYangMenganggur from "./usia-kerja-yang-menganggur";
 import GrafikMenganggurBerdasarkanPendidikan from "./usia-kerja-yang-menganggur/pengangguran-berdasrkan-pendidikan";
+import JumlahPendudukMiskin from "./jumlah-penduduk-miskin";
 
 const Ekonomi = new Elysia({
   prefix: "/api/ekonomi",
@@ -18,5 +19,6 @@ const Ekonomi = new Elysia({
 .use(StrukturOrganisasi)
 .use(GrafikUsiaKerjaYangMenganggur)
 .use(GrafikMenganggurBerdasarkanPendidikan)
+.use(JumlahPendudukMiskin)
 
 export default Ekonomi

src/app/api/[[...slugs]]/_lib/ekonomi/jumlah-penduduk-miskin/create.ts

@@ -0,0 +1,33 @@
+import prisma from "@/lib/prisma";
+import { Prisma } from "@prisma/client";
+import { Context } from "elysia";
+
+type FormCreate = Prisma.GrafikJumlahPendudukMiskinGetPayload<{
+  select: {
+    year: true;
+    totalPoorPopulation: true;
+  };
+}>;
+export default async function grafikJumlahPendudukMiskinCreate(
+  context: Context
+) {
+  const body = context.body as FormCreate;
+
+  const created = await prisma.grafikJumlahPendudukMiskin.create({
+    data: {
+      year: body.year,
+      totalPoorPopulation: body.totalPoorPopulation,
+    },
+    select: {
+      id: true,
+      year: true,
+      totalPoorPopulation: true,
+    },
+  });
+
+  return {
+    success: true,
+    message: "Success create grafik jumlah penduduk miskin",
+    data: created,
+  };
+}

src/app/api/[[...slugs]]/_lib/ekonomi/jumlah-penduduk-miskin/del.ts

@@ -0,0 +1,43 @@
+import prisma from "@/lib/prisma"
+import { Context } from "elysia"
+
+export default async function grafikJumlahPendudukMiskinDelete(context: Context) {
+    const {id} = context.params as {id: string}
+
+    try {
+        const existingData = await prisma.grafikJumlahPendudukMiskin.findUnique({
+            where: {
+                id: id,
+            }
+        })
+
+        if (!existingData) {
+            return {
+                success: false,
+                message: "Data tidak ditemukan",
+                data: null,
+            }
+        }
+
+        await prisma.grafikJumlahPendudukMiskin.delete({
+            where: {
+                id: id
+            }
+        })
+
+        return {
+            success: true,
+            message: "Data berhasil dihapus",
+            data: {
+                id: id,
+                deleted: true,
+            },
+        }
+    } catch (error) {
+        return {
+            success: false,
+            message: error instanceof Error ? error.message : "Unknown error",
+            data: null,
+        }
+    }
+}

src/app/api/[[...slugs]]/_lib/ekonomi/jumlah-penduduk-miskin/findMany.ts

@@ -0,0 +1,8 @@
+import prisma from "@/lib/prisma";
+
+export default async function grafikJumlahPendudukMiskinFindMany() {
+    const res = await prisma.grafikJumlahPendudukMiskin.findMany();
+    return {
+        data: res,
+    };
+}

src/app/api/[[...slugs]]/_lib/ekonomi/jumlah-penduduk-miskin/findUnique.ts

@@ -0,0 +1,65 @@
+import prisma from "@/lib/prisma";
+
+export default async function grafikJumlahPendudukMiskinFindUnique(
+  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.grafikJumlahPendudukMiskin.findUnique({
+      where: { id },
+    });
+
+    if (!data) {
+      return Response.json(
+        {
+          success: false,
+          message: "Data tidak ditemukan",
+        },
+        { status: 404 }
+      );
+    }
+
+    return Response.json(
+      {
+        success: true,
+        message: "Berhasil mengambil data berdasarkan ID",
+        data,
+      },
+      { status: 200 }
+    );
+  } catch (e) {
+    console.error("Find by ID error:", e);
+    return Response.json(
+      {
+        success: false,
+        message:
+          "Gagal mengambil data: " +
+          (e instanceof Error ? e.message : "Unknown error"),
+      },
+      { status: 500 }
+    );
+  }
+}

src/app/api/[[...slugs]]/_lib/ekonomi/jumlah-penduduk-miskin/index.ts

@@ -0,0 +1,38 @@
+import Elysia, { t } from "elysia";
+import grafikJumlahPendudukMiskinFindMany from "./findMany";
+import grafikJumlahPendudukMiskinFindById from "./findUnique";
+import grafikJumlahPendudukMiskinUpdate from "./updt";
+import grafikJumlahPendudukMiskinCreate from "./create";
+import grafikJumlahPendudukMiskinDelete from "./del";
+
+const JumlahPendudukMiskin = new Elysia({
+    prefix: "/jumlahpendudukmiskin",
+    tags: ["Ekonomi/Jumlah Penduduk Miskin"],
+})
+    .get("/find-many", grafikJumlahPendudukMiskinFindMany)
+    .get("/:id", async (context) => {
+        const response = await grafikJumlahPendudukMiskinFindById(new Request(context.request))
+        return response
+    })
+    .put("/:id", grafikJumlahPendudukMiskinUpdate, {
+        params: t.Object({
+            id: t.String(),
+        }),
+        body: t.Object({
+            year: t.Number(),
+            totalPoorPopulation: t.Number(),
+        }),
+    })
+    .post("/create", grafikJumlahPendudukMiskinCreate, {
+        body: t.Object({
+            year: t.Number(),
+            totalPoorPopulation: t.Number(),
+        }),
+    })
+    .delete("/del/:id", grafikJumlahPendudukMiskinDelete, {
+        params: t.Object({
+            id: t.String(),
+        }),
+    });
+
+export default JumlahPendudukMiskin;

src/app/api/[[...slugs]]/_lib/ekonomi/jumlah-penduduk-miskin/updt.ts

@@ -0,0 +1,48 @@
+import { Context } from "elysia";
+import prisma from "@/lib/prisma";
+
+export default async function grafikJumlahPendudukMiskinUpdate(context: Context) {
+    const id = context.params?.id;
+
+    if (!id) {
+        return {
+            success: false,
+            message: "Id tidak ditemukan",
+        }
+    }
+
+    const existingData = await prisma.grafikJumlahPendudukMiskin.findUnique({
+        where: {
+            id: id,
+        }
+    })
+
+    const {year, totalPoorPopulation} = context.body as {
+        year: number;
+        totalPoorPopulation: number;
+    }
+
+    if (!existingData) {
+        return {
+            success: false,
+            message: "Data tidak ditemukan",
+            data: null,
+        }
+    }
+
+    const updated = await prisma.grafikJumlahPendudukMiskin.update({
+        where: {
+            id: id,
+        },
+        data: {
+            year: year,
+            totalPoorPopulation: totalPoorPopulation,
+        },
+    })
+
+    return {
+        success: true,
+        message: "Data berhasil diupdate",
+        data: updated,
+    }
+}