wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

QC User & Admin Responsive : Menu Landing Page - Desa

Browse Source
This commit is contained in:
nico
2025-10-02 00:10:33 +08:00
parent 63054cedf0
commit 8a6d8ed8db
70 changed files with 1839 additions and 1052 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/app/admin/(dashboard)/pendidikan/pendidikan-non-formal/jenis-program-yang-diselenggarakan/edit/page.tsx
View File

@@ -33,8 +33,7 @@ function EditJenisProgramYangDiselenggarakan() {
const router = useRouter();
const editState = useProxy(pendidikanNonFormalState.stateJenisProgram);
const [judul, setJudul] = useState('');
const [content, setContent] = useState('');
const [formData, setFormData] = useState({ judul: '', content: '' });
const [isSubmitting, setIsSubmitting] = useState(false);
// Load data pertama kali
@@ -44,16 +43,22 @@ function EditJenisProgramYangDiselenggarakan() {
}
}, []);
// Sync state dengan data hasil fetch
// Sync state lokal dengan data hasil fetch
useEffect(() => {
if (editState.findById.data) {
setJudul(editState.findById.data.judul ?? '');
setContent(editState.findById.data.deskripsi ?? '');
setFormData({
judul: editState.findById.data.judul ?? '',
content: editState.findById.data.deskripsi ?? '',
});
}
}, [editState.findById.data]);
const handleChange = (field: 'judul' | 'content', value: string) => {
setFormData((prev) => ({ ...prev, [field]: value }));
};
const handleSubmit = async () => {
if (!judul.trim()) {
if (!formData.judul.trim()) {
toast.error('Judul wajib diisi');
return;
}
@@ -61,11 +66,15 @@ function EditJenisProgramYangDiselenggarakan() {
setIsSubmitting(true);
try {
if (editState.findById.data) {
editState.findById.data.judul = judul;
editState.findById.data.deskripsi = content;
await editState.update.save(editState.findById.data);
const updatedData = {
...editState.findById.data,
judul: formData.judul,
deskripsi: formData.content,
};
await editState.update.save(updatedData);
toast.success('Berhasil menyimpan perubahan');
router.push(
'/admin/pendidikan/pendidikan-non-formal/jenis-program-yang-diselenggarakan'
);
@@ -117,17 +126,17 @@ function EditJenisProgramYangDiselenggarakan() {
<TextInput
label={<Text fz="sm" fw="bold">Judul</Text>}
placeholder="Masukkan judul program"
defaultValue={judul}
onChange={(e) => setJudul(e.currentTarget.value)}
error={!judul && 'Judul wajib diisi'}
value={formData.judul}
onChange={(e) => handleChange('judul', e.currentTarget.value)}
error={!formData.judul && 'Judul wajib diisi'}
/>
<Box>
<Text fz="sm" fw="bold" mb="xs">Deskripsi</Text>
<JenisProgramYangDiselenggarakanTextEditor
showSubmit={false}
onChange={setContent}
initialContent={content}
onChange={(value: string) => handleChange('content', value)}
initialContent={formData.content}
/>
</Box>
@@ -136,7 +145,7 @@ function EditJenisProgramYangDiselenggarakan() {
bg={colors['blue-button']}
onClick={handleSubmit}
loading={isSubmitting || editState.update.loading}
disabled={!judul}
disabled={!formData.judul}
>
{isSubmitting ? 'Menyimpan...' : 'Simpan Perubahan'}
</Button>

43
src/app/admin/(dashboard)/pendidikan/pendidikan-non-formal/tempat-kegiatan/edit/page.tsx
View File

@@ -1,4 +1,5 @@
'use client'
import pendidikanNonFormalState from '@/app/admin/(dashboard)/_state/pendidikan/pendidikan-non-formal';
import colors from '@/con/colors';
import {
@@ -33,8 +34,11 @@ function EditTempatKegiatan() {
const router = useRouter();
const editState = useProxy(pendidikanNonFormalState.stateTempatKegiatan);
const [judul, setJudul] = useState('');
const [content, setContent] = useState('');
// state lokal form
const [formData, setFormData] = useState({
judul: '',
deskripsi: '',
});
const [isSubmitting, setIsSubmitting] = useState(false);
// load data pertama kali
@@ -44,16 +48,22 @@ function EditTempatKegiatan() {
}
}, []);
// sync state dengan data hasil fetch
// sync state lokal ketika data fetch selesai
useEffect(() => {
if (editState.findById.data) {
setJudul(editState.findById.data.judul ?? '');
setContent(editState.findById.data.deskripsi ?? '');
setFormData({
judul: editState.findById.data.judul ?? '',
deskripsi: editState.findById.data.deskripsi ?? '',
});
}
}, [editState.findById.data]);
const handleChange = (field: 'judul' | 'deskripsi', value: string) => {
setFormData((prev) => ({ ...prev, [field]: value }));
};
const handleSubmit = async () => {
if (!judul.trim()) {
if (!formData.judul.trim()) {
toast.error('Judul wajib diisi');
return;
}
@@ -61,10 +71,13 @@ function EditTempatKegiatan() {
setIsSubmitting(true);
try {
if (editState.findById.data) {
editState.findById.data.judul = judul;
editState.findById.data.deskripsi = content;
await editState.update.save(editState.findById.data);
const updatedData = {
...editState.findById.data,
judul: formData.judul,
deskripsi: formData.deskripsi,
};
await editState.update.save(updatedData);
toast.success('Berhasil menyimpan perubahan');
router.push(
'/admin/pendidikan/pendidikan-non-formal/tempat-kegiatan'
@@ -117,9 +130,9 @@ function EditTempatKegiatan() {
<TextInput
label={<Text fz="sm" fw="bold">Judul</Text>}
placeholder="Masukkan judul tempat kegiatan"
defaultValue={judul}
onChange={(e) => setJudul(e.currentTarget.value)}
error={!judul && 'Judul wajib diisi'}
value={formData.judul}
onChange={(e) => handleChange('judul', e.currentTarget.value)}
error={!formData.judul && 'Judul wajib diisi'}
/>
<Box>
@@ -128,8 +141,8 @@ function EditTempatKegiatan() {
</Text>
<TempatKegiatanTextEditor
showSubmit={false}
onChange={setContent}
initialContent={content}
onChange={(value) => handleChange('deskripsi', value)}
initialContent={formData.deskripsi}
/>
</Box>
@@ -138,7 +151,7 @@ function EditTempatKegiatan() {
bg={colors['blue-button']}
onClick={handleSubmit}
loading={isSubmitting || editState.update.loading}
disabled={!judul}
disabled={!formData.judul}
>
{isSubmitting ? 'Menyimpan...' : 'Simpan Perubahan'}
</Button>

54
src/app/admin/(dashboard)/pendidikan/pendidikan-non-formal/tujuan-program/edit/page.tsx
View File

@@ -1,4 +1,5 @@
'use client'
import pendidikanNonFormalState from '@/app/admin/(dashboard)/_state/pendidikan/pendidikan-non-formal';
import colors from '@/con/colors';
import {
@@ -30,41 +31,49 @@ function EditTujuanProgram() {
const router = useRouter();
const editState = useProxy(pendidikanNonFormalState.stateTujuanPendidikanNonFormal);
const [judul, setJudul] = useState('');
const [content, setContent] = useState('');
const [formData, setFormData] = useState({ judul: '', deskripsi: '' });
const [isSubmitting, setIsSubmitting] = useState(false);
// load data pertama kali
// Load data pertama kali
useShallowEffect(() => {
if (!editState.findById.data) {
editState.findById.initialize();
}
}, []);
// sync data hasil fetch ke local state
// Sync hasil fetch ke local state (sekali)
useEffect(() => {
if (editState.findById.data) {
setJudul(editState.findById.data.judul ?? '');
setContent(editState.findById.data.deskripsi ?? '');
setFormData({
judul: editState.findById.data.judul ?? '',
deskripsi: editState.findById.data.deskripsi ?? ''
});
}
}, [editState.findById.data]);
const handleChange = (field: 'judul' | 'deskripsi', value: string) => {
setFormData(prev => ({ ...prev, [field]: value }));
};
const handleSubmit = async () => {
if (!judul.trim()) {
if (!formData.judul.trim()) {
toast.error('Judul wajib diisi');
return;
}
if (!editState.findById.data) return;
setIsSubmitting(true);
try {
if (editState.findById.data) {
editState.findById.data.judul = judul;
editState.findById.data.deskripsi = content;
await editState.update.save(editState.findById.data);
const payload = {
...editState.findById.data,
judul: formData.judul,
deskripsi: formData.deskripsi
};
toast.success('Berhasil menyimpan perubahan');
router.push('/admin/pendidikan/pendidikan-non-formal/tujuan-program');
}
await editState.update.save(payload);
toast.success('Berhasil menyimpan perubahan');
router.push('/admin/pendidikan/pendidikan-non-formal/tujuan-program');
} catch (err) {
console.error('Error saving:', err);
toast.error('Gagal menyimpan data');
@@ -88,16 +97,13 @@ function EditTujuanProgram() {
return (
<Box>
<Stack gap="xs">
{/* Back Button + Title */}
<Group mb="md">
<Tooltip label="Kembali ke halaman sebelumnya" withArrow>
<Button variant="subtle" onClick={handleBack} p="xs" radius="md">
<IconArrowBack color={colors['blue-button']} size={22} />
</Button>
</Tooltip>
<Title order={4} ml="sm" c="dark">
Edit Tujuan Program
</Title>
<Title order={4} ml="sm" c="dark">Edit Tujuan Program</Title>
</Group>
<Paper
@@ -112,17 +118,17 @@ function EditTujuanProgram() {
<TextInput
label={<Text fz="sm" fw="bold">Judul</Text>}
placeholder="Masukkan judul program"
defaultValue={judul}
onChange={(e) => setJudul(e.currentTarget.value)}
error={!judul && 'Judul wajib diisi'}
value={formData.judul}
onChange={(e) => handleChange('judul', e.currentTarget.value)}
error={!formData.judul && 'Judul wajib diisi'}
/>
<Box>
<Text fz="sm" fw="bold" mb="xs">Deskripsi</Text>
<PendidikanNonFormalTextEditor
showSubmit={false}
onChange={setContent}
initialContent={content}
onChange={(value) => handleChange('deskripsi', value)}
initialContent={formData.deskripsi}
/>
</Box>
@@ -131,7 +137,7 @@ function EditTujuanProgram() {
bg={colors['blue-button']}
onClick={handleSubmit}
loading={isSubmitting || editState.update.loading}
disabled={!judul}
disabled={!formData.judul}
>
{isSubmitting ? 'Menyimpan...' : 'Simpan Perubahan'}
</Button>