fix tampilan admin menu inovasi, sisa menu lingkungan

src/app/darmasaba/(pages)/kesehatan/data-kesehatan-warga/jadwal-kegiatan-page/[id]/page.tsx

@@ -3,55 +3,23 @@ import jadwalkegiatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_k
 import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
 import colors from '@/con/colors';
 import {
-  ActionIcon,
   Box,
   Button,
-  Combobox,
-  ComboboxChevron,
-  ComboboxOption,
-  ComboboxOptions,
-  ComboboxTarget,
   Divider,
   Group,
-  InputBase,
-  InputPlaceholder,
   Paper,
   Skeleton,
   Stack,
-  Text,
-  Textarea,
-  TextInput,
-  useCombobox
+  Text
 } from '@mantine/core';
-import { DateInput } from '@mantine/dates';
 import { useShallowEffect } from '@mantine/hooks';
-import { IconCalendar, IconDownload, IconPhone, IconMail, IconUser } from '@tabler/icons-react';
+import { IconDownload, IconMail, IconPhone, IconUser } from '@tabler/icons-react';
 import { useParams } from 'next/navigation';
-import { useState } from 'react';
 import { useProxy } from 'valtio/utils';
+import CreatePendaftaran from '../create/page';
 
-const layanan = [
-  'Penimbangan',
-  'Imunisasi',
-  'Vitamin A',
-  'Konsultasi Gizi',
-  'Pemeriksaan Kesehatan'
-];
 
 function Page() {
-  const combobox = useCombobox({
-    onDropdownClose: () => combobox.resetSelectedOption(),
-    onDropdownOpen: (eventSource) => {
-      if (eventSource === 'keyboard') {
-        combobox.selectActiveOption();
-      } else {
-        combobox.updateSelectedOptionIndex('active');
-      }
-    },
-  });
-
-  const [value, setValue] = useState<string | null>('');
-  const [dateInputOpened, setDateInputOpened] = useState(false);
   const params = useParams();
   const state = useProxy(jadwalkegiatanState);
 
@@ -59,20 +27,7 @@ function Page() {
     state.findUnique.load(params?.id as string);
   }, []);
 
-  const options = layanan.map((item) => (
-    <ComboboxOption value={item} key={item} active={item === value}>
-      <Group gap="xs">
-        {item === value && <IconUser size={14} stroke={2} />}
-        <span>{item}</span>
-      </Group>
-    </ComboboxOption>
-  ));
 
