import React, { useState } from 'react'; import { Head, useForm } from '@inertiajs/react'; import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'; import { useInitials } from '@/hooks/use-initials'; import type { User } from '@/types'; type Props = { auth: { user: User; }; status?: string; }; export default function Edit({ auth, status }: Props) { const user = auth.user; const getInitials = useInitials(); const [successMessage, setSuccessMessage] = useState(status || ''); const { data, setData, put, processing, errors } = useForm({ name: user.name, email: user.email, }); const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); setSuccessMessage(''); }; return ( <>
{/* HEADER */}

Account Settings

Kelola informasi profil dan pengaturan akun Scuto Legal Anda.

{/* NOTIFIKASI */} {successMessage && (
{successMessage}
)} {/* GRID KONTEN */}
{/* Card Avatar Detail */}
{getInitials(user.name)}

{user.name}

Scuto Legal Member

Active Session
{/* Form Edit */}

Personal Information

{/* Input Nama */}
setData('name', e.target.value) } className={`w-full rounded-lg border bg-[#111a2e] px-3 py-2.5 text-sm text-white transition-colors focus:border-orange-500 focus:ring-1 focus:ring-orange-500 focus:outline-none ${ errors.name ? 'border-rose-500' : 'border-slate-800' }`} placeholder="Masukkan nama lengkap" required /> {errors.name && (

{errors.name}

)}
{/* Input Email */}
setData('email', e.target.value) } className={`w-full rounded-lg border bg-[#111a2e] px-3 py-2.5 text-sm text-white transition-colors focus:border-orange-500 focus:ring-1 focus:ring-orange-500 focus:outline-none ${ errors.email ? 'border-rose-500' : 'border-slate-800' }`} placeholder="nama@email.com" required /> {errors.email && (

{errors.email}

)}
{/* save */}
); }