Sinkronisasi UI & API Admin - User Submenu Berita

src/app/admin/(dashboard)/_state/desa/berita.ts

@@ -74,9 +74,11 @@ const berita = proxy({
     totalPages: 1,
     loading: false,
     search: "",
-    async load(page = 1, limit = 10, search = "", kategori = "") {
-      this.loading = true;
-      this.page = page;
+   load: async (page = 1, limit = 10, search = "", kategori = "") => {
+      berita.findMany.loading = true; // ✅ Akses langsung via nama path
+      berita.findMany.page = page;
+      berita.findMany.search = search;
+  
       try {
         const query: any = { page, limit };
         if (search) query.search = search;
@@ -85,20 +87,20 @@ const berita = proxy({
         const res = await ApiFetch.api.desa.berita["find-many"].get({ query });
     
         if (res.status === 200 && res.data?.success) {
-          this.data = res.data.data ?? [];
-          this.totalPages = res.data.totalPages ?? 1;
+          berita.findMany.data = res.data.data ?? [];
+          berita.findMany.totalPages = res.data.totalPages ?? 1;
         } else {
-          this.data = [];
-          this.totalPages = 1;
+          berita.findMany.data = [];
+          berita.findMany.totalPages = 1;
         }
       } catch (err) {
         console.error("Gagal fetch berita paginated:", err);
-        this.data = [];
-        this.totalPages = 1;
+        berita.findMany.data = [];
+        berita.findMany.totalPages = 1;
       } finally {
-        this.loading = false;
+        berita.findMany.loading = false;
       }
-    }
+    },
   },
 
   findUnique: {

src/app/admin/(dashboard)/desa/berita/list-berita/[id]/page.tsx

@@ -89,7 +89,7 @@ function DetailBerita() {
                   <Button
                     onClick={() => {
                       if (beritaState.berita.findUnique.data) {
-                        router.push(`/admin/desa/berita/${beritaState.berita.findUnique.data.id}/edit`);
+                        router.push(`/admin/desa/berita/list-berita/${beritaState.berita.findUnique.data.id}/edit`);
                       }
                     }}
                     disabled={!beritaState.berita.findUnique.data}

src/app/darmasaba/(pages)/desa/berita/[kategori]/Content.tsx

@@ -54,7 +54,7 @@ export default function Content({ kategori }: { kategori: string }) {
           <Center><Skeleton h={400} /></Center>
         ) : featured ? (
           <Box mb={50}>
-            <Text fz="h2" fw={700} mb="md">Berita Utama: {kategori}</Text>
+            <Text fz="h2" fw={700} mb="md">Berita Utama</Text>
             <Paper shadow="md" radius="md" withBorder>
               <Grid gutter={0}>
                 <GridCol span={{ base: 12, md: 6 }}>
@@ -90,7 +90,7 @@ export default function Content({ kategori }: { kategori: string }) {
                       <Button
                         variant="light"
                         rightSection={<IconArrowRight size={16} />}
-                        onClick={() => router.push(`/desa/berita/${featured.id}`)}
+                        onClick={() => router.push(`/darmasaba/desa/berita/${kategori}/${featured.id}`)}
                       >
                         Baca Selengkapnya
                       </Button>
@@ -104,7 +104,7 @@ export default function Content({ kategori }: { kategori: string }) {
 
         {/* === Daftar Berita === */}
         <Box mt={50}>
-          <Title order={2} mb="md">Berita {kategori}</Title>
+          <Title order={2} mb="md">Daftar Berita</Title>
           <Divider mb="xl" />
 
           {state.findMany.loading ? (

src/app/darmasaba/(pages)/desa/berita/[kategori]/[id]/page.tsx

@@ -0,0 +1,78 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+'use client'
+import stateDashboardBerita from '@/app/admin/(dashboard)/_state/desa/berita';
+import colors from '@/con/colors';
+import { Box, Center, Container, Image, Skeleton, Stack, Text } from '@mantine/core';
+import { useParams } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { useProxy } from 'valtio/utils';
+import BackButton from '../../../layanan/_com/BackButto';
+
+
+
+function Page() {
+  const params = useParams<{ id: string }>();
+  const id = Array.isArray(params.id) ? params.id[0] : params.id;
+  const state = useProxy(stateDashboardBerita.berita)
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    const loadData = async () => {
+      if (!id) return;
+      try {
+        setLoading(true);
+        await state.findUnique.load(id);
+      } catch (error) {
+        console.error('Error loading data:', error);
+      } finally {
+        setLoading(false);
+      }
+    }
+    loadData()
+  }, [id])
+
+  if (loading) {
+    return (
+      <Center>
+        <Skeleton height={500} />
+      </Center>
+    );
+  }
+
+  if (!state.findUnique.data) {
+    return (
+      <Center>
+        <Text>Data tidak ditemukan</Text>
+      </Center>
+    );
+  }
+
+
+  return (
+    <Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
+      <Box px={{ base: "md", md: 100 }}><BackButton /></Box>
+      <Container w={{ base: "100%", md: "50%" }} >
+        <Box pb={20}>
+          <Text ta={"center"} fz={"2.4rem"} c={colors["blue-button"]} fw={"bold"}>
+            {state.findUnique.data?.judul}
+          </Text>
+          <Text
+            ta={"center"}
+            fw={"bold"}
+            fz={"1.5rem"}
+          >
+            Informasi dan Pelayanan Administrasi Digital
+          </Text>
+        </Box>
+        <Image src={state.findUnique.data?.image?.link || ''} alt='' w={"100%"} />
+      </Container>
+      <Box px={{ base: "md", md: 100 }}>
+        <Stack gap={"xs"}>
+          <Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: state.findUnique.data?.content || '' }} />
+        </Stack>
+      </Box>
+    </Stack>
+  );
+}
+
+export default Page;