Semua tooltips di admin sudah dihilangkan

src/app/admin/(dashboard)/pendidikan/beasiswa-desa/_lib/layoutTabs.tsx

@@ -1,10 +1,10 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
+import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
+import { IconSchool, IconStar } from '@tabler/icons-react';
 import { usePathname, useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
-import { IconSchool, IconStar } from '@tabler/icons-react';
 
 function LayoutTabs({ children }: { children: React.ReactNode }) {
   const router = useRouter();
@@ -15,15 +15,13 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
       label: "Beasiswa Pendaftar",
       value: "beasiswa-pendaftar",
       href: "/admin/pendidikan/beasiswa-desa/beasiswa-pendaftar",
-      icon: <IconSchool size={18} stroke={1.8} />,
-      tooltip: "Kelola data pendaftar beasiswa desa",
+      icon: <IconSchool size={18} stroke={1.8} />
     },
     {
       label: "Keunggulan Program",
       value: "keunggulan-program",
       href: "/admin/pendidikan/beasiswa-desa/keunggulan-program",
-      icon: <IconStar size={18} stroke={1.8} />,
-      tooltip: "Lihat keunggulan dan detail program beasiswa",
+      icon: <IconStar size={18} stroke={1.8} />
     },
   ];
 
@@ -69,28 +67,21 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
               flexWrap: "nowrap",
               gap: "0.5rem",
               paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
-          }}
+            }}
           >
             {tabs.map((tab, i) => (
-              <Tooltip
+              <TabsTab
                 key={i}
-                label={tab.tooltip}
-                position="bottom"
-                withArrow
-                transitionProps={{ transition: 'pop', duration: 200 }}
+                value={tab.value}
+                leftSection={tab.icon}
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.9rem",
+                  transition: "all 0.2s ease",
+                }}
               >
-                <TabsTab
-                  value={tab.value}
-                  leftSection={tab.icon}
-                  style={{
-                    fontWeight: 600,
-                    fontSize: "0.9rem",
-                    transition: "all 0.2s ease",
-                  }}
-                >
-                  {tab.label}
-                </TabsTab>
-              </Tooltip>
+                {tab.label}
+              </TabsTab>
             ))}
           </TabsList>
         </ScrollArea>

src/app/admin/(dashboard)/pendidikan/beasiswa-desa/beasiswa-pendaftar/[id]/page.tsx

