API & UI Menu Lingkungan, Submenu Edukas Lingkungan

prisma/data/lingkungan/edukasi-lingkungan/contoh-kegiatan-di-desa-darmasaba.json

@@ -0,0 +1,7 @@
+[
+    {
+      "id": "edit",
+      "judul": "Contoh Kegiatan di Desa Darmasaba",
+      "deskripsi": "<ul><li><p>Pelatihan membuat kompos dari sampah rumah tangga</p></li><li><p>Gerakan Jumat Bersih rutin</p></li><li><p>Workshop membuat ecobrick</p></li><li><p>Lomba kebersihan antar banjar</p></li><li><p>Sosialisasi lingkungan di sekolah dan posyandu</p></li></ul>"
+    }
+  ]

prisma/data/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan.json

@@ -0,0 +1,7 @@
+[
+  {
+    "id": "edit",
+    "judul": "Materi Edukasi yang Diberikan",
+    "deskripsi": "<ul><li><p>Pengelolaan Sampah (Pilah sampah organik dan anorganik)</p></li><li><p>Pencegahan pencemaran lingkungan (air, udara, dan tanah)</p></li><li><p>Pemanfaatan lahan hijau dan penghijauan desa</p></li><li><p>Daur ulang dan kreatifitas dari sampah</p></li><li><p>Bahaya pembakaran sampah sembarangan</p></li></ul>"
+  }
+]

prisma/data/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan.json

@@ -1,6 +1,7 @@
 [
   {
+    "id": "edit",
     "judul": "Tujuan Edukasi Lingkungan",
-    "deskripsi": "Meningkatkan kesadaran masyarakat tentang pentingnya lingkungan bersih dan sehat Mendorong partisipasi warga dalam kegiatan pengelolaan sampah, penghijauan, dan konservasi Mengurangi dampak negatif terhadap lingkungan dari kegiatan manusia Membentuk generasi muda yang peduli terhadap isu-isu lingkungan"
+    "deskripsi": "<ul><li><p>Meningkatkan kesadaran masyarakat tentang pentingnya lingkungan bersih dan sehat</p></li><li><p>Mendorong partisipasi warga dalam kegiatan pengelolaan sampah, penghijauan, dan konservasi</p></li><li><p>Mengurangi dampak negatif terhadap lingkungan dari kegiatan manusia</p></li><li><p>Membentuk generasi muda yang peduli terhadap isu-isu lingkungan</p></li></ul>"
   }
 ]

prisma/seed.ts

@@ -22,6 +22,10 @@ import hubunganOrganisasi from "./data/ekonomi/struktur-organisasi/hubungan-orga
 import posisiOrganisasi from "./data/ekonomi/struktur-organisasi/posisi-organisasi.json";
 import pegawai from "./data/ekonomi/struktur-organisasi/pegawai.json";
 import detailDataPengangguran from './data/ekonomi/jumlah-pengangguran/detail-data-pengangguran.json';
+import tujuanEdukasiLingkungan from './data/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan.json';
+import materiEdukasiLingkungan from './data/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan.json';
+import contohEdukasiLingkungan from './data/lingkungan/edukasi-lingkungan/contoh-kegiatan-di-desa-darmasaba.json';
+
 
 (async () => {
   for (const l of layanan) {
@@ -455,6 +459,64 @@ import detailDataPengangguran from './data/ekonomi/jumlah-pengangguran/detail-da
     });
   }
   console.log("📊 detailDataPengangguran success ...");
