Nico 21 Mei :

Yang udah dikerjakan:
Tampilan UI Menu DesaTampilan UI Menu Kesehatan

Yang Akan dikerjakan:
Tampilan UI Keamanan, dan Menu Selanjutnya
Memperbaiki eror di bagian inputan dimana saat nginput data outputnya ikut ke ganti seharusnya di submit dulu

src/app/admin/(dashboard)/ppid/dasar-hukum/page.tsx

@@ -1,21 +1,59 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Paper, SimpleGrid, Stack, Title } from '@mantine/core';
-import CreateDasarHukum from './create/page';
+import { Box, Button, Group, Paper, SimpleGrid, Stack, Title } from '@mantine/core';
+import CreateDasarHukum from './create/create';
 import ListDataDasarHukum from './listData/page';
+import { useShallowEffect } from '@mantine/hooks';
+import { useProxy } from 'valtio/utils';
+import stateDasarHukumPPID from '../../_state/ppid/dasar_hukum/dasarHukum';
+import { useEffect, useState } from 'react';
 
 function Page() {
+  const dasarHukumState = useProxy(stateDasarHukumPPID)
+  const [judul, setJudul] = useState('');
+  const [content, setContent] = useState('');
+
+  useShallowEffect(() => {
+    if (!dasarHukumState.findById.data) {
+      dasarHukumState.findById.initialize(); // biar masuk ke `findFirst` route kamu
+    }
+  }, []);
+
+  useEffect(() => {
+    if (dasarHukumState.findById.data) {
+      setJudul(dasarHukumState.findById.data.judul ?? '')
+      setContent(dasarHukumState.findById.data.content ?? '')
+    }
+  }, [dasarHukumState.findById.data])
+
+  const submit = () => {
+    if (dasarHukumState.findById.data) {
+      dasarHukumState.findById.data.judul = judul;
+      dasarHukumState.findById.data.content = content;
+      dasarHukumState.update.save(dasarHukumState.findById.data)
+    }
+  }
 
   return (
     <Stack gap={"xs"}>
       <SimpleGrid cols={{ base: 1, md: 2 }}>
         <Box>
           <Paper bg={colors['white-1']} p={'md'} radius={10}>
-          <Title order={3}>Dasar Hukum PPID</Title>
-          <CreateDasarHukum/>
+            <Title order={3}>Dasar Hukum PPID</Title>
+            <CreateDasarHukum onJudulChange={setJudul} onContentChange={setContent} valueJudul={judul} valueContent={content} />
+            <Group>
+              <Button
+                mt={10}
+                bg={colors['blue-button']}
+                onClick={submit}
+                loading={dasarHukumState.update.loading}
+              >
+                Submit
+              </Button>
+            </Group>
           </Paper>
         </Box>
-        <ListDataDasarHukum/>
+        <ListDataDasarHukum />
       </SimpleGrid>
     </Stack>
   )