@@ -2,7 +2,7 @@
 import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus';
 import beasiswaDesaState from '@/app/admin/(dashboard)/_state/pendidikan/beasiswa-desa';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Skeleton, Stack, Text, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Skeleton, Stack, Text } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack, IconTrash } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -121,20 +121,18 @@ function DetailBeasiswaPendaftar() {
               </Box>
 
               <Group gap="sm" mt="md">
-                <Tooltip label="Hapus Pendaftar" withArrow position="top">
-                  <Button
-                    color="red"
-                    onClick={() => {
-                      setSelectedId(data.id);
-                      setModalHapus(true);
-                    }}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconTrash size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="red"
+                  onClick={() => {
+                    setSelectedId(data.id);
+                    setModalHapus(true);
+                  }}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconTrash size={20} />
+                </Button>
               </Group>
             </Stack>
           </Paper>

src/app/admin/(dashboard)/pendidikan/beasiswa-desa/keunggulan-program/[id]/page.tsx

@@ -3,7 +3,7 @@
 import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
 import beasiswaDesaState from '@/app/admin/(dashboard)/_state/pendidikan/beasiswa-desa';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
@@ -58,7 +58,7 @@ function EditProgramKreatifDesa() {
         judul: formData.judul.trim(),
         deskripsi: formData.deskripsi.trim(),
       };
-      
+
       await state.update.update();
       toast.success('Data keunggulan program berhasil diperbarui!');
       router.push("/admin/pendidikan/beasiswa-desa/keunggulan-program");
@@ -70,16 +70,14 @@ function EditProgramKreatifDesa() {
   return (
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button 
-            variant="subtle" 
-            onClick={() => router.back()} 
-            p="xs" 
-            radius="md"
-          >
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button
+          variant="subtle"
+          onClick={() => router.back()}
+          p="xs"
+          radius="md"
+        >
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Keunggulan Program
         </Title>

src/app/admin/(dashboard)/pendidikan/beasiswa-desa/keunggulan-program/create/page.tsx

@@ -2,7 +2,7 @@
 import CreateEditor from '@/app/admin/(dashboard)/_com/createEditor';
 import beasiswaDesaState from '@/app/admin/(dashboard)/_state/pendidikan/beasiswa-desa';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useProxy } from 'valtio/utils';
@@ -34,16 +34,14 @@ function CreateKeunggulanProgram() {
   return (
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button
-            variant="subtle"
-            onClick={() => router.back()}
-            p="xs"
-            radius="md"
-          >
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button
+          variant="subtle"
+          onClick={() => router.back()}
+          p="xs"
+          radius="md"
+        >
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Keunggulan Program
         </Title>

src/app/admin/(dashboard)/pendidikan/beasiswa-desa/keunggulan-program/page.tsx

@@ -16,8 +16,7 @@ import {
   TableThead,
   TableTr,
   Text,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit, IconPlus, IconSearch, IconTrashFilled } from '@tabler/icons-react';
@@ -25,8 +24,8 @@ import { useRouter } from 'next/navigation';
 import { useState } from 'react';
 import { useProxy } from 'valtio/utils';
 import HeaderSearch from '../../../_com/header';
-import beasiswaDesaState from '../../../_state/pendidikan/beasiswa-desa';
 import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
+import beasiswaDesaState from '../../../_state/pendidikan/beasiswa-desa';
 
 function KeunggulanProgram() {
   const [search, setSearch] = useState("");
@@ -79,30 +78,28 @@ function ListKeunggulanProgram({ search }: { search: string }) {
       <Paper withBorder bg={colors['white-1']} p="lg" shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>Daftar Keunggulan Program</Title>
-          <Tooltip label="Tambah Keunggulan Program" withArrow>
-            <Button
-              leftSection={<IconPlus size={18} />}
-              color="blue"
-              variant="light"
-              onClick={() =>
-                router.push(
-                  '/admin/pendidikan/beasiswa-desa/keunggulan-program/create'
-                )
-              }
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() =>
+              router.push(
+                '/admin/pendidikan/beasiswa-desa/keunggulan-program/create'
+              )
+            }
+          >
+            Tambah Baru
+          </Button>
         </Group>
 
         <Box style={{ overflowX: 'auto' }}>
           <Table highlightOnHover>
             <TableThead>
               <TableTr>
-              <TableTh style={{ minWidth: 200 }}>Nama Keunggulan Program</TableTh>
-              <TableTh style={{ minWidth: 200 }}>Deskripsi</TableTh>
-              <TableTh style={{ minWidth: 200 }}>Edit</TableTh>
-              <TableTh style={{ minWidth: 200 }}>Delete</TableTh>
+                <TableTh style={{ minWidth: 200 }}>Nama Keunggulan Program</TableTh>
+                <TableTh style={{ minWidth: 200 }}>Deskripsi</TableTh>
+                <TableTh style={{ minWidth: 200 }}>Edit</TableTh>
+                <TableTh style={{ minWidth: 200 }}>Delete</TableTh>
               </TableTr>
             </TableThead>
             <TableTbody>
@@ -123,35 +120,31 @@ function ListKeunggulanProgram({ search }: { search: string }) {
                       />
                     </TableTd>
                     <TableTd style={{ minWidth: 200 }}>
-                      <Tooltip label="Edit" withArrow>
-                        <Button
-                          variant="light"
-                          color="green"
-                          size="sm"
-                          onClick={() =>
-                            router.push(
-                              `/admin/pendidikan/beasiswa-desa/keunggulan-program/${item.id}`
-                            )
-                          }
-                        >
-                          <IconEdit size={18} />
-                        </Button>
-                      </Tooltip>
+                      <Button
+                        variant="light"
+                        color="green"
+                        size="sm"
+                        onClick={() =>
+                          router.push(
+                            `/admin/pendidikan/beasiswa-desa/keunggulan-program/${item.id}`
+                          )
+                        }
+                      >
+                        <IconEdit size={18} />
+                      </Button>
                     </TableTd>
                     <TableTd style={{ minWidth: 200 }}>
-                      <Tooltip label="Hapus" withArrow>
-                        <Button
-                          variant="light"
-                          color="red"
-                          size="sm"
-                          onClick={() => {
-                            setSelectedId(item.id);
-                            setModalHapus(true);
-                          }}
-                        >
-                          <IconTrashFilled size={18} />
-                        </Button>
-                      </Tooltip>
+                      <Button
+                        variant="light"
+                        color="red"
+                        size="sm"
+                        onClick={() => {
+                          setSelectedId(item.id);
+                          setModalHapus(true);
+                        }}
+                      >
+                        <IconTrashFilled size={18} />
+                      </Button>
                     </TableTd>
                   </TableTr>
                 ))

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/_lib/layoutTabs.tsx

@@ -1,10 +1,10 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
+import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
+import { IconBuildingCommunity, IconCalendar, IconSchool } from '@tabler/icons-react';
 import { usePathname, useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
-import { IconSchool, IconCalendar, IconBuildingCommunity } from '@tabler/icons-react';
 
 function LayoutTabs({ children }: { children: React.ReactNode }) {
   const router = useRouter();
@@ -15,22 +15,19 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
       label: "Tujuan Program",
       value: "tujuan-program",
       href: "/admin/pendidikan/bimbingan-belajar-desa/tujuan-program",
-      icon: <IconSchool size={18} stroke={1.8} />,
-      tooltip: "Lihat tujuan utama program bimbingan belajar",
+      icon: <IconSchool size={18} stroke={1.8} />
     },
     {
       label: "Lokasi dan Jadwal",
       value: "lokasi-dan-jadwal",
       href: "/admin/pendidikan/bimbingan-belajar-desa/lokasi-dan-jadwal",
       icon: <IconCalendar size={18} stroke={1.8} />,
-      tooltip: "Atur lokasi pelaksanaan dan jadwal bimbingan",
     },
     {
       label: "Fasilitas yang Disediakan",
       value: "fasilitas-yang-disediakan",
       href: "/admin/pendidikan/bimbingan-belajar-desa/fasilitas-yang-disediakan",
-      icon: <IconBuildingCommunity size={18} stroke={1.8} />,
-      tooltip: "Kelola fasilitas yang tersedia untuk peserta",
+      icon: <IconBuildingCommunity size={18} stroke={1.8} />
     },
   ];
 
@@ -76,28 +73,21 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
               flexWrap: "nowrap",
               gap: "0.5rem",
               paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
-          }}
+            }}
           >
             {tabs.map((tab, i) => (
-              <Tooltip
+              <TabsTab
                 key={i}
-                label={tab.tooltip}
-                position="bottom"
-                withArrow
-                transitionProps={{ transition: 'pop', duration: 200 }}
+                value={tab.value}
+                leftSection={tab.icon}
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.9rem",
+                  transition: "all 0.2s ease",
+                }}
               >
-                <TabsTab
-                  value={tab.value}
-                  leftSection={tab.icon}
-                  style={{
-                    fontWeight: 600,
-                    fontSize: "0.9rem",
-                    transition: "all 0.2s ease",
-                  }}
-                >
-                  {tab.label}
-                </TabsTab>
-              </Tooltip>
+                {tab.label}
+              </TabsTab>
             ))}
           </TabsList>
         </ScrollArea>

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/fasilitas-yang-disediakan/edit/page.tsx

