import { Head, router, usePage } from '@inertiajs/react'; import { PasswordInput } from '@ui/components/password-input'; import { Button } from '@ui/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@ui/components/ui/card'; import { Input } from '@ui/components/ui/input'; import { Label } from '@ui/components/ui/label'; import { Separator } from '@ui/components/ui/separator'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@ui/components/ui/tabs'; import { KeyRound, Loader2, User } from 'lucide-react'; import { useState } from 'react'; import { toast } from 'sonner'; import { FinanceAppLayout } from '@/layouts/finance-app-layout'; interface ProfilePageProps { title?: string; user: { name: string; email: string; }; } export default function ProfileSettings({ title, user }: ProfilePageProps) { const { errors } = usePage<{ errors: Record }>().props; // Profile form state const [profileName, setProfileName] = useState(user.name); const [isUpdatingProfile, setIsUpdatingProfile] = useState(false); // Password form state const [currentPassword, setCurrentPassword] = useState(''); const [newPassword, setNewPassword] = useState(''); const [confirmPassword, setConfirmPassword] = useState(''); const [isUpdatingPassword, setIsUpdatingPassword] = useState(false); const handleProfileSubmit = (e: React.FormEvent) => { e.preventDefault(); router.patch('/settings/profile', { name: profileName }, { preserveScroll: true, onStart: () => setIsUpdatingProfile(true), onSuccess: () => { toast.success('Profil berhasil diperbarui.'); }, onError: (errs) => { const first = Object.values(errs)[0]; toast.error(first || 'Terjadi kesalahan.'); }, onFinish: () => setIsUpdatingProfile(false), }); }; const handlePasswordSubmit = (e: React.FormEvent) => { e.preventDefault(); if (newPassword !== confirmPassword) { toast.error('Konfirmasi password tidak cocok.'); return; } router.patch('/settings/password', { current_password: currentPassword, password: newPassword, password_confirmation: confirmPassword, }, { preserveScroll: true, onStart: () => setIsUpdatingPassword(true), onSuccess: () => { toast.success('Password berhasil diperbarui.'); setCurrentPassword(''); setNewPassword(''); setConfirmPassword(''); }, onError: (errs) => { const first = Object.values(errs)[0]; toast.error(first || 'Terjadi kesalahan. Periksa password Anda.'); }, onFinish: () => setIsUpdatingPassword(false), }); }; return (

Pengaturan Akun

Kelola informasi profil dan keamanan akun Anda.

Profil Ganti Password {/* ── Profile Tab ── */} Informasi Profil Perbarui nama tampilan akun Anda.
setProfileName(e.target.value)} placeholder="Nama lengkap" required /> {errors.name && (

{errors.name}

)}

Email tidak dapat diubah melalui halaman ini.

{/* ── Change Password Tab ── */} Ganti Password Pastikan akun Anda menggunakan password yang kuat untuk menjaga keamanan.
setCurrentPassword(e.target.value)} placeholder="Masukkan password saat ini" required autoComplete="current-password" /> {errors.current_password && (

{errors.current_password}

)}
setNewPassword(e.target.value)} placeholder="Masukkan password baru" required autoComplete="new-password" /> {errors.password && (

{errors.password}

)}
setConfirmPassword(e.target.value)} placeholder="Ulangi password baru" required autoComplete="new-password" />
); }