wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

Fix Middleware

Browse Source 
Fix Layout sesuai role, dan superadmin bisa menambahkan menu ke user jika diperlukan
Penambahan menu di user & role : menu access
This commit is contained in:
nico
2025-11-24 16:02:13 +08:00
parent a291bdfb51
commit 716db0adca
15 changed files with 711 additions and 563 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/app/admin/(dashboard)/auth/validasi-admin/page.tsx
View File

@@ -4,7 +4,7 @@
import { apiFetchOtpData, apiFetchVerifyOtp } from '@/app/api/auth/_lib/api_fetch_auth';
import colors from '@/con/colors';
import { Box, Button, Loader, Paper, PinInput, Stack, Text, Title } from '@mantine/core';
import { Box, Button, Center, Loader, Paper, PinInput, Stack, Text, Title } from '@mantine/core';
import { useRouter } from 'next/navigation';
import { useEffect, useState } from 'react';
import { toast } from 'react-toastify';
@@ -98,10 +98,10 @@ export default function Validasi() {
router.replace('/waiting-room');
return;
}
// ✅ Switch statement lebih clean
let redirectPath: string;
switch (roleId) {
case 0:
case 1:
@@ -117,7 +117,7 @@ export default function Validasi() {
redirectPath = '/admin';
console.warn('Unknown roleId:', roleId);
}
console.log('Redirecting to:', redirectPath);
router.replace(redirectPath);
@@ -151,6 +151,7 @@ export default function Validasi() {
authStore.setUser({
id: 'pending',
name: username,
roleId: 1,
});
cleanupStorage();
router.replace('/waiting-room');
@@ -219,14 +220,16 @@ export default function Validasi() {
<Text c={colors['blue-button']} ta="center" fz="sm" fw="bold">
Masukkan Kode Verifikasi
</Text>
<PinInput
length={4}
value={otp}
onChange={setOtp}
onComplete={handleVerify}
inputMode="numeric"
size="lg"
/>
<Center>
<PinInput
length={4}
value={otp}
onChange={setOtp}
onComplete={handleVerify}
inputMode="numeric"
size="lg"
/>
</Center>
</Box>
<Button

22
src/app/admin/(dashboard)/user&role/_com/dynamicNavbar.ts Normal file
View File

@@ -0,0 +1,22 @@
// src/app/admin/(dashboard)/user&role/_com/dynamicNavbar.ts
import { navBar, role1, role2, role3 } from '@/app/admin/_com/list_PageAdmin';
export function getNavbar({
roleId,
menuIds,
}: {
roleId: number; // pastikan number
menuIds?: string[] | null; // opsional
}) {
// Prioritas: menuIds > roleId
if (menuIds && menuIds.length > 0) {
return navBar.filter(section => menuIds.includes(section.id));
}
// Fallback ke role-based
if (roleId === 0) return navBar;
if (roleId === 1) return role1;
if (roleId === 2) return role2;
if (roleId === 3) return role3;
return [];
}

8
src/app/admin/(dashboard)/user&role/layout.tsx
View File

@@ -2,7 +2,7 @@
'use client'
import colors from '@/con/colors';
import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
import { IconForms, IconUser } from '@tabler/icons-react';
import { IconBrush, IconForms, IconUser } from '@tabler/icons-react';
import { usePathname, useRouter } from 'next/navigation';
import React, { useEffect, useState } from 'react';
@@ -23,6 +23,12 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
href: "/admin/user&role/role",
icon: <IconForms size={18} stroke={1.8} />,
},
{
label: "Menu Access",
value: "menu-access",
href: "/admin/user&role/menu-access",
icon: <IconBrush size={18} stroke={1.8} />,
}
];
const currentTab = tabs.find(tab => tab.href === pathname);

124
src/app/admin/(dashboard)/user&role/menu-access/page.tsx Normal file
View File

@@ -0,0 +1,124 @@
/* eslint-disable react-hooks/exhaustive-deps */
// src/app/admin/user&role/menu-access/page.tsx
'use client'
import { navBar } from '@/app/admin/_com/list_PageAdmin'
import { Button, Checkbox, Group, Paper, Select, Stack, Text, Title } from '@mantine/core'
import { useEffect, useState } from 'react'
import { useProxy } from 'valtio/utils'
import user from '../../_state/user/user-state'
// ✅ Helper: ekstrak semua menu ID dari struktur navBar
const extractMenuIds = (navSections: typeof navBar) => {
return navSections.map(section => ({
value: section.id, // "Landing Page", "Kesehatan", dll
label: section.name // "Landing Page", "Kesehatan", dll
}));
};
function MenuAccessPage() {
const stateUser = useProxy(user.userState)
const [selectedUserId, setSelectedUserId] = useState<string | null>(null)
const [userMenus, setUserMenus] = useState<string[]>([])
// ✅ Gunakan helper untuk ekstrak menu
const availableMenus = extractMenuIds(navBar);
// Ambil data menu akses user
const loadUserMenuAccess = async () => {
if (!selectedUserId) return
try {
// ✅ Perbaiki URL: gunakan query string bukan dynamic route
const res = await fetch(`/api/admin/user-menu-access?userId=${selectedUserId}`)
const data = await res.json()
if (data.success) {
setUserMenus(data.menuIds || [])
}
} catch (error) {
console.error('Gagal memuat menu akses:', error)
}
}
useEffect(() => {
if (selectedUserId) {
loadUserMenuAccess()
}
}, [selectedUserId])
const handleToggleMenu = (menuId: string) => {
setUserMenus(prev =>
prev.includes(menuId)
? prev.filter(id => id !== menuId)
: [...prev, menuId]
)
}
const handleSave = async () => {
if (!selectedUserId) return
try {
const res = await fetch('/api/admin/user-menu-access', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ userId: selectedUserId, menuIds: userMenus }),
})
const data = await res.json()
if (data.success) {
alert('Menu akses berhasil disimpan')
}
} catch (error) {
console.error('Gagal menyimpan menu akses:', error)
alert('Terjadi kesalahan')
}
}
return (
<Stack>
<Title order={2}>Tampilan Menu</Title>
<Paper p="xl" shadow="md" radius="md">
<Stack gap="lg">
<Group>
<Text fw={500}>Pilih User:</Text>
<Select
placeholder="Pilih user"
data={stateUser.findMany.data.map(u => ({
value: u.id,
label: `${u.username} (${u.nomor})`,
}))}
value={selectedUserId}
onChange={setSelectedUserId}
w={300}
/>
</Group>
{selectedUserId && (
<>
<Text fw={500}>Menu yang Bisa Diakses:</Text>
<Stack>
{availableMenus.map(menu => (
<Checkbox
key={menu.value}
label={menu.label}
checked={userMenus.includes(menu.value)}
onChange={() => handleToggleMenu(menu.value)}
/>
))}
</Stack>
<Button onClick={handleSave} mt="md">
Simpan Perubahan
</Button>
</>
)}
</Stack>
</Paper>
</Stack>
)
}
export default MenuAccessPage

