From b62c4be30aa62998f33d598a323ef2184b72e697 Mon Sep 17 00:00:00 2001 From: nico Date: Tue, 5 Aug 2025 22:08:25 +0800 Subject: [PATCH] Sinkronisasi API & UI Admin & User, Menu Landing Page, Submenu Potensi --- .../admin/(dashboard)/_state/desa/potensi.ts | 2 +- .../potensi/list-potensi/[id]/edit/page.tsx | 2 +- .../darmasaba/(pages)/desa/potensi/page.tsx | 149 ++++++------------ 3 files changed, 47 insertions(+), 106 deletions(-) diff --git a/src/app/admin/(dashboard)/_state/desa/potensi.ts b/src/app/admin/(dashboard)/_state/desa/potensi.ts index 30eca0c1..3e60fdf8 100644 --- a/src/app/admin/(dashboard)/_state/desa/potensi.ts +++ b/src/app/admin/(dashboard)/_state/desa/potensi.ts @@ -6,7 +6,7 @@ import { proxy } from "valtio"; import { z } from "zod"; const templateForm = z.object({ - name: z.string().min(1).max(50), + name: z.string().min(1).max(5000), deskripsi: z.string().min(1).max(5000), kategoriId: z.string().min(1).max(50), imageId: z.string().min(1).max(50), diff --git a/src/app/admin/(dashboard)/desa/potensi/list-potensi/[id]/edit/page.tsx b/src/app/admin/(dashboard)/desa/potensi/list-potensi/[id]/edit/page.tsx index 38f0d20f..d8c138da 100644 --- a/src/app/admin/(dashboard)/desa/potensi/list-potensi/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/desa/potensi/list-potensi/[id]/edit/page.tsx @@ -84,7 +84,7 @@ function EditPotensi() { await potensiState.edit.update(); toast.success("Potensi berhasil diperbarui!"); - router.push("/admin/desa/potensi"); + router.push("/admin/desa/potensi/list-potensi"); } catch (error) { console.error("Error updating potensi:", error); toast.error("Terjadi kesalahan saat memperbarui potensi"); diff --git a/src/app/darmasaba/(pages)/desa/potensi/page.tsx b/src/app/darmasaba/(pages)/desa/potensi/page.tsx index 52922e9a..37d2a4e4 100644 --- a/src/app/darmasaba/(pages)/desa/potensi/page.tsx +++ b/src/app/darmasaba/(pages)/desa/potensi/page.tsx @@ -1,105 +1,36 @@ +/* eslint-disable react-hooks/exhaustive-deps */ 'use client' import colors from '@/con/colors'; -import { BackgroundImage, Box, Button, Flex, Group, Paper, SimpleGrid, Stack, Text } from '@mantine/core'; +import { BackgroundImage, Box, Button, Center, Flex, Group, Paper, SimpleGrid, Skeleton, Stack, Text } from '@mantine/core'; +import { useTransitionRouter } from 'next-view-transitions'; import BackButton from '../layanan/_com/BackButto'; -import { useRouter } from 'next/navigation'; +import { useEffect, useState } from 'react'; +import { useProxy } from 'valtio/utils'; +import potensiDesaState from '@/app/admin/(dashboard)/_state/desa/potensi'; -const datamap = [ - { - id: 1, - images: "/api/img/tps.png", - name: "TPS3R Pudak Mesari", - kategori: "Lingkungan", - link: "/darmasaba/desa/potensi/tps3r-pudak-mesari", - }, - { - id: 2, - images: "/api/img/ack.png", - name: "Bumdes Pudak Mesari", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/bumdes-pudak-mesari", - }, - { - id: 3, - images: "/api/img/taman-beji.jpg", - name: "Taman Beji Cengana", - kategori: "Wisata", - link: "/darmasaba/desa/potensi/taman-beji-cengana", - }, - { - id: 4, - images: "/api/img/waterpark.png", - name: "Gumuh Sari Water Park", - kategori: "Wisata", - link: "/darmasaba/desa/potensi/gumuh-sari-water-park", - }, - { - id: 5, - images: "/api/img/pertanian.jpg", - name: "Pertanian", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/pertanian" - }, - { - id: 6, - images: "/api/img/warungumkm.jpg", - name: "Kawasan Kuliner", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/kawasan-kuliner" - }, - { - id: 7, - images: "/api/img/ikm.png", - name: "IKM Berbasis Pengolahan Pangan", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/ikm-berbasis-pengolahan-pangan" - }, - { - id: 8, - images: "/api/img/genteng.jpeg", - name: "Genteng", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/genteng" - }, - { - id: 9, - images: "/api/img/peternakanlele.jpg", - name: "Peternakan Ikan Lele", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/peternakan-ikan-lele" - }, - { - id: 10, - images: "/api/img/jogging.jpg", - name: "Jogging Track Tegeh Aban, Karang Gadon dan Munduk Uma Desa", - kategori: "Lingkungan", - link: "/darmasaba/desa/potensi/jogging-track-tegeh-aban-karang-gadon-dan-munduk-uma-desa" - }, - { - id: 11, - images: "/api/img/damtanahputih.jpeg", - name: "Dam Tanah Putih", - kategori: "Wisata", - link: "/darmasaba/desa/potensi/dam-tanah-putih" - }, - { - id: 12, - images: "/api/img/umkm.jpeg", - name: "UMKM", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/umkm" - }, - { - id: 13, - images: "/api/img/potong-daging.png", - name: "Pemotongan Daging", - kategori: "Ekonomi", - link: "/darmasaba/desa/potensi/pemotongan-daging" - }, -] function Page() { - const router = useRouter() + const router = useTransitionRouter() + const [loading, setLoading] = useState(false) + const state = useProxy(potensiDesaState) + + useEffect(()=> { + state.kategoriPotensi.findMany.load() + const loadData = async () => { + try { + setLoading(true) + await state.potensiDesa.findMany.load() + } catch (error) { + console.error('Error loading data:', error); + } finally { + setLoading(false) + } + } + loadData() + }, []) + + const data = state.potensiDesa.findMany.data + // const kategoriData = state.kategoriPotensi.findMany.data return ( @@ -118,13 +49,17 @@ function Page() { - + - 13 + + {data?.filter(item => item.kategori?.nama.toLowerCase() !== 'wisata' ).length || 0} + Potensi - 5 + + {data?.filter(item => item.kategori?.nama.toLowerCase() === 'wisata' ).length || 0} + Destinasi Wisata @@ -140,11 +75,16 @@ function Page() { sm: 3 }} > - {datamap.map((v, k) => { + {loading ? ( +
+ +
+ ) : ( + data?.map((v, k) => { return ( - {v.kategori} + {v.kategori?.nama} @@ -176,14 +116,15 @@ function Page() { ) - })} + }) + )}