+
+  for (const e of tujuanEdukasiLingkungan) {
+    await prisma.tujuanEdukasiLingkungan.upsert({
+      where: {
+        id: e.id,
+      },
+      update: {
+        judul: e.judul,
+        deskripsi: e.deskripsi,
+      },
+      create: {
+        id: e.id,
+        judul: e.judul,
+        deskripsi: e.deskripsi,
+      },
+    });
+  }
+
+  console.log("tujuan edukasi lingkungan success ...");
+
+  for (const m of materiEdukasiLingkungan) {
+    await prisma.materiEdukasiLingkungan.upsert({
+      where: {
+        id: m.id,
+      },
+      update: {
+        judul: m.judul,
+        deskripsi: m.deskripsi,
+      },
+      create: {
+        id: m.id,
+        judul: m.judul,
+        deskripsi: m.deskripsi,
+      },
+    });
+  }
+
+  console.log("materi edukasi lingkungan success ...");
+
+  for (const c of contohEdukasiLingkungan) {
+    await prisma.contohEdukasiLingkungan.upsert({
+      where: {
+        id: c.id,
+      },
+      update: {
+        judul: c.judul,
+        deskripsi: c.deskripsi,
+      },
+      create: {
+        id: c.id,
+        judul: c.judul,
+        deskripsi: c.deskripsi,
+      },
+    });
+  }
+
+  console.log("contoh edukasi lingkungan success ...");
+
 })()
   .then(() => prisma.$disconnect())
   .catch((e) => {

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

@@ -0,0 +1,240 @@
+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 templateTujuanEdukasiForm = z.object({
+  judul: z.string().min(3, "Judul minimal 3 karakter"),
+  deskripsi: z.string().min(3, "Deskripsi minimal 3 karakter"),
+});
+
+type TujuanEdukasiForm = Prisma.TujuanEdukasiLingkunganGetPayload<{
+  select: {
+    id: true;
+    judul: true;
+    deskripsi: true;
+  };
+}>;
+
+const stateTujuanEdukasi = proxy({
+  findById: {
+    data: null as TujuanEdukasiForm | null,
+    loading: false,
+    initialize() {
+      stateTujuanEdukasi.findById.data = {
+        id: '',
+        judul: '',
+        deskripsi: '',
+      } as TujuanEdukasiForm;
+    },
+    async load(id: string) {
+      try {
+        stateTujuanEdukasi.findById.loading = true;
+        const res = await ApiFetch.api.lingkungan.edukasilingkungan.tujuanedukasilingkungan["find-by-id"].get({
+          query: { id },
+        });
+        if (res.status === 200) {
+          stateTujuanEdukasi.findById.data = res.data?.data ?? null;
+        } else {
+          toast.error("Gagal mengambil data tujuan edukasi");
+        }
+      } catch (error) {
+        console.error((error as Error).message);
+        toast.error("Terjadi kesalahan saat mengambil data tujuan edukasi");
+      } finally {
+        stateTujuanEdukasi.findById.loading = false;
+      }
+    },
+  },
+
+  update: {
+    loading: false,
+    async save(data: TujuanEdukasiForm) {
+      const cek = templateTujuanEdukasiForm.safeParse(data);
+      if (!cek.success) {
+        const errors = cek.error.issues
+          .map((issue) => `${issue.path.join(".")}: ${issue.message}`)
+          .join(", ");
+        toast.error(`Form tidak valid: ${errors}`);
+        return;
+      }
+
+      try {
+        stateTujuanEdukasi.update.loading = true;
+        const res = await ApiFetch.api.lingkungan.edukasilingkungan.tujuanedukasilingkungan["update"].post(data);
+        if (res.status === 200) {
+          toast.success("Data tujuan edukasi berhasil diubah");
+          await stateTujuanEdukasi.findById.load(data.id);
+        } else {
+          toast.error("Gagal mengubah data tujuan edukasi");
+        }
+      } catch (error) {
+        console.error((error as Error).message);
+        toast.error("Terjadi kesalahan saat mengubah data tujuan edukasi");
+      } finally {
+        stateTujuanEdukasi.update.loading = false;
+      }
+    },
+  },
+});
+
+const templateMateriEdukasiLingkunganForm = z.object({
+    judul: z.string().min(3, "Judul minimal 3 karakter"),
+    deskripsi: z.string().min(3, "Deskripsi minimal 3 karakter"),
+  });
+  
+  type MateriEdukasiLingkunganForm = Prisma.MateriEdukasiLingkunganGetPayload<{
+    select: {
+      id: true;
+      judul: true;
+      deskripsi: true;
+    };
+  }>;
+  
+  const stateMateriEdukasiLingkungan = proxy({
+    findById: {
+      data: null as MateriEdukasiLingkunganForm | null,
+      loading: false,
+      initialize() {
+        stateMateriEdukasiLingkungan.findById.data = {
+          id: '',
+          judul: '',
+          deskripsi: '',
+        } as MateriEdukasiLingkunganForm;
+      },
+      async load(id: string) {
+        try {
+          stateMateriEdukasiLingkungan.findById.loading = true;
+          const res = await ApiFetch.api.lingkungan.edukasilingkungan.materiedukasilingkungan["find-by-id"].get({
+            query: { id },
+          });
+          if (res.status === 200) {
+            stateMateriEdukasiLingkungan.findById.data = res.data?.data ?? null;
+          } else {
+            toast.error("Gagal mengambil data materi edukasi");
+          }
+        } catch (error) {
+          console.error((error as Error).message);
+          toast.error("Terjadi kesalahan saat mengambil data materi edukasi");
+        } finally {
+          stateMateriEdukasiLingkungan.findById.loading = false;
+        }
+      },
+    },
+  
+    update: {
+      loading: false,
+      async save(data: MateriEdukasiLingkunganForm) {
+        const cek = templateMateriEdukasiLingkunganForm.safeParse(data);
+        if (!cek.success) {
+          const errors = cek.error.issues
+            .map((issue) => `${issue.path.join(".")}: ${issue.message}`)
+            .join(", ");
+          toast.error(`Form tidak valid: ${errors}`);
+          return;
+        }
+  
+        try {
+          stateMateriEdukasiLingkungan.update.loading = true;
+          const res = await ApiFetch.api.lingkungan.edukasilingkungan.materiedukasilingkungan["update"].post(data);
+          if (res.status === 200) {
+            toast.success("Data materi edukasi berhasil diubah");
+            await stateMateriEdukasiLingkungan.findById.load(data.id);
+          } else {
+            toast.error("Gagal mengubah data materi edukasi");
+          }
+        } catch (error) {
+          console.error((error as Error).message);
+          toast.error("Terjadi kesalahan saat mengubah data materi edukasi");
+        } finally {
+          stateMateriEdukasiLingkungan.update.loading = false;
+        }
+      },
+    },
+  });
+
+  const templateContohEdukasiLingkunganForm = z.object({
+    judul: z.string().min(3, "Judul minimal 3 karakter"),
+    deskripsi: z.string().min(3, "Deskripsi minimal 3 karakter"),
+  });
+  
+  type ContohEdukasiLingkunganForm = Prisma.ContohEdukasiLingkunganGetPayload<{
+    select: {
+      id: true;
+      judul: true;
+      deskripsi: true;
+    };
+  }>;
+  
+  const stateContohEdukasiLingkungan = proxy({
+    findById: {
+      data: null as ContohEdukasiLingkunganForm | null,
+      loading: false,
+      initialize() {
+        stateContohEdukasiLingkungan.findById.data = {
+          id: '',
+          judul: '',
+          deskripsi: '',
+        } as ContohEdukasiLingkunganForm;
+      },
+      async load(id: string) {
+        try {
+          stateContohEdukasiLingkungan.findById.loading = true;
+          const res = await ApiFetch.api.lingkungan.edukasilingkungan.contohkegiatandesa["find-by-id"].get({
+            query: { id },
+          });
+          if (res.status === 200) {
+            stateContohEdukasiLingkungan.findById.data = res.data?.data ?? null;
+          } else {
+            toast.error("Gagal mengambil data contoh edukasi");
+          }
+        } catch (error) {
+          console.error((error as Error).message);
+          toast.error("Terjadi kesalahan saat mengambil data contoh edukasi");
+        } finally {
+          stateContohEdukasiLingkungan.findById.loading = false;
+        }
+      },
+    },
+  
+    update: {
+      loading: false,
+      async save(data: ContohEdukasiLingkunganForm) {
+        const cek = templateContohEdukasiLingkunganForm.safeParse(data);
+        if (!cek.success) {
+          const errors = cek.error.issues
+            .map((issue) => `${issue.path.join(".")}: ${issue.message}`)
+            .join(", ");
+          toast.error(`Form tidak valid: ${errors}`);
+          return;
+        }
+  
+        try {
+          stateContohEdukasiLingkungan.update.loading = true;
+          const res = await ApiFetch.api.lingkungan.edukasilingkungan.contohkegiatandesa["update"].post(data);
+          if (res.status === 200) {
+            toast.success("Data contoh edukasi berhasil diubah");
+            await stateContohEdukasiLingkungan.findById.load(data.id);
+          } else {
+            toast.error("Gagal mengubah data contoh edukasi");
+          }
+        } catch (error) {
+          console.error((error as Error).message);
+          toast.error("Terjadi kesalahan saat mengubah data contoh edukasi");
+        } finally {
+          stateContohEdukasiLingkungan.update.loading = false;
+        }
+      },
+    },
+  });
+
+
+const stateEdukasiLingkungan = proxy({
+    stateTujuanEdukasi,
+    stateMateriEdukasiLingkungan,
+    stateContohEdukasiLingkungan
+})
+  
+
+export default stateEdukasiLingkungan;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/_lib/edukasiLingkunganTextEditor.tsx

@@ -0,0 +1,100 @@
+'use client'
+import { Button, Stack } from '@mantine/core';
+import { Link, RichTextEditor } from '@mantine/tiptap';
+import Highlight from '@tiptap/extension-highlight';
+import SubScript from '@tiptap/extension-subscript';
+import Superscript from '@tiptap/extension-superscript';
+import TextAlign from '@tiptap/extension-text-align';
+import Underline from '@tiptap/extension-underline';
+import { useEditor } from '@tiptap/react';
+import StarterKit from '@tiptap/starter-kit';
+import { useEffect } from 'react';
+
+
+export function EdukasiLingkunganTextEditor({ onSubmit, onChange, showSubmit = true, initialContent = '', }: { 
+  onSubmit?: (val: string) => void, 
+  onChange: (val: string) => void, 
+  showSubmit?: boolean,
+  initialContent?: string }) {
+  const editor = useEditor({
+    extensions: [
+      StarterKit,
+      Underline,
+      Link,
+      Superscript,
+      SubScript,
+      Highlight,
+      TextAlign.configure({ types: ['heading', 'paragraph'] }),
+    ],
+    immediatelyRender: false,
+    content: initialContent,
+    onUpdate : ({editor}) => {
+      onChange(editor.getHTML())
+    }
+  });
+
+  useEffect(() => {
+    if (editor && initialContent !== editor.getHTML()) {
+      editor.commands.setContent(initialContent || '<p></p>');
+    }
+  }, [initialContent, editor]);
+
+  return (
+    <Stack >
+      <RichTextEditor editor={editor}>
+        <RichTextEditor.Toolbar sticky stickyOffset={60}>
+          <RichTextEditor.ControlsGroup>
+            <RichTextEditor.Bold />
+            <RichTextEditor.Italic />
+            <RichTextEditor.Underline />
+            <RichTextEditor.Strikethrough />
+            <RichTextEditor.ClearFormatting />
+            <RichTextEditor.Highlight />
+            <RichTextEditor.Code />
+          </RichTextEditor.ControlsGroup>
+
+          <RichTextEditor.ControlsGroup>
+            <RichTextEditor.H1 />
+            <RichTextEditor.H2 />
+            <RichTextEditor.H3 />
+            <RichTextEditor.H4 />
+          </RichTextEditor.ControlsGroup>
+
+          <RichTextEditor.ControlsGroup>
+            <RichTextEditor.Blockquote />
+            <RichTextEditor.Hr />
+            <RichTextEditor.BulletList />
+            <RichTextEditor.OrderedList />
+            <RichTextEditor.Subscript />
+            <RichTextEditor.Superscript />
+          </RichTextEditor.ControlsGroup>
+
+          <RichTextEditor.ControlsGroup>
+            <RichTextEditor.Link />
+            <RichTextEditor.Unlink />
+          </RichTextEditor.ControlsGroup>
+
+          <RichTextEditor.ControlsGroup>
+            <RichTextEditor.AlignLeft />
+            <RichTextEditor.AlignCenter />
+            <RichTextEditor.AlignJustify />
+            <RichTextEditor.AlignRight />
+          </RichTextEditor.ControlsGroup>
+
+          <RichTextEditor.ControlsGroup>
+            <RichTextEditor.Undo />
+            <RichTextEditor.Redo />
+          </RichTextEditor.ControlsGroup>
+        </RichTextEditor.Toolbar>
+
+        <RichTextEditor.Content />
+      </RichTextEditor>
+      {showSubmit && (
+        <Button onClick={() => {
+          if (!editor) return
+          onSubmit?.(editor?.getHTML())
+        }}>Submit</Button>
+      )}
+    </Stack>
+  );
+}

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/_lib/layouTabs.tsx

@@ -0,0 +1,67 @@
+/* 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: "Tujuan Edukasi Lingkungan",
+            value: "tujuanedukasilingkungan",
+            href: "/admin/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan"
+        },
+        {
+            label: "Materi Edukasi Yang Diberikan",
+            value: "materiedukasiyangdiberikan",
+            href: "/admin/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan"
+        },
+        {
+            label: "Contoh Kegiatan Di Desa Darmasaba",
+            value: "contohkegiatan",
+            href: "/admin/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa-darmasaba"
+        },
+    ];
+    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}>Jumlah Penduduk Usia Kerja yang Menganggur</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)/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa-darmasaba/edit/page.tsx

@@ -0,0 +1,87 @@
+'use client'
+import stateEdukasiLingkungan from '@/app/admin/(dashboard)/_state/lingkungan/edukasi-lingkungan';
+import colors from '@/con/colors';
+import { Box, Button, Group, Paper, Stack, Text, Title } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconArrowBack } from '@tabler/icons-react';
+import dynamic from 'next/dynamic';
+import { useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { useProxy } from 'valtio/utils';
+
+const EdukasiLingkunganTextEditor = dynamic(() => import('../../_lib/edukasiLingkunganTextEditor').then(mod => mod.EdukasiLingkunganTextEditor), {
+  ssr: false,
+});
+
+function EditContohKegiatanDesaDarmasaba() {
+  const router = useRouter()
+  const contohEdukasiState = useProxy(stateEdukasiLingkungan.stateContohEdukasiLingkungan)
+  const [judul, setJudul] = useState('');
+  const [content, setContent] = useState('');
+
+  useShallowEffect(() => {
+    if (!contohEdukasiState.findById.data) {
+      contohEdukasiState.findById.initialize(); // biar masuk ke `findFirst` route kamu
+    }
+  }, []);
+
+  useEffect(() => {
+    if (contohEdukasiState.findById.data) {
+      setJudul(contohEdukasiState.findById.data.judul ?? '')
+      setContent(contohEdukasiState.findById.data.deskripsi ?? '')
+    }
+  }, [contohEdukasiState.findById.data])
+
+  const submit = () => {
+    if (contohEdukasiState.findById.data) {
+      contohEdukasiState.findById.data.judul = judul;
+      contohEdukasiState.findById.data.deskripsi = content;
+      contohEdukasiState.update.save(contohEdukasiState.findById.data)
+    }
+    router.push('/admin/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa-darmasaba')
+  }
+  return (
+    <Box>
+      <Stack gap={'xs'}>
+        <Box>
+          <Button
+            variant={'subtle'}
+            onClick={() => router.back()}
+          >
+            <IconArrowBack color={colors['blue-button']} size={20} />
+          </Button>
+        </Box>
+        <Box>
+          <Paper bg={colors['white-1']} p={'md'} radius={10} w={{ base: '100%', md: '50%' }}>
+            <Stack gap={'xs'}>
+              <Title order={3}>Edit Contoh Kegiatan Di Desa Darmasaba</Title>
+              <Text fw={"bold"}>Judul</Text>
+              <EdukasiLingkunganTextEditor
+                showSubmit={false}
+                onChange={setJudul}
+                initialContent={judul}
+              />
+              <Text fw={"bold"}>Deskripsi</Text>
+              <EdukasiLingkunganTextEditor
+                showSubmit={false}
+                onChange={setContent}
+                initialContent={content}
+              />
+              <Group>
+                <Button
+                  bg={colors['blue-button']}
+                  onClick={submit}
+                  loading={contohEdukasiState.update.loading}
+                >
+                  Submit
+                </Button>
+              </Group>
+            </Stack>
+          </Paper>
+        </Box>
+      </Stack>
+    </Box>
+  );
+}
+
+export default EditContohKegiatanDesaDarmasaba;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa-darmasaba/page.tsx

@@ -0,0 +1,54 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconEdit } from '@tabler/icons-react';
+import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import stateEdukasiLingkungan from '../../../_state/lingkungan/edukasi-lingkungan';
+
+function Page() {
+  const router = useRouter()
+  const listContohEdukasi = useProxy(stateEdukasiLingkungan.stateContohEdukasiLingkungan)
+  useShallowEffect(() => {
+    listContohEdukasi.findById.load('edit')
+  }, [])
+
+  if (!listContohEdukasi.findById.data) {
+    return (
+      <Stack>
+        <Skeleton radius={10} h={800} />
+      </Stack>
+    )
+  }
+  return (
+    <Paper bg={colors['white-1']} p={'md'} radius={10}>
+      <Stack gap={"22"}>
+        <Grid>
+          <GridCol span={{ base: 12, md: 11 }}>
+            <Title order={2}>Preview Contoh Kegiatan Di Desa Darmasaba</Title>
+          </GridCol>
+          <GridCol span={{ base: 12, md: 1 }}>
+            <Button bg={colors['blue-button']} onClick={() => router.push('/admin/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa-darmasaba/edit')}>
+              <IconEdit size={16} />
+            </Button>
+          </GridCol>
+        </Grid>
+        <Box>
+          <Stack gap={'lg'}>
+            <Paper p={"xl"} bg={colors['BG-trans']}>
+              <Box px={{ base: 0, md: 30 }}>
+                <Text fz={{ base: "h3", md: "h2" }} fw={"bold"} dangerouslySetInnerHTML={{ __html: listContohEdukasi.findById.data.judul }} />
+              </Box>
+              <Box px={{ base: 0, md: 30 }}>
+                <Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: listContohEdukasi.findById.data.deskripsi }} />
+              </Box>
+            </Paper>
+          </Stack>
+        </Box>
+      </Stack>
+    </Paper>
+  )
+}
+
+export default Page;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/create/page.tsx

@@ -1,61 +0,0 @@
-'use client'
-import React from 'react';
-import colors from '@/con/colors';
-import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-
-function CreateEdukasiLingkungan() {
-  const router = useRouter()
-  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']} p="md" w={{ base: '100%', md: '50%' }}>
-        <Stack gap="xs">
-          <Title order={3}>Create Edukasi Lingkungan</Title>
-          <TextInput
-            label={<Text fz="sm" fw="bold">Judul Edukasi Lingkungan</Text>}
-            placeholder="masukkan judul edukasi lingkungan"
-          />
-          <TextInput
-            label={<Text fz="sm" fw="bold">Deskripsi Edukasi Lingkungan</Text>}
-            placeholder="masukkan deskripsi edukasi lingkungan"
-          />
-          {/* <FileInput
-          label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
-          value={file}
-          onChange={async (e) => {
-            if (!e) return;
-            setFile(e);
-            const base64 = await e.arrayBuffer().then((buf) =>
-              'data:image/png;base64,' + Buffer.from(buf).toString('base64')
-            );
-            setPreviewImage(base64);
-          }}
-          /> */}
-          {/* {previewImage ? (
-            <Image alt="" src={previewImage} w={200} h={200} />
-          ) : (
-            <Center w={200} h={200} bg="gray">
-              <IconImageInPicture />
-            </Center>
-          )} */}
-          <Box>
-            <Text fz="sm" fw="bold">Gambar</Text>
-            <IconImageInPicture size={25} />
-          </Box>
-          <Button bg={colors['blue-button']} >
-            Simpan
-          </Button>
-        </Stack>
-      </Paper>
-    </Box>
-  );
-}
-
-export default CreateEdukasiLingkungan;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/detail/page.tsx

