Fix semua tulisan profile jadi profil, mulai dari navbar, dan route

2025-12-10 14:16:15 +08:00
parent ac2fc1a705
commit 99c2c9c6d7
31 changed files with 146 additions and 83 deletions
--- a/src/app/admin/(dashboard)/desa/profile/_lib/layoutTabsDetail.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/_lib/layoutTabsDetail.tsx
@@ -11,21 +11,21 @@ function LayoutTabsDetail({ children }: { children: React.ReactNode }) {
    const pathname = usePathname()
    const tabs = [
        {
-            label: "Profile Desa",
-            value: "profiledesa",
-            href: "/admin/desa/profile/profile-desa",
+            label: "Profil Desa",
+            value: "profildesa",
+            href: "/admin/desa/profil/profil-desa",
            icon: <IconUser size={18} stroke={1.8} />
        },
        {
-            label: "Profile Perbekel",
-            value: "profileperbekel",
-            href: "/admin/desa/profile/profile-perbekel",
+            label: "Profil Perbekel",
+            value: "profilperbekel",
+            href: "/admin/desa/profil/profil-perbekel",
            icon: <IconUsers size={18} stroke={1.8} />
        },
        {
-            label: "Profile Perbekel Dari Masa Ke Masa",
-            value: "profile-perbekel-dari-masa-ke-masa",
-            href: "/admin/desa/profile/profile-perbekel-dari-masa-ke-masa",
+            label: "Profil Perbekel Dari Masa Ke Masa",
+            value: "profilperbekeldarimasakemasa",
+            href: "/admin/desa/profil/profil-perbekel-dari-masa-ke-masa",
            icon: <IconCalendar size={18} stroke={1.8} />
        }
    ];
--- a/src/app/admin/(dashboard)/desa/profile/_lib/layoutTabsEdit.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/_lib/layoutTabsEdit.tsx
@@ -12,22 +12,22 @@ function LayoutTabsEdit({ children }: { children: React.ReactNode }) {
        {
            label: "Sejarah Desa",
            value: "sejarahdesa",
-            href: "/admin/desa/profile/edit/sejarah_desa"
+            href: "/admin/desa/profil/edit/sejarah_desa"
        },
        {
            label: "Visi Misi Desa",
            value: "visimisidesa",
-            href: "/admin/desa/profile/edit/visi_misi_desa"
+            href: "/admin/desa/profil/edit/visi_misi_desa"
        },
        {
            label: "Lambang Desa",
            value: "lambangdesa",
-            href: "/admin/desa/profile/edit/lambang_desa"
+            href: "/admin/desa/profil/edit/lambang_desa"
        },
        {
            label: "Maskot Desa",
            value: "maskotdesa",
-            href: "/admin/desa/profile/edit/maskot_desa"
+            href: "/admin/desa/profil/edit/maskot_desa"
        },
    ];
    const curentTab = tabs.find(tab => tab.href === pathname)
--- a/src/app/admin/(dashboard)/desa/profile/layout.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/layout.tsx
--- a/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/lambang_desa/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/lambang_desa/page.tsx
@@ -43,7 +43,7 @@ function Page() {
      const id = params?.id as string;
      if (!id) {
        toast.error('ID tidak valid');
-        router.push('/admin/desa/profile/profile-desa');
+        router.push('/admin/desa/profil/profil-desa');
        return;
      }

@@ -106,7 +106,7 @@ function Page() {

      if (success) {
        toast.success('Data berhasil disimpan');
-        router.push('/admin/desa/profile/profile-desa');
+        router.push('/admin/desa/profil/profil-desa');
      } else {
        toast.error('Gagal menyimpan data');
      }
@@ -156,7 +156,7 @@ function Page() {
          <Alert icon={<IconAlertCircle size={20} />} color="red" title="Terjadi Kesalahan" radius="md">
            {loadError}
          </Alert>
-          <Button onClick={() => router.push('/admin/desa/profile/profile-desa')} variant="outline">
+          <Button onClick={() => router.push('/admin/desa/profil/profil-desa')} variant="outline">
            Kembali ke Halaman Utama
          </Button>
        </Stack>
--- a/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/maskot_desa/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/maskot_desa/page.tsx
@@ -40,7 +40,7 @@ function Page() {
      const id = params?.id as string;
      if (!id) {
        toast.error("ID tidak valid");
-        router.push("/admin/desa/profile/profile-desa");
+        router.push("/admin/desa/profil/profil-desa");
        return;
      }

@@ -157,7 +157,7 @@ function Page() {

      if (success) {
        toast.success("Maskot berhasil diperbarui!");
-        router.push("/admin/desa/profile/profile-desa");
+        router.push("/admin/desa/profil/profil-desa");
      }
    } catch (error) {
      console.error("Error update maskot:", error);
--- a/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/sejarah_desa/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/sejarah_desa/page.tsx
@@ -50,7 +50,7 @@ function Page() {
            const id = params?.id as string;
            if (!id) {
                toast.error('ID tidak valid');
-                router.push('/admin/desa/profile/profile-desa');
+                router.push('/admin/desa/profil/profil-desa');
                return;
            }

@@ -122,7 +122,7 @@ function Page() {

            if (success) {
                toast.success('Data berhasil disimpan');
-                router.push('/admin/desa/profile/profile-desa');
+                router.push('/admin/desa/profil/profil-desa');
            } else {
                toast.error('Gagal menyimpan data');
            }
@@ -179,7 +179,7 @@ function Page() {
                        {loadError}
                    </Alert>
                    <Button
-                        onClick={() => router.push('/admin/desa/profile/profile-desa')}
+                        onClick={() => router.push('/admin/desa/profil/profil-desa')}
                        variant="outline"
                    >
                        Kembali ke Halaman Utama
--- a/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/visi_misi_desa/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-desa/[id]/visi_misi_desa/page.tsx
@@ -42,7 +42,7 @@ function Page() {
      const id = params?.id as string;
      if (!id) {
        toast.error('ID tidak valid');
-        router.push('/admin/desa/profile/profile-desa');
+        router.push('/admin/desa/profil/profil-desa');
        return;
      }

@@ -106,7 +106,7 @@ function Page() {

      if (success) {
        toast.success('Data berhasil disimpan');
-        router.push('/admin/desa/profile/profile-desa');
+        router.push('/admin/desa/profil/profil-desa');
      } else {
        toast.error('Gagal menyimpan data');
      }
@@ -156,7 +156,7 @@ function Page() {
            {loadError}
          </Alert>
          <Button
-            onClick={() => router.push('/admin/desa/profile/profile-desa')}
+            onClick={() => router.push('/admin/desa/profil/profil-desa')}
            variant="outline"
          >
            Kembali ke Halaman Utama
--- a/src/app/admin/(dashboard)/desa/profile/profile-desa/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-desa/page.tsx
@@ -27,7 +27,7 @@ function Page() {
  return (
    <Paper bg={colors['white-1']} p="lg" radius="md" shadow="sm">
      <Stack gap="lg">
-        <Title order={2} c={colors['blue-button']}>Preview Profile Desa</Title>
+        <Title order={2} c={colors['blue-button']}>Preview Profil Desa</Title>

        {/* Sejarah Desa */}
        {sejarah && (
@@ -42,7 +42,7 @@ function Page() {
                    variant="light"
                    leftSection={<IconEdit size={18} stroke={2} />}
                    radius="md"
-                    onClick={() => router.push(`/admin/desa/profile/profile-desa/${sejarah.id}/sejarah_desa`)}
+                    onClick={() => router.push(`/admin/desa/profil/profil-desa/${sejarah.id}/sejarah_desa`)}
                  >
                    Edit
                  </Button>
@@ -87,7 +87,7 @@ function Page() {
                    variant="light"
                    leftSection={<IconEdit size={18} stroke={2} />}
                    radius="md"
-                    onClick={() => router.push(`/admin/desa/profile/profile-desa/${visiMisi.id}/visi_misi_desa`)}
+                    onClick={() => router.push(`/admin/desa/profil/profil-desa/${visiMisi.id}/visi_misi_desa`)}
                  >
                    Edit
                  </Button>
@@ -135,7 +135,7 @@ function Page() {
                    variant="light"
                    leftSection={<IconEdit size={18} stroke={2} />}
                    radius="md"
-                    onClick={() => router.push(`/admin/desa/profile/profile-desa/${lambang.id}/lambang_desa`)}
+                    onClick={() => router.push(`/admin/desa/profil/profil-desa/${lambang.id}/lambang_desa`)}
                  >
                    Edit
                  </Button>
@@ -180,7 +180,7 @@ function Page() {
                    variant="light"
                    leftSection={<IconEdit size={18} stroke={2} />}
                    radius="md"
-                    onClick={() => router.push(`/admin/desa/profile/profile-desa/${maskot.id}/maskot_desa`)}
+                    onClick={() => router.push(`/admin/desa/profil/profil-desa/${maskot.id}/maskot_desa`)}
                  >
                    Edit
                  </Button>
--- a/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/[id]/edit/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/[id]/edit/page.tsx
@@ -117,7 +117,7 @@ function EditPerbekelDariMasaKeMasa() {

      await state.update.update();
      toast.success('Perbekel dari masa ke masa berhasil diperbarui!');
-      router.push('/admin/desa/profile/profile-perbekel-dari-masa-ke-masa');
+      router.push('/admin/desa/profil/profil-perbekel-dari-masa-ke-masa');
    } catch (error) {
      console.error('Error updating perbekel dari masa ke masa:', error);
      toast.error('Terjadi kesalahan saat memperbarui perbekel dari masa ke masa');
--- a/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/[id]/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/[id]/page.tsx
@@ -25,7 +25,7 @@ function DetailPerbekelDariMasa() {
      state.delete.byId(selectedId);
      setModalHapus(false);
      setSelectedId(null);
-      router.push("/admin/desa/profile/profile-perbekel-dari-masa-ke-masa");
+      router.push("/admin/desa/profil/profil-perbekel-dari-masa-ke-masa");
    }
  };

@@ -113,7 +113,7 @@ function DetailPerbekelDariMasa() {

                  <Button
                    color="green"
-                    onClick={() => router.push(`/admin/desa/profile/profile-perbekel-dari-masa-ke-masa/${data.id}/edit`)}
+                    onClick={() => router.push(`/admin/desa/profil/profil-perbekel-dari-masa-ke-masa/${data.id}/edit`)}
                    variant="light"
                    radius="md"
                    size="md"
--- a/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/create/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/create/page.tsx
@@ -46,7 +46,7 @@ function CreatePerbekelDariMasaKeMasa() {
      state.create.form.imageId = uploaded.id;
      await state.create.create();
      resetForm();
-      router.push('/admin/desa/profile/profile-perbekel-dari-masa-ke-masa');
+      router.push('/admin/desa/profil/profil-perbekel-dari-masa-ke-masa');
    } catch (error) {
      console.error(error);
      toast.error('Gagal menambahkan perbekel dari masa ke masa');
--- a/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-perbekel-dari-masa-ke-masa/page.tsx
@@ -53,7 +53,7 @@ function ListPerbekelDariMasaKeMasa({ search }: { search: string }) {
              leftSection={<IconPlus size={18} />}
              color="blue"
              variant="light"
-              onClick={() => router.push('/admin/desa/profile/profile-perbekel-dari-masa-ke-masa/create')}
+              onClick={() => router.push('/admin/desa/profil/profil-perbekel-dari-masa-ke-masa/create')}
            >
              Tambah Baru
            </Button>
@@ -90,7 +90,7 @@ function ListPerbekelDariMasaKeMasa({ search }: { search: string }) {
                          variant="light"
                          color="blue"
                          leftSection={<IconDeviceImacCog size={16} />}
-                          onClick={() => router.push(`/admin/desa/profile/profile-perbekel-dari-masa-ke-masa/${item.id}`)}
+                          onClick={() => router.push(`/admin/desa/profil/profil-perbekel-dari-masa-ke-masa/${item.id}`)}
                        >
                          Detail
                        </Button>
--- a/src/app/admin/(dashboard)/desa/profile/profile-perbekel/[id]/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-perbekel/[id]/page.tsx
@@ -25,7 +25,7 @@ function ProfilePerbekel() {
      const id = params?.id as string;
      if (!id) {
        toast.error("ID tidak valid");
-        router.push("/admin/desa/profile/profile-perbekel");
+        router.push("/admin/desa/profil/profil-perbekel");
        return;
      }

@@ -74,7 +74,7 @@ function ProfilePerbekel() {
      const success = await perbekelState.edit.submit()
      if (success) {
        toast.success("Data berhasil disimpan");
-        router.push("/admin/desa/profile/profile-perbekel");
+        router.push("/admin/desa/profil/profil-perbekel");
      }
    } catch (error) {
      console.error("Error update sejarah desa:", error);
--- a/src/app/admin/(dashboard)/desa/profile/profile-perbekel/page.tsx
+++ b/src/app/admin/(dashboard)/desa/profile/profile-perbekel/page.tsx
@@ -41,7 +41,7 @@ function Page() {
                variant="light"
                leftSection={<IconEdit size={18} stroke={2} />}
                radius="md"
-                onClick={() => router.push(`/admin/desa/profile/profile-perbekel/${perbekel.id}`)}
+                onClick={() => router.push(`/admin/desa/profil/profil-perbekel/${perbekel.id}`)}
              >
                Edit
              </Button>
--- a/src/app/admin/_com/list_PageAdmin.tsx
+++ b/src/app/admin/_com/list_PageAdmin.tsx
@@ -91,8 +91,8 @@ export const devBar = [
    children: [
      {
        id: "Desa_1",
-        name: "Profile",
-        path: "/admin/desa/profile/profile-desa"
+        name: "Profil",
+        path: "/admin/desa/profil/profil-desa"
      },
      {
        id: "Desa_2",
@@ -495,8 +495,8 @@ export const navBar = [
    children: [
      {
        id: "Desa_1",
-        name: "Profile",
-        path: "/admin/desa/profile/profile-desa"
+        name: "Profil",
+        path: "/admin/desa/profil/profil-desa"
      },
      {
        id: "Desa_2",
@@ -899,8 +899,8 @@ export const role1 = [
    children: [
      {
        id: "Desa_1",
-        name: "Profile",
-        path: "/admin/desa/profile/profile-desa"
+        name: "Profil",
+        path: "/admin/desa/profil/profil-desa"
      },
      {
        id: "Desa_2",
--- a/src/app/darmasaba/(pages)/desa/profile/_com/BackButto.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/_com/BackButto.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/page.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/page.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/struktur-perangkat-desa/[id]/page.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/struktur-perangkat-desa/[id]/page.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/struktur-perangkat-desa/page.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/struktur-perangkat-desa/page.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/struktur-perangkat-desa/struktur.css
+++ b/src/app/darmasaba/(pages)/desa/profile/struktur-perangkat-desa/struktur.css
--- a/src/app/darmasaba/(pages)/desa/profile/ui/lambangDesa.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/lambangDesa.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/maskotDesa.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/maskotDesa.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/motoDesa.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/motoDesa.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/profilPerbekel.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/profilPerbekel.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/profileDesa.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/profileDesa.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/sejarahDesa.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/sejarahDesa.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/semuaPerbekel.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/semuaPerbekel.tsx
--- a/src/app/darmasaba/(pages)/desa/profile/ui/visimisiDesa.tsx
+++ b/src/app/darmasaba/(pages)/desa/profile/ui/visimisiDesa.tsx
--- a/src/app/darmasaba/(pages)/ppid/profile-ppid/page.tsx
+++ b/src/app/darmasaba/(pages)/ppid/profile-ppid/page.tsx
--- a/src/app/darmasaba/_com/main-page/kepuasan/index.tsx
+++ b/src/app/darmasaba/_com/main-page/kepuasan/index.tsx
@@ -179,26 +179,61 @@ function Kepuasan() {
          <Paper p={"lg"} bg={colors.Bg}>
            <Paper p={"lg"}>
              <Stack gap={"xs"}>
-                <Flex justify={"space-between"} align={"center"}>
-                  <Text fw={"bold"}>Pelayanan Terhadap Publik Desa Darmasaba</Text>
-                  <Box>
-                    <Text fz={"sm"} fw={"bold"} c={colors["blue-button"]}>Total Responden</Text>
-                    <Text ta={"end"} fz={"h1"} fw={"bold"} c={colors["blue-button"]}>
+                <Flex
+                  direction={{ base: "column", sm: "row" }}
+                  justify="space-between"
+                  align={{ base: "flex-start", sm: "center" }}
+                  gap={{ base: "xs", sm: "md" }} // 👈 Tambahkan gap untuk memberi ruang
+                >
+                  <Text
+                    fw="bold"
+                    ta={{ base: "center", sm: "left" }}
+                    fz={{ base: "sm", sm: "md" }} // 👈 Atur ukuran font agar lebih proporsional di mobile
+                  >
+                    Pelayanan Terhadap Publik Desa Darmasaba
+                  </Text>
+                  <Box
+                    mt={{ base: "sm", sm: 0 }}
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'column',
+                      alignItems: 'flex-end', // 👈 Pastikan teks dan angka sejajar ke kanan
+                      textAlign: 'right', // 👈 Agar teks rata kanan
+                    }}
+                  >
+                    <Text fz={{ base: "xs", sm: "sm" }} fw={"bold"} c={colors["blue-button"]}>
+                      Total Responden
+                    </Text>
+                    <Text
+                      ta="end"
+                      fz={{ base: "h2", sm: "h1" }} // 👈 Ukuran font lebih kecil di mobile
+                      fw={"bold"}
+                      c={colors["blue-button"]}
+                    >
                      {state.findMany.total.toLocaleString('id-ID')}
                    </Text>
                  </Box>
                </Flex>
-                <BarChart
-                  h={window.innerWidth < 480 ? 200 : 300}
-                  data={barChartData}
-                  dataKey="month"
-                  series={[{ name: 'Responden', color: colors['blue-button'] }]}
-                  tickLine="y"
-                  xAxisLabel="Bulan"
-                  yAxisLabel="Jumlah Responden"
-                  withTooltip
-                  tooltipAnimationDuration={200}
-                />
+                <Box style={{ overflowX: 'auto', width: '100%' }}>
+                  <BarChart
+                    h={300}
+                    data={barChartData}
+                    dataKey="month"
+                    series={[{ name: 'Responden', color: colors['blue-button'] }]}
+                    tickLine="y"
+                    xAxisLabel="Bulan"
+                    yAxisLabel="Jumlah Responden"
+                    withTooltip
+                    tooltipAnimationDuration={200}
+                    xAxisProps={{
+                      angle: -45,
+                      textAnchor: 'end',
+                      fontSize: 12,
+                    }}
+                    // 👇 Tambahkan ini agar chart punya lebar minimum yang cukup untuk semua bar
+                    style={{ minWidth: 'fit-content' }}
+                  />
+                </Box>
              </Stack>
            </Paper>
            <Box py={"xl"}>
@@ -443,34 +478,62 @@ function Kepuasan() {
      </Container>
      <Box px={"md"}>
        <Paper p={"lg"} bg={colors.Bg}>
-          <Paper p={"lg"}>
+          <Paper p={"lg"} >
            <Stack gap={"xs"}>
              <Flex
                direction={{ base: "column", sm: "row" }}
                justify="space-between"
                align={{ base: "flex-start", sm: "center" }}
+                gap={{ base: "xs", sm: "md" }} // 👈 Tambahkan gap untuk memberi ruang
              >
-                <Text fw="bold" ta={{ base: "center", sm: "left" }}>
+                <Text
+                  fw="bold"
+                  ta={{ base: "center", sm: "left" }}
+                  fz={{ base: "sm", sm: "md" }} // 👈 Atur ukuran font agar lebih proporsional di mobile
+                >
                  Pelayanan Terhadap Publik Desa Darmasaba
                </Text>
-                <Box mt={{ base: "sm", sm: 0 }}>
-                  <Text fz={"sm"} fw={"bold"} c={colors["blue-button"]}>Total Responden</Text>
-                  <Text ta={"end"} fz={"h1"} fw={"bold"} c={colors["blue-button"]}>
+                <Box
+                  mt={{ base: "sm", sm: 0 }}
+                  style={{
+                    display: 'flex',
+                    flexDirection: 'column',
+                    alignItems: 'flex-end', // 👈 Pastikan teks dan angka sejajar ke kanan
+                    textAlign: 'right', // 👈 Agar teks rata kanan
+                  }}
+                >
+                  <Text fz={{ base: "xs", sm: "sm" }} fw={"bold"} c={colors["blue-button"]}>
+                    Total Responden
+                  </Text>
+                  <Text
+                    ta="end"
+                    fz={{ base: "h2", sm: "h1" }} // 👈 Ukuran font lebih kecil di mobile
+                    fw={"bold"}
+                    c={colors["blue-button"]}
+                  >
                    {state.findMany.total.toLocaleString('id-ID')}
                  </Text>
                </Box>
              </Flex>
-              <BarChart
-                h={300}
-                data={barChartData}
-                dataKey="month"
-                series={[{ name: 'Responden', color: colors['blue-button'] }]}
-                tickLine="y"
-                xAxisLabel="Bulan"
-                yAxisLabel="Jumlah Responden"
-                withTooltip
-                tooltipAnimationDuration={200}
-              />
+              <Box style={{ overflowX: 'auto', width: '100%' }} pb={50}>
+                <BarChart
+                  h={300}
+                  data={barChartData}
+                  dataKey="month"
+                  series={[{ name: 'Responden', color: colors['blue-button'] }]}
+                  tickLine="y"
+                  xAxisLabel=""
+                  yAxisLabel="Jumlah Responden"
+                  withTooltip
+                  tooltipAnimationDuration={200}
+                  xAxisProps={{
+                    angle: -45,
+                    textAnchor: 'end',
+                    fontSize: 12,
+                  }}
+                  style={{ minWidth: 'fit-content' }}
+                />
+              </Box>
            </Stack>
          </Paper>
          <Box py={"xl"}>
@@ -499,7 +562,7 @@ function Kepuasan() {
                              withLabels
                              withTooltip
                              labelsPosition="inside"
-                          
+
                              labelsType="percent"
                              size={200}
                              data={donutDataJenisKelamin}
@@ -537,7 +600,7 @@ function Kepuasan() {
                              withTooltip
                              tooltipAnimationDuration={200}
                              withLabels
-                          
+
                              labelsPosition="inside"
                              labelsType="percent"
                              withLabelsLine
@@ -581,7 +644,7 @@ function Kepuasan() {
                              withTooltip
                              tooltipAnimationDuration={200}
                              withLabels
-                              
+
                              labelsPosition="inside"
                              labelsType="percent"
                              withLabelsLine
--- a/src/con/navbar-list-menu.ts
+++ b/src/con/navbar-list-menu.ts
@@ -5,8 +5,8 @@ const navbarListMenu = [
        children: [
            {
                id: "1.1",
-                name: "Profile PPID",
-                href: "/darmasaba/ppid/profile-ppid"
+                name: "Profil PPID",
+                href: "/darmasaba/ppid/profil-ppid"
            },
            {
                id: "1.2",
@@ -53,8 +53,8 @@ const navbarListMenu = [
        children: [
            {
                id: "2.1",
-                name: "Profile",
-                href: "/darmasaba/desa/profile"
+                name: "Profil",
+                href: "/darmasaba/desa/profil"
            },
            {
                id: "2.2",