-  const pickerControl = (
-    <ActionIcon onClick={() => setDateInputOpened(true)} variant="light" color="blue">
-      <IconCalendar size={18} />
-    </ActionIcon>
-  );
 
   if (!state.findUnique.data) {
     return (
@@ -133,56 +88,7 @@ function Page() {
                   <Text ta="justify" fz="md" dangerouslySetInnerHTML={{ __html: state.findUnique.data.dokumenjadwalkegiatan.content }} />
                 </Stack>
 
-                <Stack gap="sm">
-                  <Text fz="lg" fw="bold">Formulir Pendaftaran</Text>
-                  <Divider />
-                  <Stack gap="md">
-                    <TextInput label="Nama Balita" placeholder="Masukkan nama balita" size="md" />
-                    <DateInput
-                      label="Tanggal Lahir"
-                      placeholder="dd/mm/yyyy"
-                      size="md"
-                      w={{ base: '100%', md: '85%', lg: '75%', xl: '50%' }}
-                      popoverProps={{ opened: dateInputOpened, onChange: setDateInputOpened }}
-                      rightSection={pickerControl}
-                    />
-                    <TextInput label="Nama Orang Tua / Wali" placeholder="Masukkan nama orang tua / wali" size="md" />
-                    <TextInput label="Nomor Telepon" placeholder="Masukkan nomor telepon" size="md" />
-                    <TextInput label="Alamat" placeholder="Masukkan alamat lengkap" size="md" />
-                    <Box w={{ base: '100%', md: '85%', lg: '75%', xl: '50%' }}>
-                      <Text fz="sm" fw="bold" pb={4}>Pilih Layanan</Text>
-                      <Combobox
-                        store={combobox}
-                        resetSelectionOnOptionHover
-                        withinPortal={false}
-                        onOptionSubmit={(val) => {
-                          setValue(val);
-                          combobox.updateSelectedOptionIndex('active');
-                        }}
-                      >
-                        <ComboboxTarget targetType="button">
-                          <InputBase
-                            component="button"
-                            type="button"
-                            pointer
-                            rightSection={<ComboboxChevron />}
-                            rightSectionPointerEvents="none"
-                            onClick={() => combobox.toggleDropdown()}
-                          >
-                            {value || <InputPlaceholder>Pilih layanan</InputPlaceholder>}
-                          </InputBase>
-                        </ComboboxTarget>
-                        <Combobox.Dropdown>
-                          <ComboboxOptions>{options}</ComboboxOptions>
-                        </Combobox.Dropdown>
-                      </Combobox>
-                    </Box>
-                    <Textarea label="Catatan Khusus (Opsional)" placeholder="Masukkan catatan jika ada" size="md" />
-                    <Button size="md" radius="lg" bg={colors['blue-button']}>
-                      Daftar Sekarang
-                    </Button>
-                  </Stack>
-                </Stack>
+                <CreatePendaftaran />
 
                 <Paper p="lg" radius="md" bg={colors['blue-button-trans']} shadow="sm">
                   <Stack gap="xs">

src/app/darmasaba/(pages)/kesehatan/data-kesehatan-warga/jadwal-kegiatan-page/create/page.tsx

@@ -0,0 +1,90 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import pendaftaranJadwalKegiatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/pendafataranJadwalKegiatan';
+import colors from '@/con/colors';
+import { Button, Divider, Stack, Text, Textarea, TextInput } from '@mantine/core';
+import { useEffect } from 'react';
+import { useProxy } from 'valtio/utils';
+
+function CreatePendaftaran() {
+  const stateCreate = useProxy(pendaftaranJadwalKegiatanState);
+
+
+useEffect(() => {
+    stateCreate.findMany.load();
+  }, []);
+
+  const resetForm = () => {
+    stateCreate.create.form = {
+      name: '',
+      alamat: '',
+      tanggal: '',
+      namaOrangtua: '',
+      nomor: '',
+      catatan: '',
+    };
+  };
+
+  const handleSubmit = async () => {
+    await stateCreate.create.submit();
+    resetForm();
+  };
+
+  return (
+    <Stack gap="sm">
+      <Text fz="lg" fw="bold">Formulir Pendaftaran</Text>
+      <Divider />
+      <Stack gap="md">
+        <TextInput 
+        label="Nama Balita" 
+        placeholder="Masukkan nama balita" 
+        size="md" 
+        value={stateCreate.create.form.name}
+        onChange={(e) => stateCreate.create.form.name = e.target.value}
+        />
+        <TextInput
+          type='date'
+          label="Tanggal Lahir"
+          placeholder="dd/mm/yyyy"
+          size="md"
+          w={{ base: '100%', md: '85%', lg: '75%', xl: '50%' }}
+          value={stateCreate.create.form.tanggal}
+          onChange={(e) => stateCreate.create.form.tanggal = e.target.value}
+        />
+        <TextInput 
+        label="Nama Orang Tua / Wali" 
+        placeholder="Masukkan nama orang tua / wali" 
+        size="md" 
+        value={stateCreate.create.form.namaOrangtua}
+        onChange={(e) => stateCreate.create.form.namaOrangtua = e.target.value}
+        />
+        <TextInput 
+        label="Nomor Telepon" 
+        placeholder="Masukkan nomor telepon" 
+        size="md" 
+        value={stateCreate.create.form.nomor}
+        onChange={(e) => stateCreate.create.form.nomor = e.target.value}
+        />
+        <TextInput 
+        label="Alamat" 
+        placeholder="Masukkan alamat lengkap" 
+        size="md" 
+        value={stateCreate.create.form.alamat}
+        onChange={(e) => stateCreate.create.form.alamat = e.target.value}
+        />
+        <Textarea 
+        label="Catatan Khusus (Opsional)" 
+        placeholder="Masukkan catatan jika ada" 
+        size="md" 
+        value={stateCreate.create.form.catatan}
+        onChange={(e) => stateCreate.create.form.catatan = e.target.value}
+        />
+        <Button size="md" radius="lg" bg={colors['blue-button']} onClick={handleSubmit}>
+          Daftar Sekarang
+        </Button>
+      </Stack>
+    </Stack>
+  );
+}
+
+export default CreatePendaftaran;