@@ -1,62 +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 DetailEdukasiLingkungan() {
-  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 Edukasi Lingkungan</Text>
-
-          <Paper bg={colors['BG-trans']} p={'md'}>
-            <Stack gap={"xs"}>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Judul Edukasi Lingkungan</Text>
-                <Text fz={"lg"}>Test Judul</Text>
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Gambar</Text>
-                <Image src={"/"} alt="gambar" />
-              </Box>
-              <Box>
-                <Text fz={"lg"} fw={"bold"}>Deskripsi Edukasi Lingkungan</Text>
-                <Text fz={"lg"} >Test Deskripsi</Text>
-              </Box>
-              <Box>
-                <Flex gap={"xs"}>
-                  <Button color="red">
-                    <IconX size={20} />
-                  </Button>
-                  <Button onClick={() => router.push('/admin/lingkungan/edukasi-lingkungan/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 DetailEdukasiLingkungan;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/edit/page.tsx

@@ -1,61 +0,0 @@
-'use client'
-import React from 'react';
-import colors from '@/con/colors';
-import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
-import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
-import { useRouter } from 'next/navigation';
-
-function EditEdukasiLingkungan() {
-  const router = useRouter()
-  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']} p="md" w={{ base: '100%', md: '50%' }}>
-        <Stack gap="xs">
-          <Title order={3}>Edit Edukasi Lingkungan</Title>
-          <TextInput
-            label={<Text fz="sm" fw="bold">Judul Edukasi Lingkungan</Text>}
-            placeholder="masukkan judul edukasi lingkungan"
-          />
-          <TextInput
-            label={<Text fz="sm" fw="bold">Deskripsi Edukasi Lingkungan</Text>}
-            placeholder="masukkan deskripsi edukasi lingkungan"
-          />
-          {/* <FileInput
-          label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
-          value={file}
-          onChange={async (e) => {
-            if (!e) return;
-            setFile(e);
-            const base64 = await e.arrayBuffer().then((buf) =>
-              'data:image/png;base64,' + Buffer.from(buf).toString('base64')
-            );
-            setPreviewImage(base64);
-          }}
-          /> */}
-          {/* {previewImage ? (
-            <Image alt="" src={previewImage} w={200} h={200} />
-          ) : (
-            <Center w={200} h={200} bg="gray">
-              <IconImageInPicture />
-            </Center>
-          )} */}
-          <Box>
-            <Text fz="sm" fw="bold">Gambar</Text>
-            <IconImageInPicture size={25} />
-          </Box>
-          <Button bg={colors['blue-button']} >
-            Simpan
-          </Button>
-        </Stack>
-      </Paper>
-    </Box>
-  );
-}
-
-export default EditEdukasiLingkungan;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/layout.tsx

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

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan/edit/page.tsx

@@ -0,0 +1,87 @@
+'use client'
+import stateEdukasiLingkungan from '@/app/admin/(dashboard)/_state/lingkungan/edukasi-lingkungan';
+import colors from '@/con/colors';
+import { Box, Button, Group, Paper, Stack, Text, Title } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconArrowBack } from '@tabler/icons-react';
+import dynamic from 'next/dynamic';
+import { useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { useProxy } from 'valtio/utils';
+
+const EdukasiLingkunganTextEditor = dynamic(() => import('../../_lib/edukasiLingkunganTextEditor').then(mod => mod.EdukasiLingkunganTextEditor), {
+  ssr: false,
+});
+
+function EditMateriEdukasiYangDiberikan() {
+  const router = useRouter()
+  const materiEdukasiState = useProxy(stateEdukasiLingkungan.stateMateriEdukasiLingkungan)
+  const [judul, setJudul] = useState('');
+  const [content, setContent] = useState('');
+
+  useShallowEffect(() => {
+    if (!materiEdukasiState.findById.data) {
+      materiEdukasiState.findById.initialize(); // biar masuk ke `findFirst` route kamu
+    }
+  }, []);
+
+  useEffect(() => {
+    if (materiEdukasiState.findById.data) {
+      setJudul(materiEdukasiState.findById.data.judul ?? '')
+      setContent(materiEdukasiState.findById.data.deskripsi ?? '')
+    }
+  }, [materiEdukasiState.findById.data])
+
+  const submit = () => {
+    if (materiEdukasiState.findById.data) {
+      materiEdukasiState.findById.data.judul = judul;
+      materiEdukasiState.findById.data.deskripsi = content;
+      materiEdukasiState.update.save(materiEdukasiState.findById.data)
+    }
+    router.push('/admin/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan')
+  }
+  return (
+    <Box>
+      <Stack gap={'xs'}>
+        <Box>
+          <Button
+            variant={'subtle'}
+            onClick={() => router.back()}
+          >
+            <IconArrowBack color={colors['blue-button']} size={20} />
+          </Button>
+        </Box>
+        <Box>
+          <Paper bg={colors['white-1']} p={'md'} radius={10} w={{ base: '100%', md: '50%' }}>
+            <Stack gap={'xs'}>
+              <Title order={3}>Edit Materi Edukasi Yang Diberikan</Title>
+              <Text fw={"bold"}>Judul</Text>
+              <EdukasiLingkunganTextEditor
+                showSubmit={false}
+                onChange={setJudul}
+                initialContent={judul}
+              />
+              <Text fw={"bold"}>Content</Text>
+              <EdukasiLingkunganTextEditor
+                showSubmit={false}
+                onChange={setContent}
+                initialContent={content}
+              />
+              <Group>
+                <Button
+                  bg={colors['blue-button']}
+                  onClick={submit}
+                  loading={materiEdukasiState.update.loading}
+                >
+                  Submit
+                </Button>
+              </Group>
+            </Stack>
+          </Paper>
+        </Box>
+      </Stack>
+    </Box>
+  );
+}
+
+export default EditMateriEdukasiYangDiberikan;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan/page.tsx

@@ -0,0 +1,54 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconEdit } from '@tabler/icons-react';
+import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import stateEdukasiLingkungan from '../../../_state/lingkungan/edukasi-lingkungan';
+
+function Page() {
+  const router = useRouter()
+  const listMateriEdukasi = useProxy(stateEdukasiLingkungan.stateMateriEdukasiLingkungan)
+  useShallowEffect(() => {
+    listMateriEdukasi.findById.load('edit')
+  }, [])
+
+  if (!listMateriEdukasi.findById.data) {
+    return (
+      <Stack>
+        <Skeleton radius={10} h={800} />
+      </Stack>
+    )
+  }
+  return (
+    <Paper bg={colors['white-1']} p={'md'} radius={10}>
+      <Stack gap={"22"}>
+        <Grid>
+          <GridCol span={{ base: 12, md: 11 }}>
+            <Title order={2}>Preview Materi Edukasi Yang Diberikan</Title>
+          </GridCol>
+          <GridCol span={{ base: 12, md: 1 }}>
+            <Button bg={colors['blue-button']} onClick={() => router.push('/admin/lingkungan/edukasi-lingkungan/materi-edukasi-yang-diberikan/edit')}>
+              <IconEdit size={16} />
+            </Button>
+          </GridCol>
+        </Grid>
+        <Box>
+          <Stack gap={'lg'}>
+            <Paper p={"xl"} bg={colors['BG-trans']}>
+              <Box px={{ base: 0, md: 30 }}>
+                <Text fz={{ base: "h3", md: "h2" }} fw={"bold"} dangerouslySetInnerHTML={{ __html: listMateriEdukasi.findById.data.judul }} />
+              </Box>
+              <Box px={{ base: 0, md: 30 }}>
+                <Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: listMateriEdukasi.findById.data.deskripsi }} />
+              </Box>
+            </Paper>
+          </Stack>
+        </Box>
+      </Stack>
+    </Paper>
+  )
+}
+
+export default Page;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/page.tsx

