50b2be68ac
- Integrated toast notifications to display error messages when form submissions fail across various components, enhancing user feedback and experience. - Updated components including DeleteUser, FormDialog, ManageTwoFactor, TwoFactorRecoveryCodes, TwoFactorSetupModal, PayrollPeriodShow, EmployeeCreate, EmployeeEdit, CuttingCreate, CuttingEdit, PurchaseCreate, PurchaseEdit, RestockCreate, RestockEdit, TransactionCreate, TransactionEdit, Category management, Product management, Raw Material management, Role management, Settings, and Authentication pages.
126 lines
5.7 KiB
TypeScript
126 lines
5.7 KiB
TypeScript
import { Form, Head } from '@inertiajs/react';
|
|
import { useRef } from 'react';
|
|
import { toast } from 'sonner';
|
|
import SecurityController from '@/actions/App/Http/Controllers/Settings/SecurityController';
|
|
import InputError from '@/components/input-error';
|
|
import PasswordInput from '@/components/password-input';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Card, CardContent } from '@/components/ui/card';
|
|
import { Label } from '@/components/ui/label';
|
|
import { edit } from '@/routes/security';
|
|
|
|
type Props = {
|
|
passwordRules: string;
|
|
};
|
|
|
|
export default function Security(props: Props) {
|
|
const passwordInput = useRef<HTMLInputElement>(null);
|
|
const currentPasswordInput = useRef<HTMLInputElement>(null);
|
|
|
|
return (
|
|
<>
|
|
<Head title="Kata Sandi" />
|
|
|
|
<h1 className="sr-only">Kata Sandi</h1>
|
|
|
|
<div className="flex h-full flex-1 flex-col gap-6 overflow-x-auto px-4 md:px-6">
|
|
<Form
|
|
{...SecurityController.update.form()}
|
|
options={{
|
|
preserveScroll: true,
|
|
}}
|
|
resetOnSuccess
|
|
onError={() => {
|
|
toast.error('Terjadi kesalahan saat menyimpan data. Silakan periksa kembali input Anda.');
|
|
}}
|
|
>
|
|
{({ errors, processing }) => (
|
|
<div className="grid gap-6">
|
|
<Card>
|
|
<CardContent className="grid grid-cols-1 gap-4 md:grid-cols-3">
|
|
<div className="grid gap-2">
|
|
<Label htmlFor="current_password">
|
|
Kata Sandi Saat{' '}
|
|
<span className="text-destructive">
|
|
*
|
|
</span>
|
|
</Label>
|
|
|
|
<PasswordInput
|
|
id="current_password"
|
|
ref={currentPasswordInput}
|
|
name="current_password"
|
|
className="mt-1 block w-full"
|
|
autoComplete="current-password"
|
|
placeholder="Masukkan kata sandi saat ini"
|
|
/>
|
|
|
|
<InputError
|
|
message={errors.current_password}
|
|
/>
|
|
</div>
|
|
|
|
<div className="grid gap-2">
|
|
<Label htmlFor="password">
|
|
Kata Sandi Baru{' '}
|
|
<span className="text-destructive">
|
|
*
|
|
</span>
|
|
</Label>
|
|
|
|
<PasswordInput
|
|
id="password"
|
|
ref={passwordInput}
|
|
name="password"
|
|
className="mt-1 block w-full"
|
|
autoComplete="new-password"
|
|
placeholder="Masukkan kata sandi baru"
|
|
passwordrules={props.passwordRules}
|
|
/>
|
|
|
|
<InputError message={errors.password} />
|
|
</div>
|
|
|
|
<div className="grid gap-2">
|
|
<Label htmlFor="password_confirmation">
|
|
Konfirmasi Kata Sandi{' '}
|
|
<span className="text-destructive">
|
|
*
|
|
</span>
|
|
</Label>
|
|
|
|
<PasswordInput
|
|
id="password_confirmation"
|
|
name="password_confirmation"
|
|
className="mt-1 block w-full"
|
|
autoComplete="new-password"
|
|
placeholder="Ulangi kata sandi baru"
|
|
passwordrules={props.passwordRules}
|
|
/>
|
|
|
|
<InputError
|
|
message={
|
|
errors.password_confirmation
|
|
}
|
|
/>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<div className="flex items-center gap-4">
|
|
<Button
|
|
type="submit"
|
|
disabled={processing}
|
|
data-test="update-password-button"
|
|
>
|
|
Simpan
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</Form>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|