dstpabuaran.com/resources/js/layouts/settings/layout.tsx
Yoga Pangestu aecd8eaf1f Refactor security settings page and update password functionality
- Translated UI elements to Indonesian for better localization.
- Improved layout by introducing Card components for better visual structure.
- Removed unnecessary imports and props related to passkeys and two-factor authentication.
- Updated tests to cover new password update scenarios and validation rules.
- Ensured proper redirection and error handling for unauthorized access to security settings.
- Enhanced user experience by adding success flash messages on password updates.
2026-07-30 22:08:24 +07:00

83 lines
2.7 KiB
TypeScript

import Heading from '@/components/heading';
import { Button } from '@/components/ui/button';
import { Separator } from '@/components/ui/separator';
import { useCurrentUrl } from '@/hooks/use-current-url';
import { cn, toUrl } from '@/lib/utils';
import { edit as editAppearance } from '@/routes/appearance';
import { edit as editPermissions } from '@/routes/permissions';
import { edit } from '@/routes/profile';
import { edit as editSecurity } from '@/routes/security';
import type { NavItem } from '@/types';
import { Link } from '@inertiajs/react';
import type { PropsWithChildren } from 'react';
const sidebarNavItems: NavItem[] = [
{
title: 'Profil',
href: edit(),
icon: null,
},
{
title: 'Kata Sandi',
href: editSecurity(),
icon: null,
},
{
title: 'Tampilan',
href: editAppearance(),
icon: null,
},
{
title: 'Izin',
href: editPermissions(),
icon: null,
},
];
export default function SettingsLayout({ children }: PropsWithChildren) {
const { isCurrentOrParentUrl } = useCurrentUrl();
return (
<div className="px-4 py-6">
<Heading
title="Pengaturan"
description="Kelola pengaturan akun Anda seperti akun, data pribadi dan lainnya."
/>
<div className="flex flex-col lg:flex-row lg:space-x-12">
<aside className="w-full max-w-xl lg:w-48">
<nav
className="flex flex-col space-y-1 space-x-0"
aria-label="Settings"
>
{sidebarNavItems.map((item, index) => (
<Button
key={`${toUrl(item.href)}-${index}`}
size="sm"
variant="ghost"
asChild
className={cn('w-full justify-start', {
'bg-muted': isCurrentOrParentUrl(item.href),
})}
>
<Link href={item.href}>
{item.icon && (
<item.icon className="h-4 w-4" />
)}
{item.title}
</Link>
</Button>
))}
</nav>
</aside>
<Separator className="my-6 lg:hidden" />
<section className="flex-1 space-y-12">
{children}
</section>
</div>
</div>
);
}