@@ -11,16 +11,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const BimbinganBelajarDesaTextEditor = dynamic(
   () =>
@@ -103,16 +102,14 @@ function EditFasilitasYangDisediakan() {
     <Box>
       <Stack gap="xs">
         <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={24} />
-            </Button>
-          </Tooltip>
+          <Button
+            variant="subtle"
+            onClick={handleBack}
+            p="xs"
+            radius="md"
+          >
+            <IconArrowBack color={colors['blue-button']} size={24} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Fasilitas Yang Disediakan
           </Title>

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/fasilitas-yang-disediakan/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -36,21 +36,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Fasilitas" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/bimbingan-belajar-desa/fasilitas-yang-disediakan/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/bimbingan-belajar-desa/fasilitas-yang-disediakan/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/lokasi-dan-jadwal/edit/page.tsx

@@ -11,16 +11,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const BimbinganBelajarDesaTextEditor = dynamic(
   () =>
@@ -102,13 +101,15 @@ function EditLokasiDanJadwal() {
   return (
     <Box>
       <Stack gap="xs">
-        {/* Header */}
         <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={24} />
-            </Button>
-          </Tooltip>
+          <Button
+            variant="subtle"
+            onClick={handleBack}
+            p="xs"
+            radius="md"
+          >
+            <IconArrowBack color={colors['blue-button']} size={24} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Lokasi & Jadwal
           </Title>

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/lokasi-dan-jadwal/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -36,21 +36,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Lokasi & Jadwal" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/bimbingan-belajar-desa/lokasi-dan-jadwal/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/bimbingan-belajar-desa/lokasi-dan-jadwal/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/tujuan-program/edit/page.tsx

@@ -11,16 +11,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const BimbinganBelajarDesaTextEditor = dynamic(
   () =>
@@ -99,11 +98,9 @@ function EditTujuanProgram() {
     <Box>
       <Stack gap="xs">
         <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={24} />
-            </Button>
-          </Tooltip>
+          <Button variant="subtle" onClick={handleBack} p="xs" radius="md">
+            <IconArrowBack color={colors['blue-button']} size={24} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Tujuan Program
           </Title>

src/app/admin/(dashboard)/pendidikan/bimbingan-belajar-desa/tujuan-program/page.tsx

@@ -10,8 +10,7 @@ import {
   Skeleton,
   Stack,
   Text,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
@@ -48,21 +47,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Tujuan Program" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/bimbingan-belajar-desa/tujuan-program/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/bimbingan-belajar-desa/tujuan-program/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

src/app/admin/(dashboard)/pendidikan/data-pendidikan/[id]/page.tsx

@@ -2,7 +2,7 @@
 'use client'
 
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
@@ -51,11 +51,9 @@ export default function EditDataPendidikan() {
   return (
     <Box px={{ base: 'sm', md: 'xl' }} py="md">
       <Group mb="md" gap="sm">
-        <Tooltip label="Kembali ke halaman sebelumnya" position="bottom" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} radius="md">
-            <IconArrowBack size={20} stroke={2} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} radius="md">
+          <IconArrowBack size={20} stroke={2} />
+        </Button>
         <Title order={3} c="black">Edit Data Pendidikan</Title>
       </Group>
 

src/app/admin/(dashboard)/pendidikan/data-pendidikan/create/page.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
@@ -31,11 +31,9 @@ export default function CreateDataPendidikan() {
   return (
     <Box px={{ base: 'sm', md: 'xl' }} py="md">
       <Group mb="md" gap="sm">
-        <Tooltip label="Kembali ke halaman sebelumnya" position="bottom" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} radius="md">
-            <IconArrowBack size={20} stroke={2} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} radius="md">
+          <IconArrowBack size={20} stroke={2} />
+        </Button>
         <Title order={3} c='black'>Tambah Data Pendidikan</Title>
       </Group>
 

src/app/admin/(dashboard)/pendidikan/data-pendidikan/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconDatabase, IconEdit, IconPlus, IconSearch, IconTrash } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -80,13 +80,11 @@ function ListDataPendidikan({ search }: { search: string }) {
     <Box py="sm">
       <Stack gap="sm">
         <Paper p="md" withBorder bg={colors['white-1']} shadow="sm" radius="md">
-        <Group justify="space-between" mb="md">
+          <Group justify="space-between" mb="md">
             <Title order={4}>Daftar Data Pendidikan</Title>
-            <Tooltip label="Tambah Data Pendidikan" withArrow>
-              <Button leftSection={<IconPlus size={18} />} color="blue" variant="light" onClick={() => router.push('/admin/pendidikan/data-pendidikan/create')}>
-                Tambah Baru
-              </Button>
-            </Tooltip>
+            <Button leftSection={<IconPlus size={18} />} color="blue" variant="light" onClick={() => router.push('/admin/pendidikan/data-pendidikan/create')}>
+              Tambah Baru
+            </Button>
           </Group>
           {filteredData.length === 0 ? (
             <Box py="lg" px="md" style={{ textAlign: 'center' }}>
@@ -111,32 +109,28 @@ function ListDataPendidikan({ search }: { search: string }) {
                     <TableTd>{item.name}</TableTd>
                     <TableTd>{item.jumlah}</TableTd>
                     <TableTd>
-                      <Tooltip label="Edit data pendidikan" position="top" withArrow>
-                        <Button
-                          color="green"
-                          variant="light"
-                          radius="md"
-                          onClick={() => router.push(`/admin/pendidikan/data-pendidikan/${item.id}`)}
-                        >
-                          <IconEdit size={20} />
-                        </Button>
-                      </Tooltip>
+                      <Button
+                        color="green"
+                        variant="light"
+                        radius="md"
+                        onClick={() => router.push(`/admin/pendidikan/data-pendidikan/${item.id}`)}
+                      >
+                        <IconEdit size={20} />
+                      </Button>
                     </TableTd>
                     <TableTd>
-                      <Tooltip label="Hapus data pendidikan" position="top" withArrow>
-                        <Button
-                          color="red"
-                          variant="light"
-                          radius="md"
-                          disabled={stateDPM.delete.loading}
-                          onClick={() => {
-                            setSelectedId(item.id);
-                            setModalHapus(true);
-                          }}
-                        >
-                          <IconTrash size={20} />
-                        </Button>
-                      </Tooltip>
+                      <Button
+                        color="red"
+                        variant="light"
+                        radius="md"
+                        disabled={stateDPM.delete.loading}
+                        onClick={() => {
+                          setSelectedId(item.id);
+                          setModalHapus(true);
+                        }}
+                      >
+                        <IconTrash size={20} />
+                      </Button>
                     </TableTd>
                   </TableTr>
                 ))}

src/app/admin/(dashboard)/pendidikan/info-sekolah/_lib/layoutTabs.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
+import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
 import { IconBuilding, IconChalkboard, IconMicroscope, IconSchool } from '@tabler/icons-react';
 import { usePathname, useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
@@ -15,29 +15,25 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
       label: "Jenjang Pendidikan",
       value: "jenjangPendidikan",
       href: "/admin/pendidikan/info-sekolah/jenjang-pendidikan",
-      icon: <IconBuilding size={18} stroke={1.8} />,
-      tooltip: "Lihat dan kelola jenjang pendidikan",
+      icon: <IconBuilding size={18} stroke={1.8} />
     },
     {
       label: "Lembaga",
       value: "lembaga",
       href: "/admin/pendidikan/info-sekolah/lembaga",
       icon: <IconChalkboard size={18} stroke={1.8} />,
-      tooltip: "Lihat dan kelola lembaga",
     },
     {
       label: "Siswa",
       value: "siswa",
       href: "/admin/pendidikan/info-sekolah/siswa",
       icon: <IconSchool size={18} stroke={1.8} />,
-      tooltip: "Lihat dan kelola siswa",
     },
     {
       label: "Pengajar",
       value: "pengajar",
       href: "/admin/pendidikan/info-sekolah/pengajar",
       icon: <IconMicroscope size={18} stroke={1.8} />,
-      tooltip: "Lihat dan kelola pengajar",
     }
   ];
 
@@ -83,22 +79,21 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
               flexWrap: "nowrap",
               gap: "0.5rem",
               paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
-          }}
+            }}
           >
             {tabs.map((tab, i) => (
-              <Tooltip key={i} label={tab.tooltip} position="bottom" withArrow transitionProps={{ transition: 'pop', duration: 200 }}>
-                <TabsTab
-                  value={tab.value}
-                  leftSection={tab.icon}
-                  style={{
-                    fontWeight: 600,
-                    fontSize: "0.9rem",
-                    transition: "all 0.2s ease",
-                  }}
-                >
-                  {tab.label}
-                </TabsTab>
-              </Tooltip>
+              <TabsTab
+                key={i}
+                value={tab.value}
+                leftSection={tab.icon}
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.9rem",
+                  transition: "all 0.2s ease",
+                }}
+              >
+                {tab.label}
+              </TabsTab>
             ))}
           </TabsList>
         </ScrollArea>

src/app/admin/(dashboard)/pendidikan/info-sekolah/jenjang-pendidikan/[id]/page.tsx

@@ -10,8 +10,7 @@ import {
   Paper,
   Stack,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -80,11 +79,9 @@ function EditJenjangPendidikan() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Jenjang Pendidikan
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/jenjang-pendidikan/create/page.tsx

@@ -8,8 +8,7 @@ import {
   Paper,
   Stack,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -46,16 +45,14 @@ function CreateJenjangPendidikan() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Back button + Title */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button
-            variant="subtle"
-            onClick={() => router.back()}
-            p="xs"
-            radius="md"
-          >
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button
+          variant="subtle"
+          onClick={() => router.back()}
+          p="xs"
+          radius="md"
+        >
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Jenjang Pendidikan
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/jenjang-pendidikan/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit, IconPlus, IconX } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -68,16 +68,14 @@ function ListJenjangPendidikan() {
       <Paper bg={colors['white-1']} p="lg" withBorder shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>Daftar Jenjang Pendidikan</Title>
-          <Tooltip label="Tambah Jenjang Pendidikan" withArrow>
-            <Button
-              leftSection={<IconPlus size={18} />}
-              color="blue"
-              variant="light"
-              onClick={() => router.push('/admin/pendidikan/info-sekolah/jenjang-pendidikan/create')}
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() => router.push('/admin/pendidikan/info-sekolah/jenjang-pendidikan/create')}
+          >
+            Tambah Baru
+          </Button>
         </Group>
 
         <Box style={{ overflowX: "auto" }}>

src/app/admin/(dashboard)/pendidikan/info-sekolah/lembaga/[id]/edit/page.tsx

@@ -1,8 +1,8 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client';
 
-import { useEffect, useState } from 'react';
-import { useParams, useRouter } from 'next/navigation';
+import infoSekolahPaud from '@/app/admin/(dashboard)/_state/pendidikan/info-sekolah-paud';
+import colors from '@/con/colors';
 import {
   Box,
   Button,
@@ -11,14 +11,13 @@ import {
   Select,
   Stack,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
+import { IconArrowBack } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
 import { toast } from 'react-toastify';
 import { useProxy } from 'valtio/utils';
-import infoSekolahPaud from '@/app/admin/(dashboard)/_state/pendidikan/info-sekolah-paud';
-import colors from '@/con/colors';
-import { IconArrowBack } from '@tabler/icons-react';
 
 export default function EditLembaga() {
   const router = useRouter();
@@ -73,16 +72,14 @@ export default function EditLembaga() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button
-            variant="subtle"
-            onClick={() => router.back()}
-            p="xs"
-            radius="md"
-          >
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button
+          variant="subtle"
+          onClick={() => router.back()}
+          p="xs"
+          radius="md"
+        >
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Lembaga Pendidikan
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/lembaga/[id]/page.tsx

@@ -1,14 +1,14 @@
 'use client'
-import { useProxy } from 'valtio/utils';
-import { Box, Button, Group, Paper, Skeleton, Stack, Text, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Skeleton, Stack, Text } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack, IconEdit, IconTrash } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
 import { useState } from 'react';
+import { useProxy } from 'valtio/utils';
 
-import colors from '@/con/colors';
 import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus';
 import infoSekolahPaud from '@/app/admin/(dashboard)/_state/pendidikan/info-sekolah-paud';
+import colors from '@/con/colors';
 
 function DetailLembaga() {
   const detailState = useProxy(infoSekolahPaud.lembagaPendidikan);
@@ -87,34 +87,30 @@ function DetailLembaga() {
               </Box>
 
               <Group gap="sm">
-                <Tooltip label="Hapus Lembaga" withArrow position="top">
-                  <Button
-                    color="red"
-                    onClick={() => {
-                      setSelectedId(data.id);
-                      setModalHapus(true);
-                    }}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconTrash size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="red"
+                  onClick={() => {
+                    setSelectedId(data.id);
+                    setModalHapus(true);
+                  }}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconTrash size={20} />
+                </Button>
 
-                <Tooltip label="Edit Lembaga" withArrow position="top">
-                  <Button
-                    color="green"
-                    onClick={() =>
-                      router.push(`/admin/pendidikan/info-sekolah/lembaga/${data.id}/edit`)
-                    }
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconEdit size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="green"
+                  onClick={() =>
+                    router.push(`/admin/pendidikan/info-sekolah/lembaga/${data.id}/edit`)
+                  }
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconEdit size={20} />
+                </Button>
               </Group>
             </Stack>
           </Paper>

src/app/admin/(dashboard)/pendidikan/info-sekolah/lembaga/create/page.tsx

@@ -10,8 +10,7 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -45,11 +44,9 @@ function CreateLembaga() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Lembaga Pendidikan
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/lembaga/page.tsx

@@ -16,8 +16,7 @@ import {
   TableThead,
   TableTr,
   Text,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconDeviceImac, IconPlus, IconSearch } from '@tabler/icons-react';
@@ -74,16 +73,14 @@ function ListLembaga({ search }: { search: string }) {
       <Paper withBorder bg={colors['white-1']} p={'lg'} shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>Daftar Lembaga</Title>
-          <Tooltip label="Tambah Lembaga Baru" withArrow>
-            <Button
-              leftSection={<IconPlus size={18} />}
-              color="blue"
-              variant="light"
-              onClick={() => router.push('/admin/pendidikan/info-sekolah/lembaga/create')}
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() => router.push('/admin/pendidikan/info-sekolah/lembaga/create')}
+          >
+            Tambah Baru
+          </Button>
         </Group>
         <Box style={{ overflowX: "auto" }}>
           <Table highlightOnHover>

src/app/admin/(dashboard)/pendidikan/info-sekolah/pengajar/[id]/edit/page.tsx

@@ -11,8 +11,7 @@ import {
   Select,
   Stack,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -83,11 +82,9 @@ function EditPengajar() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header Back + Title */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Pengajar
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/pengajar/[id]/page.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { Box, Button, Group, Paper, Skeleton, Stack, Text, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Skeleton, Stack, Text } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack, IconEdit, IconTrash } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -77,34 +77,30 @@ function DetailPengajar() {
               </Box>
 
               <Group gap="sm" mt="sm">
-                <Tooltip label="Hapus Pengajar" withArrow position="top">
-                  <Button
-                    color="red"
-                    onClick={() => {
-                      setSelectedId(data.id);
-                      setModalHapus(true);
-                    }}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconTrash size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="red"
+                  onClick={() => {
+                    setSelectedId(data.id);
+                    setModalHapus(true);
+                  }}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconTrash size={20} />
+                </Button>
 
-                <Tooltip label="Edit Pengajar" withArrow position="top">
-                  <Button
-                    color="green"
-                    onClick={() =>
-                      router.push(`/admin/pendidikan/info-sekolah/pengajar/${data.id}/edit`)
-                    }
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconEdit size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="green"
+                  onClick={() =>
+                    router.push(`/admin/pendidikan/info-sekolah/pengajar/${data.id}/edit`)
+                  }
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconEdit size={20} />
+                </Button>
               </Group>
             </Stack>
           </Paper>

src/app/admin/(dashboard)/pendidikan/info-sekolah/pengajar/create/page.tsx

@@ -11,14 +11,13 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useEffect } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 function CreatePengajar() {
   const router = useRouter();
@@ -51,11 +50,9 @@ function CreatePengajar() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header Back + Title */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Pengajar
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/pengajar/page.tsx

@@ -1,9 +1,9 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { 
-  Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, 
-  Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip 
+import {
+  Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack,
+  Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title
 } from '@mantine/core';
 import { IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -59,16 +59,14 @@ function ListPengajar({ search }: { search: string }) {
       <Paper withBorder bg={colors['white-1']} p={'lg'} shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>Daftar Pengajar</Title>
-          <Tooltip label="Tambah Pengajar" withArrow>
-            <Button 
-              leftSection={<IconPlus size={18} />} 
-              color="blue" 
-              variant="light" 
-              onClick={() => router.push('/admin/pendidikan/info-sekolah/pengajar/create')}
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() => router.push('/admin/pendidikan/info-sekolah/pengajar/create')}
+          >
+            Tambah Baru
+          </Button>
         </Group>
 
         <Box style={{ overflowX: 'auto' }}>

src/app/admin/(dashboard)/pendidikan/info-sekolah/siswa/[id]/edit/page.tsx

@@ -12,8 +12,7 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -89,11 +88,9 @@ function EditSiswa() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Siswa
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/siswa/[id]/page.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { Box, Button, Group, Paper, Skeleton, Stack, Text, Tooltip } from '@mantine/core'
+import { Box, Button, Group, Paper, Skeleton, Stack, Text } from '@mantine/core'
 import { useShallowEffect } from '@mantine/hooks'
 import { IconArrowBack, IconEdit, IconTrash } from '@tabler/icons-react'
 import { useParams, useRouter } from 'next/navigation'
@@ -79,34 +79,30 @@ function DetailSiswa() {
               </Box>
 
               <Group gap="sm">
-                <Tooltip label="Hapus Siswa" withArrow position="top">
-                  <Button
-                    color="red"
-                    onClick={() => {
-                      setSelectedId(data.id)
-                      setModalHapus(true)
-                    }}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconTrash size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="red"
+                  onClick={() => {
+                    setSelectedId(data.id)
+                    setModalHapus(true)
+                  }}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconTrash size={20} />
+                </Button>
 
-                <Tooltip label="Edit Siswa" withArrow position="top">
-                  <Button
-                    color="green"
-                    onClick={() =>
-                      router.push(`/admin/pendidikan/info-sekolah/siswa/${data.id}/edit`)
-                    }
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconEdit size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="green"
+                  onClick={() =>
+                    router.push(`/admin/pendidikan/info-sekolah/siswa/${data.id}/edit`)
+                  }
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconEdit size={20} />
+                </Button>
               </Group>
             </Stack>
           </Paper>

src/app/admin/(dashboard)/pendidikan/info-sekolah/siswa/create/page.tsx

@@ -11,8 +11,7 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -46,11 +45,9 @@ function CreateSiswa() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header + Back Button */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Siswa
         </Title>

src/app/admin/(dashboard)/pendidikan/info-sekolah/siswa/page.tsx

@@ -6,8 +6,8 @@ import {
   Button,
   Center,
   Group,
-  Paper,
   Pagination,
+  Paper,
   Skeleton,
   Stack,
   Table,
@@ -17,8 +17,7 @@ import {
   TableThead,
   TableTr,
   Text,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -68,16 +67,14 @@ function ListSiswa({ search }: { search: string }) {
       <Paper withBorder bg={colors['white-1']} p={'lg'} shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>Daftar Siswa</Title>
-          <Tooltip label="Tambah Siswa" withArrow>
-            <Button
-              leftSection={<IconPlus size={18} />}
-              color="blue"
-              variant="light"
-              onClick={() => router.push('/admin/pendidikan/info-sekolah/siswa/create')}
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() => router.push('/admin/pendidikan/info-sekolah/siswa/create')}
+          >
+            Tambah Baru
+          </Button>
         </Group>
 
         <Box style={{ overflowX: "auto" }}>

src/app/admin/(dashboard)/pendidikan/pendidikan-non-formal/_lib/layoutTabs.tsx

@@ -1,10 +1,10 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
+import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
+import { IconBook2, IconMapPin, IconSchool } from '@tabler/icons-react';
 import { usePathname, useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
-import { IconSchool, IconMapPin, IconBook2 } from '@tabler/icons-react';
 
 function LayoutTabs({ children }: { children: React.ReactNode }) {
   const router = useRouter();
@@ -15,22 +15,19 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
       label: "Tujuan Program",
       value: "tujuan-program",
       href: "/admin/pendidikan/pendidikan-non-formal/tujuan-program",
-      icon: <IconSchool size={18} stroke={1.8} />,
-      tooltip: "Atur tujuan program pendidikan non formal",
+      icon: <IconSchool size={18} stroke={1.8} />
     },
     {
       label: "Tempat Kegiatan",
       value: "tempat-kegiatan",
       href: "/admin/pendidikan/pendidikan-non-formal/tempat-kegiatan",
-      icon: <IconMapPin size={18} stroke={1.8} />,
-      tooltip: "Kelola daftar tempat kegiatan",
+      icon: <IconMapPin size={18} stroke={1.8} />
     },
     {
       label: "Jenis Program yang Diselenggarakan",
       value: "jenis-program-yang-diselenggarakan",
       href: "/admin/pendidikan/pendidikan-non-formal/jenis-program-yang-diselenggarakan",
-      icon: <IconBook2 size={18} stroke={1.8} />,
-      tooltip: "Lihat & atur jenis program yang tersedia",
+      icon: <IconBook2 size={18} stroke={1.8} />
     },
   ];
 
@@ -77,28 +74,21 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
               flexWrap: "nowrap",
               gap: "0.5rem",
               paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
-          }}
+            }}
           >
             {tabs.map((tab, i) => (
-              <Tooltip
+              <TabsTab
                 key={i}
-                label={tab.tooltip}
-                position="bottom"
-                withArrow
-                transitionProps={{ transition: 'pop', duration: 200 }}
+                value={tab.value}
+                leftSection={tab.icon}
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.9rem",
+                  transition: "all 0.2s ease",
+                }}
               >
-                <TabsTab
-                  value={tab.value}
-                  leftSection={tab.icon}
-                  style={{
-                    fontWeight: 600,
-                    fontSize: "0.9rem",
-                    transition: "all 0.2s ease",
-                  }}
-                >
-                  {tab.label}
-                </TabsTab>
-              </Tooltip>
+                {tab.label}
+              </TabsTab>
             ))}
           </TabsList>
         </ScrollArea>

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

@@ -10,16 +10,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const JenisProgramYangDiselenggarakanTextEditor = dynamic(
   () =>
@@ -104,11 +103,9 @@ function EditJenisProgramYangDiselenggarakan() {
       <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>
+          <Button variant="subtle" onClick={handleBack} p="xs" radius="md">
+            <IconArrowBack color={colors['blue-button']} size={22} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Jenis Program Yang Diselenggarakan
           </Title>

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

@@ -10,8 +10,7 @@ import {
   Skeleton,
   Stack,
   Text,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
@@ -48,21 +47,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Jenis Program" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/pendidikan-non-formal/jenis-program-yang-diselenggarakan/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/pendidikan-non-formal/jenis-program-yang-diselenggarakan/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

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

@@ -11,16 +11,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const TempatKegiatanTextEditor = dynamic(
   () =>
@@ -108,11 +107,9 @@ function EditTempatKegiatan() {
       <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>
+          <Button variant="subtle" onClick={handleBack} p="xs" radius="md">
+            <IconArrowBack color={colors['blue-button']} size={22} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Tempat Kegiatan
           </Title>

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

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -36,21 +36,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Tempat Kegiatan" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/pendidikan-non-formal/tempat-kegiatan/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/pendidikan-non-formal/tempat-kegiatan/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

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

@@ -11,16 +11,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const PendidikanNonFormalTextEditor = dynamic(
   () => import('../../_lib/pendidikanNonFormalTextEditor').then(mod => mod.PendidikanNonFormalTextEditor),
@@ -98,11 +97,9 @@ function EditTujuanProgram() {
     <Box>
       <Stack gap="xs">
         <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>
+          <Button variant="subtle" onClick={handleBack} p="xs" radius="md">
+            <IconArrowBack color={colors['blue-button']} size={22} />
+          </Button>
           <Title order={4} ml="sm" c="dark">Edit Tujuan Program</Title>
         </Group>
 

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

@@ -10,8 +10,7 @@ import {
   Skeleton,
   Stack,
   Text,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
@@ -50,21 +49,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Tujuan Pendidikan Non Formal" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/pendidikan-non-formal/tujuan-program/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/pendidikan-non-formal/tujuan-program/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/_lib/layoutTabs.tsx

@@ -1,10 +1,10 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
+import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
+import { IconBook2, IconCategory, IconUser } from '@tabler/icons-react';
 import { usePathname, useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
-import { IconBook2, IconCategory, IconUser } from '@tabler/icons-react';
 
 function LayoutTabs({ children }: { children: React.ReactNode }) {
   const router = useRouter();
@@ -15,22 +15,19 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
       label: "Data Perpustakaan",
       value: "data-perpustakaan",
       href: "/admin/pendidikan/perpustakaan-digital/data-perpustakaan",
-      icon: <IconBook2 size={18} stroke={1.8} />,
-      tooltip: "Kelola data koleksi perpustakaan digital",
+      icon: <IconBook2 size={18} stroke={1.8} />
     },
     {
       label: "Kategori Buku",
       value: "kategori-buku",
       href: "/admin/pendidikan/perpustakaan-digital/kategori-buku",
-      icon: <IconCategory size={18} stroke={1.8} />,
-      tooltip: "Atur kategori untuk buku digital",
+      icon: <IconCategory size={18} stroke={1.8} />
     },
     {
       label: "Peminjam",
       value: "peminjam",
       href: "/admin/pendidikan/perpustakaan-digital/peminjam",
-      icon: <IconUser size={18} stroke={1.8} />,
-      tooltip: "Data Peminjam Buku",
+      icon: <IconUser size={18} stroke={1.8} />
     },
   ];
 
@@ -76,28 +73,21 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
               flexWrap: "nowrap",
               gap: "0.5rem",
               paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
-          }}
+            }}
           >
             {tabs.map((tab, i) => (
-              <Tooltip
+              <TabsTab
                 key={i}
-                label={tab.tooltip}
-                position="bottom"
-                withArrow
-                transitionProps={{ transition: 'pop', duration: 200 }}
+                value={tab.value}
+                leftSection={tab.icon}
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.9rem",
+                  transition: "all 0.2s ease",
+                }}
               >
-                <TabsTab
-                  value={tab.value}
-                  leftSection={tab.icon}
-                  style={{
-                    fontWeight: 600,
-                    fontSize: "0.9rem",
-                    transition: "all 0.2s ease",
-                  }}
-                >
-                  {tab.label}
-                </TabsTab>
-              </Tooltip>
+                {tab.label}
+              </TabsTab>
             ))}
           </TabsList>
         </ScrollArea>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/data-perpustakaan/[id]/edit/page.tsx

@@ -1,13 +1,13 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 
-import { useEffect, useState } from 'react';
-import { useParams, useRouter } from 'next/navigation';
-import { useProxy } from 'valtio/utils';
-import { toast } from 'react-toastify';
-import { Box, Button, Group, Image, Paper, Select, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Image, Paper, Select, Stack, Text, TextInput, Title } from '@mantine/core';
 import { Dropzone } from '@mantine/dropzone';
 import { IconArrowBack, IconPhoto, IconUpload, IconX } from '@tabler/icons-react';
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
 import perpustakaanDigitalState from '@/app/admin/(dashboard)/_state/pendidikan/perpustakaan-digital';
@@ -88,11 +88,9 @@ function EditPerpustakaanDigital() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Data Perpustakaan Digital
         </Title>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/data-perpustakaan/[id]/page.tsx

@@ -2,7 +2,7 @@
 import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus';
 import perpustakaanDigitalState from '@/app/admin/(dashboard)/_state/pendidikan/perpustakaan-digital';
 import colors from '@/con/colors';
-import { Box, Button, Group, Image, Paper, Skeleton, Stack, Text, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -98,32 +98,28 @@ function DetailDataPerpustakaan() {
               </Box>
 
               <Group gap="sm">
-                <Tooltip label="Hapus Data Perpustakaan" withArrow position="top">
-                  <Button
-                    color="red"
-                    onClick={() => {
-                      setSelectedId(data.id);
-                      setModalHapus(true);
-                    }}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconX size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="red"
+                  onClick={() => {
+                    setSelectedId(data.id);
+                    setModalHapus(true);
+                  }}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconX size={20} />
+                </Button>
 
-                <Tooltip label="Edit Data Perpustakaan" withArrow position="top">
-                  <Button
-                    color="green"
-                    onClick={() => router.push(`/admin/pendidikan/perpustakaan-digital/data-perpustakaan/${data.id}/edit`)}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconEdit size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="green"
+                  onClick={() => router.push(`/admin/pendidikan/perpustakaan-digital/data-perpustakaan/${data.id}/edit`)}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconEdit size={20} />
+                </Button>
               </Group>
             </Stack>
           </Paper>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/data-perpustakaan/create/page.tsx

@@ -3,7 +3,7 @@ import CreateEditor from '@/app/admin/(dashboard)/_com/createEditor';
 import perpustakaanDigitalState from '@/app/admin/(dashboard)/_state/pendidikan/perpustakaan-digital';
 import colors from '@/con/colors';
 import ApiFetch from '@/lib/api-fetch';
-import { Box, Button, Group, Image, Paper, Select, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Image, Paper, Select, Stack, Text, TextInput, Title } from '@mantine/core';
 import { Dropzone } from '@mantine/dropzone';
 import { IconArrowBack, IconPhoto, IconUpload, IconX } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -57,11 +57,9 @@ function CreateDataPerpustakaan() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Tombol Kembali */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Data Perpustakaan
         </Title>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/data-perpustakaan/page.tsx

@@ -1,11 +1,11 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Center, Group, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip, Pagination } from '@mantine/core';
+import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
+import { IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
 import { useProxy } from 'valtio/utils';
-import { IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
 import HeaderSearch from '../../../_com/header';
 import perpustakaanDigitalState from '../../../_state/pendidikan/perpustakaan-digital';
 
@@ -50,16 +50,14 @@ function ListDataPerpustakaan({ search }: { search: string }) {
       <Paper withBorder bg={colors['white-1']} p="md" shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>List Data Perpustakaan</Title>
-          <Tooltip label="Tambah Data Perpustakaan" withArrow>
-            <Button
-              leftSection={<IconPlus size={18} />}
-              color="blue"
-              variant="light"
-              onClick={() => router.push('/admin/pendidikan/perpustakaan-digital/data-perpustakaan/create')}
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() => router.push('/admin/pendidikan/perpustakaan-digital/data-perpustakaan/create')}
+          >
+            Tambah Baru
+          </Button>
         </Group>
         <Box style={{ overflowX: 'auto' }}>
           <Table striped highlightOnHover withRowBorders style={{ minWidth: '700px' }}>
@@ -87,7 +85,7 @@ function ListDataPerpustakaan({ search }: { search: string }) {
                     </TableTd>
                     <TableTd style={{ width: '20%' }}>
                       <Box w={150}>
-                        <Text dangerouslySetInnerHTML={{ __html: item.deskripsi }} lineClamp={1} truncate fz="sm"/>
+                        <Text dangerouslySetInnerHTML={{ __html: item.deskripsi }} lineClamp={1} truncate fz="sm" />
                       </Box>
                     </TableTd>
                     <TableTd style={{ width: '20%' }}>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/kategori-buku/[id]/page.tsx

@@ -3,7 +3,7 @@
 
 import perpustakaanDigitalState from '@/app/admin/(dashboard)/_state/pendidikan/perpustakaan-digital';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
@@ -59,11 +59,9 @@ function EditKategoriBuku() {
   return (
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Kategori Buku
         </Title>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/kategori-buku/create/page.tsx

@@ -1,7 +1,7 @@
 'use client'
 import perpustakaanDigitalState from '@/app/admin/(dashboard)/_state/pendidikan/perpustakaan-digital';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useProxy } from 'valtio/utils';
@@ -26,11 +26,9 @@ function CreateKategoriBuku() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Tambah Kategori Buku
         </Title>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/kategori-buku/page.tsx

@@ -1,8 +1,8 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
-import { IconEdit, IconPlus, IconTrash, IconSearch } from '@tabler/icons-react';
+import { IconEdit, IconPlus, IconSearch, IconTrash } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
 import { useProxy } from 'valtio/utils';
@@ -68,16 +68,14 @@ function ListKategoriBuku({ search }: { search: string }) {
       <Paper withBorder bg={colors['white-1']} p="lg" shadow="md" radius="md">
         <Group justify="space-between" mb="md">
           <Title order={4}>Daftar Kategori Buku</Title>
-          <Tooltip label="Tambah Kategori Buku" withArrow>
-            <Button
-              leftSection={<IconPlus size={18} />}
-              color="blue"
-              variant="light"
-              onClick={() => router.push('/admin/pendidikan/perpustakaan-digital/kategori-buku/create')}
-            >
-              Tambah Baru
-            </Button>
-          </Tooltip>
+          <Button
+            leftSection={<IconPlus size={18} />}
+            color="blue"
+            variant="light"
+            onClick={() => router.push('/admin/pendidikan/perpustakaan-digital/kategori-buku/create')}
+          >
+            Tambah Baru
+          </Button>
         </Group>
         <Box style={{ overflowX: 'auto' }}>
           <Table highlightOnHover>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/peminjam/[id]/edit/page.tsx

@@ -13,8 +13,7 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { DateInput } from '@mantine/dates';
 import { useShallowEffect } from '@mantine/hooks';
@@ -120,11 +119,9 @@ function EditPeminjam() {
     <Box px={{ base: 'sm', md: 'lg' }} py="md">
       {/* Header */}
       <Group mb="md">
-        <Tooltip label="Kembali ke halaman sebelumnya" withArrow>
-          <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
-            <IconArrowBack color={colors['blue-button']} size={24} />
-          </Button>
-        </Tooltip>
+        <Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
+          <IconArrowBack color={colors['blue-button']} size={24} />
+        </Button>
         <Title order={4} ml="sm" c="dark">
           Edit Peminjam Buku
         </Title>

src/app/admin/(dashboard)/pendidikan/perpustakaan-digital/peminjam/[id]/page.tsx

@@ -10,8 +10,7 @@ import {
   Paper,
   Skeleton,
   Stack,
-  Text,
-  Tooltip
+  Text
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack, IconEdit, IconTrash } from '@tabler/icons-react';
@@ -43,21 +42,21 @@ function DetailDataPeminjaman() {
   };
 
   const renderStatusBadge = (status: string) => {
-      const normalized = status?.toUpperCase();
-  
-      switch (normalized) {
-        case 'DIPINJAM':
-          return <Badge color="blue" variant="light">Dipinjam</Badge>;
-        case 'DIKEMBALIKAN':
-          return <Badge color="green" variant="light">Dikembalikan</Badge>;
-        case 'TERLAMBAT':
-          return <Badge color="orange" variant="light">Terlambat</Badge>;
-        case 'DIBATALKAN':
-          return <Badge color="red" variant="light">Dibatalkan</Badge>;
-        default:
-          return <Badge color="gray" variant="light">Tidak diketahui</Badge>;
-      }
-    };
+    const normalized = status?.toUpperCase();
+
+    switch (normalized) {
+      case 'DIPINJAM':
+        return <Badge color="blue" variant="light">Dipinjam</Badge>;
+      case 'DIKEMBALIKAN':
+        return <Badge color="green" variant="light">Dikembalikan</Badge>;
+      case 'TERLAMBAT':
+        return <Badge color="orange" variant="light">Terlambat</Badge>;
+      case 'DIBATALKAN':
+        return <Badge color="red" variant="light">Dibatalkan</Badge>;
+      default:
+        return <Badge color="gray" variant="light">Tidak diketahui</Badge>;
+    }
+  };
 
   if (!data) {
     return (
@@ -189,35 +188,31 @@ function DetailDataPeminjaman() {
               </Box>
 
               <Group gap="sm" mt="sm">
-                <Tooltip label="Hapus Peminjam Buku" withArrow position="top">
-                  <Button
-                    color="red"
-                    onClick={() => {
-                      setSelectedId(data.id);
-                      setModalHapus(true);
-                    }}
-                    variant="light"
-                    radius="md"
-                    size="md"
-                    disabled={stateDetail.delete.loading}
-                  >
-                    <IconTrash size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="red"
+                  onClick={() => {
+                    setSelectedId(data.id);
+                    setModalHapus(true);
+                  }}
+                  variant="light"
+                  radius="md"
+                  size="md"
+                  disabled={stateDetail.delete.loading}
+                >
+                  <IconTrash size={20} />
+                </Button>
 
-                <Tooltip label="Edit Peminjam Buku" withArrow position="top">
-                  <Button
-                    color="green"
-                    onClick={() =>
-                      router.push(`/admin/pendidikan/perpustakaan-digital/peminjam/${data.id}/edit`)
-                    }
-                    variant="light"
-                    radius="md"
-                    size="md"
-                  >
-                    <IconEdit size={20} />
-                  </Button>
-                </Tooltip>
+                <Button
+                  color="green"
+                  onClick={() =>
+                    router.push(`/admin/pendidikan/perpustakaan-digital/peminjam/${data.id}/edit`)
+                  }
+                  variant="light"
+                  radius="md"
+                  size="md"
+                >
+                  <IconEdit size={20} />
+                </Button>
               </Group>
             </Stack>
           </Paper>

src/app/admin/(dashboard)/pendidikan/program-pendidikan-anak/_lib/layoutTabs.tsx

@@ -1,10 +1,10 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 'use client'
 import colors from '@/con/colors';
-import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
+import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
+import { IconSchool, IconTarget } from '@tabler/icons-react';
 import { usePathname, useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
-import { IconSchool, IconTarget } from '@tabler/icons-react';
 
 function LayoutTabs({ children }: { children: React.ReactNode }) {
   const router = useRouter();
@@ -15,15 +15,13 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
       label: "Tujuan Program",
       value: "tujuan-program",
       href: "/admin/pendidikan/program-pendidikan-anak/tujuan-program",
-      icon: <IconTarget size={18} stroke={1.8} />,
-      tooltip: "Atur tujuan program pendidikan anak",
+      icon: <IconTarget size={18} stroke={1.8} />
     },
     {
       label: "Program Unggulan",
       value: "program-unggulan",
       href: "/admin/pendidikan/program-pendidikan-anak/program-unggulan",
-      icon: <IconSchool size={18} stroke={1.8} />,
-      tooltip: "Lihat dan kelola program unggulan pendidikan anak",
+      icon: <IconSchool size={18} stroke={1.8} />
     }
   ];
 
@@ -70,28 +68,21 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
               flexWrap: "nowrap",
               gap: "0.5rem",
               paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
-          }}
+            }}
           >
             {tabs.map((tab, i) => (
-              <Tooltip
+              <TabsTab
                 key={i}
-                label={tab.tooltip}
-                position="bottom"
-                withArrow
-                transitionProps={{ transition: 'pop', duration: 200 }}
+                value={tab.value}
+                leftSection={tab.icon}
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.9rem",
+                  transition: "all 0.2s ease",
+                }}
               >
-                <TabsTab
-                  value={tab.value}
-                  leftSection={tab.icon}
-                  style={{
-                    fontWeight: 600,
-                    fontSize: "0.9rem",
-                    transition: "all 0.2s ease",
-                  }}
-                >
-                  {tab.label}
-                </TabsTab>
-              </Tooltip>
+                {tab.label}
+              </TabsTab>
             ))}
           </TabsList>
         </ScrollArea>

src/app/admin/(dashboard)/pendidikan/program-pendidikan-anak/program-unggulan/edit/page.tsx

@@ -11,14 +11,13 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
-import { useEffect, useState, useCallback } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { toast } from 'react-toastify';
 import { useProxy } from 'valtio/utils';
 
@@ -112,11 +111,9 @@ function EditTujuanProgram() {
     <Box>
       <Stack gap="xs">
         <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={24} />
-            </Button>
-          </Tooltip>
+          <Button variant="subtle" onClick={handleBack} p="xs" radius="md">
+            <IconArrowBack color={colors['blue-button']} size={24} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Program Unggulan
           </Title>

src/app/admin/(dashboard)/pendidikan/program-pendidikan-anak/program-unggulan/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -36,21 +36,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Program" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/program-pendidikan-anak/program-unggulan/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/program-pendidikan-anak/program-unggulan/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>
 

src/app/admin/(dashboard)/pendidikan/program-pendidikan-anak/tujuan-program/edit/page.tsx

@@ -10,16 +10,15 @@ import {
   Stack,
   Text,
   TextInput,
-  Title,
-  Tooltip,
+  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconArrowBack } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { useProxy } from 'valtio/utils';
 import { toast } from 'react-toastify';
+import { useProxy } from 'valtio/utils';
 
 const ProgramPendidikanAnakTextEditor = dynamic(
   () => import('../../_lib/programPendidikanAnakTextEditor').then(mod => mod.ProgramPendidikanAnakTextEditor),
@@ -99,11 +98,9 @@ function EditTujuanProgram() {
       <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>
+          <Button variant="subtle" onClick={handleBack} p="xs" radius="md">
+            <IconArrowBack color={colors['blue-button']} size={22} />
+          </Button>
           <Title order={4} ml="sm" c="dark">
             Edit Tujuan Program
           </Title>

src/app/admin/(dashboard)/pendidikan/program-pendidikan-anak/tujuan-program/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Divider, Grid, GridCol, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconEdit } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -36,21 +36,19 @@ function Page() {
             </Title>
           </GridCol>
           <GridCol span={{ base: 12, md: 1 }}>
-            <Tooltip label="Edit Tujuan Program" withArrow>
-              <Button
-                c="green"
-                variant="light"
-                leftSection={<IconEdit size={18} stroke={2} />}
-                radius="md"
-                onClick={() =>
-                  router.push(
-                    '/admin/pendidikan/program-pendidikan-anak/tujuan-program/edit'
-                  )
-                }
-              >
-                Edit
-              </Button>
-            </Tooltip>
+            <Button
+              c="green"
+              variant="light"
+              leftSection={<IconEdit size={18} stroke={2} />}
+              radius="md"
+              onClick={() =>
+                router.push(
+                  '/admin/pendidikan/program-pendidikan-anak/tujuan-program/edit'
+                )
+              }
+            >
+              Edit
+            </Button>
           </GridCol>
         </Grid>