33
src/app/admin/(dashboard)/user&role/user/page.tsx
View File

@@ -95,7 +95,24 @@ function ListUser({ search }: { search: string }) {
});
if (success) {
// Reload data setelah berhasil update
// Cek apakah role berubah
const res = await fetch('/api/user/updt', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
id: userId,
roleId: newRoleId,
}),
});
const data = await res.json();
if (data.roleChanged) {
// Tampilkan notifikasi
alert(`User ${username} akan logout otomatis!`);
}
stateUser.findMany.load(page, 10, search);
}
@@ -114,7 +131,9 @@ function ListUser({ search }: { search: string }) {
}
};
const filteredData = data || [];
const filteredData = (data || []).filter(
(item) => item.roleId !== "0" // asumsikan id role SUPERADMIN = "0"
);
if (loading || !data) {
return (
@@ -158,10 +177,12 @@ function ListUser({ search }: { search: string }) {
<TableTd style={{ width: '20%' }}>
<Select
placeholder="Pilih role"
data={stateRole.findMany.data.map((r) => ({
label: r.name,
value: r.id,
}))}
data={stateRole.findMany.data
.filter(r => r.id !== "0") // ❌ Sembunyikan SUPERADMIN
.map(r => ({
label: r.name,
value: r.id,
}))}
value={item.roleId}
onChange={(val) => {
if (!val) return;