@@ -1,69 +0,0 @@
-'use client'
-import { Box, Button, Image, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
-import React from 'react';
-import HeaderSearch from '../../_com/header';
-import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
-import colors from '@/con/colors';
-import JudulList from '../../_com/judulList';
-import { useRouter } from 'next/navigation';
-
-function Page() { 
-  return (
-    <Box py={10}>
-      <HeaderSearch
-      title='Edukasi Lingkungan'
-      placeholder='pencarian'
-      searchIcon={<IconSearch size={20} />}
-      />
-      <ListEdukasiLingkungan/>
-    </Box>
-  );
-}
-
-function ListEdukasiLingkungan() {
-  const router = useRouter();
-  return (
-    <Box py={10}>
-      <Paper bg={colors['white-1']} p={'md'}>
-        <Stack>
-          <JudulList
-          title='List Edukasi Lingkungan'
-          href='/admin/lingkungan/edukasi-lingkungan/create'
-          />
-          <Box style={{overflowX: 'auto'}}>
-            <Table striped withRowBorders withTableBorder style={{minWidth: '700px'}}>
-              <TableThead>
-                <TableTr>
-                  <TableTh>Judul Edukasi Lingkungan</TableTh>
-                  <TableTh>Gambar</TableTh>
-                  <TableTh>Deskripsi Edukasi Lingkungan</TableTh>
-                  <TableTh>Detail</TableTh>
-                </TableTr>
-              </TableThead>
-              <TableTbody>
-                <TableTr>
-                  <TableTd>
-                    <Box w={100}>
-                      <Text truncate="end" fz={"sm"}>Judul</Text>
-                    </Box>
-                  </TableTd>
-                  <TableTd>
-                    <Image w={100} src="/" alt="image" />
-                  </TableTd>
-                  <TableTd>Deskripsi Edukasi Lingkungan</TableTd>
-                  <TableTd>
-                    <Button onClick={() => router.push('/admin/lingkungan/edukasi-lingkungan/detail')}>
-                      <IconDeviceImacCog size={25} />
-                    </Button>
-                  </TableTd>
-                </TableTr>
-              </TableTbody>
-            </Table>
-          </Box>
-        </Stack>
-      </Paper>
-    </Box>
-  )
-}
-
-export default Page;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan/edit/page.tsx

@@ -0,0 +1,87 @@
+'use client'
+import stateEdukasiLingkungan from '@/app/admin/(dashboard)/_state/lingkungan/edukasi-lingkungan';
+import colors from '@/con/colors';
+import { Box, Button, Group, Paper, Stack, Text, Title } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconArrowBack } from '@tabler/icons-react';
+import dynamic from 'next/dynamic';
+import { useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { useProxy } from 'valtio/utils';
+
+const EdukasiLingkunganTextEditor = dynamic(() => import('../../_lib/edukasiLingkunganTextEditor').then(mod => mod.EdukasiLingkunganTextEditor), {
+  ssr: false,
+});
+
+function EditTujuanEdukasiLingkungan() {
+  const router = useRouter()
+  const tujuanEdukasiState = useProxy(stateEdukasiLingkungan.stateTujuanEdukasi)
+  const [judul, setJudul] = useState('');
+  const [content, setContent] = useState('');
+
+  useShallowEffect(() => {
+    if (!tujuanEdukasiState.findById.data) {
+      tujuanEdukasiState.findById.initialize(); // biar masuk ke `findFirst` route kamu
+    }
+  }, []);
+
+  useEffect(() => {
+    if (tujuanEdukasiState.findById.data) {
+      setJudul(tujuanEdukasiState.findById.data.judul ?? '')
+      setContent(tujuanEdukasiState.findById.data.deskripsi ?? '')
+    }
+  }, [tujuanEdukasiState.findById.data])
+
+  const submit = () => {
+    if (tujuanEdukasiState.findById.data) {
+      tujuanEdukasiState.findById.data.judul = judul;
+      tujuanEdukasiState.findById.data.deskripsi = content;
+      tujuanEdukasiState.update.save(tujuanEdukasiState.findById.data)
+    }
+    router.push('/admin/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan')
+  }
+  return (
+    <Box>
+      <Stack gap={'xs'}>
+        <Box>
+          <Button
+            variant={'subtle'}
+            onClick={() => router.back()}
+          >
+            <IconArrowBack color={colors['blue-button']} size={20} />
+          </Button>
+        </Box>
+        <Box>
+          <Paper bg={colors['white-1']} p={'md'} radius={10} w={{ base: '100%', md: '50%' }}>
+            <Stack gap={'xs'}>
+              <Title order={3}>Edit Tujuan Edukasi Lingkungan</Title>
+              <Text fw={"bold"}>Judul</Text>
+              <EdukasiLingkunganTextEditor
+                showSubmit={false}
+                onChange={setJudul}
+                initialContent={judul}
+              />
+              <Text fw={"bold"}>Content</Text>
+              <EdukasiLingkunganTextEditor
+                showSubmit={false}
+                onChange={setContent}
+                initialContent={content}
+              />
+              <Group>
+                <Button
+                  bg={colors['blue-button']}
+                  onClick={submit}
+                  loading={tujuanEdukasiState.update.loading}
+                >
+                  Submit
+                </Button>
+              </Group>
+            </Stack>
+          </Paper>
+        </Box>
+      </Stack>
+    </Box>
+  );
+}
+
+export default EditTujuanEdukasiLingkungan;

src/app/admin/(dashboard)/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan/page.tsx

@@ -0,0 +1,54 @@
+'use client'
+import colors from '@/con/colors';
+import { Box, Button, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
+import { useShallowEffect } from '@mantine/hooks';
+import { IconEdit } from '@tabler/icons-react';
+import { useRouter } from 'next/navigation';
+import { useProxy } from 'valtio/utils';
+import stateEdukasiLingkungan from '../../../_state/lingkungan/edukasi-lingkungan';
+
+function Page() {
+  const router = useRouter()
+  const listTujuanEdukasi = useProxy(stateEdukasiLingkungan.stateTujuanEdukasi)
+  useShallowEffect(() => {
+    listTujuanEdukasi.findById.load('edit')
+  }, [])
+
+  if (!listTujuanEdukasi.findById.data) {
+    return (
+      <Stack>
+        <Skeleton radius={10} h={800} />
+      </Stack>
+    )
+  }
+  return (
+    <Paper bg={colors['white-1']} p={'md'} radius={10}>
+      <Stack gap={"22"}>
+        <Grid>
+          <GridCol span={{ base: 12, md: 11 }}>
+            <Title order={2}>Preview Tujuan Edukasi Lingkungan</Title>
+          </GridCol>
+          <GridCol span={{ base: 12, md: 1 }}>
+            <Button bg={colors['blue-button']} onClick={() => router.push('/admin/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan/edit')}>
+              <IconEdit size={16} />
+            </Button>
+          </GridCol>
+        </Grid>
+        <Box>
+          <Stack gap={'lg'}>
+            <Paper p={"xl"} bg={colors['BG-trans']}>
+              <Box px={{ base: 0, md: 30 }}>
+                <Text fz={{ base: "h3", md: "h2" }} fw={"bold"} dangerouslySetInnerHTML={{ __html: listTujuanEdukasi.findById.data.judul }} />
+              </Box>
+              <Box px={{ base: 0, md: 30 }}>
+                <Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: listTujuanEdukasi.findById.data.deskripsi }} />
+              </Box>
+            </Paper>
+          </Stack>
+        </Box>
+      </Stack>
+    </Paper>
+  )
+}
+
+export default Page;

