fix: qc

Deskripsi:
- breadcumbs
- back
- active menu

nb: blm selesai

No Issues

src/pages/scr/dashboard/dashboard_layout.tsx

@@ -215,6 +215,8 @@ function NavigationDashboard() {
   const location = useLocation();
   const [permissions, setPermissions] = useState<JsonValue[]>([]);
 
+  console.log(location)
+
   useEffect(() => {
     async function fetchPermissions() {
       const { data } = await apiFetch.api.user.find.get();
@@ -295,17 +297,21 @@ function NavigationDashboard() {
             label={
               <Flex align="center" gap={6}>
                 <Text fw={500}>{item.label}</Text>
-                {isActive(item.path as keyof typeof clientRoute) && (
-                  <Badge
-                    variant="light"
-                    color="teal"
-                    radius="sm"
-                    size="xs"
-                    style={{ textTransform: "none" }}
-                  >
-                    Active
-                  </Badge>
-                )}
+                {(isActive(item.path as keyof typeof clientRoute) ||
+                  (location.pathname == "/scr/dashboard/pelayanan-surat/detail-pelayanan" && item.path == "/scr/dashboard/pelayanan-surat/list-pelayanan") ||
+                  (location.pathname == "/scr/dashboard/pengaduan/detail" && item.path == "/scr/dashboard/pengaduan/list")
+                )
+                  && (
+                    <Badge
+                      variant="light"
+                      color="teal"
+                      radius="sm"
+                      size="xs"
+                      style={{ textTransform: "none" }}
+                    >
+                      Active
+                    </Badge>
+                  )}
               </Flex>
             }
             description={item.description}

src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx

@@ -1,3 +1,4 @@
+import BreadCrumbs from "@/components/BreadCrumbs";
 import ModalFile from "@/components/ModalFile";
 import ModalSurat from "@/components/ModalSurat";
 import notification from "@/components/notificationGlobal";
@@ -49,6 +50,11 @@ import { useLocation } from "react-router-dom";
 import useSwr from "swr";
 
 export default function DetailPengajuanPage() {
+  const dataMenu = [
+    { title: "Dashboard", link: "/scr/dashboard/dashboard-home", active: false },
+    { title: "Pelayanan Surat", link: "/scr/dashboard/pelayanan-surat/list-pelayanan", active: false },
+    { title: "Detail Pengajuan Surat", link: "#", active: true },
+  ];
   const { search } = useLocation();
   const query = new URLSearchParams(search);
   const id = query.get("id");
@@ -67,6 +73,9 @@ export default function DetailPengajuanPage() {
   return (
     <Container size="xl" py="xl" w={"100%"}>
       <Grid>
+        <Grid.Col span={12}>
+          <BreadCrumbs dataLink={dataMenu} back />
+        </Grid.Col>
         <Grid.Col span={8}>
           <Stack gap={"xl"}>
             <DetailDataPengajuan

src/pages/scr/dashboard/pengaduan/detail_page.tsx

@@ -1,3 +1,4 @@
+import BreadCrumbs from "@/components/BreadCrumbs";
 import ModalFile from "@/components/ModalFile";
 import notification from "@/components/notificationGlobal";
 import apiFetch from "@/lib/apiFetch";
@@ -40,6 +41,11 @@ import useSwr from "swr";
 
 
 export default function DetailPengaduanPage() {
+  const dataMenu = [
+    { title: "Dashboard", link: "/scr/dashboard/dashboard-home", active: false },
+    { title: "Pengaduan", link: "/scr/dashboard/pengaduan/list", active: false },
+    { title: "Detail Pengaduan", link: "#", active: true },
+  ];
   const { search } = useLocation();
   const query = new URLSearchParams(search);
   const id = query.get("id");
@@ -58,6 +64,9 @@ export default function DetailPengaduanPage() {
   return (
     <Container size="xl" py="xl" w={"100%"}>
       <Grid>
+        <Grid.Col span={12}>
+          <BreadCrumbs dataLink={dataMenu} back />
+        </Grid.Col>
         <Grid.Col span={8}>
           <Stack gap={"xl"}>
             <DetailDataPengaduan

src/pages/scr/dashboard/setting/detail_setting_page.tsx

@@ -1,3 +1,4 @@
+import BreadCrumbs from "@/components/BreadCrumbs";
 import DesaSetting from "@/components/DesaSetting";
 import KategoriPelayananSurat from "@/components/KategoriPelayananSurat";
 import KategoriPengaduan from "@/components/KategoriPengaduan";
@@ -15,6 +16,7 @@ import {
   IconUsersGroup,
 } from "@tabler/icons-react";
 import type { JsonValue } from "generated/prisma/runtime/library";
+import _ from "lodash";
 import { useEffect, useState } from "react";
 import { useLocation } from "react-router-dom";
 
@@ -23,6 +25,11 @@ export default function DetailSettingPage() {
   const query = new URLSearchParams(search);
   const type = query.get("type");
   const [permissions, setPermissions] = useState<JsonValue[]>([]);
+  const dataMenu = [
+    { title: "Dashboard", link: "/scr/dashboard/dashboard-home", active: false },
+    { title: "Setting", link: "#", active: false },
+    { title: type == "cat-pengaduan" ? "Kategori Pengaduan" : type == "cat-pelayanan" ? "Kategori Pelayanan Surat" : type ? _.upperFirst(type) : "Profile", link: "#", active: true },
+  ];
 
   useEffect(() => {
     async function fetchPermissions() {
@@ -87,6 +94,9 @@ export default function DetailSettingPage() {
   return (
     <Container size="xl" py="xl" w={"100%"}>
       <Grid>
+        <Grid.Col span={12}>
+          <BreadCrumbs dataLink={dataMenu} back />
+        </Grid.Col>
         <Grid.Col span={3}>
           <Card
             radius="md"

src/pages/scr/dashboard/warga/detail_warga_page.tsx

@@ -1,3 +1,4 @@
+import BreadCrumbs from "@/components/BreadCrumbs";
 import notification from "@/components/notificationGlobal";
 import apiFetch from "@/lib/apiFetch";
 import {
@@ -26,6 +27,11 @@ import { useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
 
 export default function DetailWargaPage() {
+  const dataMenu = [
+    { title: "Dashboard", link: "/scr/dashboard/dashboard-home", active: false },
+    { title: "Warga", link: "/scr/dashboard/warga/list-warga", active: false },
+    { title: "Detail Warga", link: "#", active: true },
+  ];
   const { search } = useLocation();
   const query = new URLSearchParams(search);
   const id = query.get("id");
@@ -50,6 +56,9 @@ export default function DetailWargaPage() {
       />
       <Container size="xl" py="xl" w={"100%"}>
         <Grid>
+          <Grid.Col span={12}>
+            <BreadCrumbs dataLink={dataMenu} back />
+          </Grid.Col>
           <Grid.Col span={4}>
             <DetailWarga id={id!} />
           </Grid.Col>