src/app/admin/_com/list_PageAdmin.tsx

@@ -328,7 +328,7 @@ export const navBar = [
       {
         id: "Lingkungan_5",
         name: "Edukasi Lingkungan",
-        path: "/admin/lingkungan/edukasi-lingkungan"
+        path: "/admin/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan"
       },
       {
         id: "Lingkungan_6",

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa/findUnique.ts

@@ -0,0 +1,33 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+export default async function contohKegiatanDesaFindUnique(context: Context) {
+    try {
+        const id = context?.params?.slugs?.[0];
+
+        // If no ID provided, get the first profile
+        if (!id) {
+            const data = await prisma.contohEdukasiLingkungan.findFirst();
+            return {
+                success: true,
+                data,
+            };
+        }
+
+        const data = await prisma.contohEdukasiLingkungan.findUniqueOrThrow({
+            where: { id },
+        });
+
+        return {
+            success: true,
+            data,
+        };
+    } catch (error) {
+        console.error("Error fetching contoh edukasi lingkungan:", error);
+
+        return {
+            success: false,
+            message: error instanceof Error ? error.message : "Unknown error",
+        };
+    }
+}

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa/index.ts

@@ -0,0 +1,18 @@
+import Elysia, { t } from "elysia";
+import contohKegiatanDesaFindUnique from "./findUnique";
+import contohKegiatanDesaUpdate from "./updt";
+
+const ContohKegiatanDesa = new Elysia({
+    prefix: "/contohkegiatandesa",
+    tags: ["Lingkungan/Edukasi Lingkungan/Contoh Kegiatan Desa"]
+})
+    .get("/find-by-id", contohKegiatanDesaFindUnique)
+    .post("/update", contohKegiatanDesaUpdate, {
+        body: t.Object({
+            id: t.String(),
+            judul: t.String(),
+            deskripsi: t.String(),
+        })
+    })
+
+export default ContohKegiatanDesa

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/contoh-kegiatan-desa/updt.ts

@@ -0,0 +1,29 @@
+import prisma from "@/lib/prisma";
+import { Prisma } from "@prisma/client";
+import { Context } from "elysia";
+
+type FormCreate = Prisma.ContohEdukasiLingkunganGetPayload<{
+    select: {
+        id: true;
+        judul: true;
+        deskripsi: true;
+    }
+}>
+export default async function contohKegiatanDesaUpdate(context: Context) {
+    const body = context.body as FormCreate;
+
+    await prisma.contohEdukasiLingkungan.update({
+        where: {
+            id: body.id
+        },
+        data: {
+            judul: body.judul,
+            deskripsi: body.deskripsi,
+        }
+    })
+
+    return {
+        success: true,
+        message: "Contoh kegiatan desa berhasil diupdate",
+    }
+}

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/index.ts

@@ -0,0 +1,14 @@
+import Elysia from "elysia";
+import TujuanEdukasiLingkungan from "./tujuan-edukasi-lingkungan";
+import MateriEdukasiLingkungan from "./materi-edukasi-lingkunga";
+import ContohKegiatanDesa from "./contoh-kegiatan-desa";
+
+const EdukasiLingkungan = new Elysia({
+    prefix: "/edukasilingkungan",
+    tags: ["Lingkungan/Edukasi Lingkungan"]
+})
+.use(TujuanEdukasiLingkungan)
+.use(MateriEdukasiLingkungan)
+.use(ContohKegiatanDesa)
+
+export default EdukasiLingkungan; 

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/materi-edukasi-lingkunga/findUnique.ts

@@ -0,0 +1,33 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+export default async function materiEdukasiLingkunganFindUnique(context: Context) {
+    try {
+        const id = context?.params?.slugs?.[0];
+
+        // If no ID provided, get the first profile
+        if (!id) {
+            const data = await prisma.materiEdukasiLingkungan.findFirst();
+            return {
+                success: true,
+                data,
+            };
+        }
+
+        const data = await prisma.materiEdukasiLingkungan.findUniqueOrThrow({
+            where: { id },
+        });
+
+        return {
+            success: true,
+            data,
+        };
+    } catch (error) {
+        console.error("Error fetching materi edukasi lingkungan:", error);
+
+        return {
+            success: false,
+            message: error instanceof Error ? error.message : "Unknown error",
+        };
+    }
+}

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/materi-edukasi-lingkunga/index.ts

@@ -0,0 +1,19 @@
+import Elysia, { t } from "elysia";
+
+import materiEdukasiLingkunganUpdate from "./updt";
+import materiEdukasiLingkunganFindUnique from "./findUnique";
+
+const MateriEdukasiLingkungan = new Elysia({
+    prefix: "/materiedukasilingkungan",
+    tags: ["Lingkungan/Edukasi Lingkungan/Materi Edukasi Lingkungan"]
+})
+    .get("/find-by-id", materiEdukasiLingkunganFindUnique)
+    .post("/update", materiEdukasiLingkunganUpdate, {
+        body: t.Object({
+            id: t.String(),
+            judul: t.String(),
+            deskripsi: t.String(),
+        })
+    })
+
+export default MateriEdukasiLingkungan

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/materi-edukasi-lingkunga/updt.ts

@@ -0,0 +1,29 @@
+import prisma from "@/lib/prisma";
+import { Prisma } from "@prisma/client";
+import { Context } from "elysia";
+
+type FormCreate = Prisma.MateriEdukasiLingkunganGetPayload<{
+    select: {
+        id: true;
+        judul: true;
+        deskripsi: true;
+    }
+}>
+export default async function materiEdukasiLingkunganUpdate(context: Context) {
+    const body = context.body as FormCreate;
+
+    await prisma.materiEdukasiLingkungan.update({
+        where: {
+            id: body.id
+        },
+        data: {
+            judul: body.judul,
+            deskripsi: body.deskripsi,
+        }
+    })
+
+    return {
+        success: true,
+        message: "Materi edukasi lingkungan berhasil diupdate",
+    }
+}

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan/findUnqiue.ts

@@ -0,0 +1,33 @@
+import prisma from "@/lib/prisma";
+import { Context } from "elysia";
+
+export default async function tujuanEdukasiLingkunganFindUnique(context: Context) {
+    try {
+        const id = context?.params?.slugs?.[0];
+
+        // If no ID provided, get the first profile
+        if (!id) {
+            const data = await prisma.tujuanEdukasiLingkungan.findFirst();
+            return {
+                success: true,
+                data,
+            };
+        }
+
+        const data = await prisma.tujuanEdukasiLingkungan.findUniqueOrThrow({
+            where: { id },
+        });
+
+        return {
+            success: true,
+            data,
+        };
+    } catch (error) {
+        console.error("Error fetching tujuan edukasi lingkungan:", error);
+
+        return {
+            success: false,
+            message: error instanceof Error ? error.message : "Unknown error",
+        };
+    }
+}

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan/index.ts

@@ -0,0 +1,18 @@
+import Elysia, { t } from "elysia";
+import tujuanEdukasiLingkunganFindUnique from "./findUnqiue";
+import tujuanEdukasiLingkunganUpdate from "./updt";
+
+const TujuanEdukasiLingkungan = new Elysia({
+    prefix: "/tujuanedukasilingkungan",
+    tags: ["Lingkungan/Edukasi Lingkungan/Tujuan Edukasi Lingkungan"]
+})
+    .get("/find-by-id", tujuanEdukasiLingkunganFindUnique)
+    .post("/update", tujuanEdukasiLingkunganUpdate, {
+        body: t.Object({
+            id: t.String(),
+            judul: t.String(),
+            deskripsi: t.String(),
+        })
+    })
+
+export default TujuanEdukasiLingkungan

src/app/api/[[...slugs]]/_lib/lingkungan/edukasi-lingkungan/tujuan-edukasi-lingkungan/updt.ts

@@ -0,0 +1,29 @@
+import prisma from "@/lib/prisma";
+import { Prisma } from "@prisma/client";
+import { Context } from "elysia";
+
+type FormCreate = Prisma.TujuanEdukasiLingkunganGetPayload<{
+    select: {
+        id: true;
+        judul: true;
+        deskripsi: true;
+    }
+}>
+export default async function tujuanEdukasiLingkunganUpdate(context: Context) {
+    const body = context.body as FormCreate;
+
+    await prisma.tujuanEdukasiLingkungan.update({
+        where: {
+            id: body.id
+        },
+        data: {
+            judul: body.judul,
+            deskripsi: body.deskripsi,
+        }
+    })
+
+    return {
+        success: true,
+        message: "Tujuan edukasi lingkungan berhasil diupdate",
+    }
+}

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

@@ -2,6 +2,7 @@ import Elysia from "elysia";
 import PengelolaanSampah from "./pengelolaan-sampah";
 import ProgramPenghijauan from "./program-penghijauan";
 import DataLingkunganDesa from "./data-lingkungan-desa";
+import EdukasiLingkungan from "./edukasi-lingkungan";
 
 const Lingkungan = new Elysia({
   prefix: "/api/lingkungan",
@@ -11,5 +12,6 @@ const Lingkungan = new Elysia({
 .use(PengelolaanSampah)
 .use(ProgramPenghijauan)
 .use(DataLingkunganDesa)
+.use(EdukasiLingkungan)
 
 export default Lingkungan;