75 lines
2.6 KiB
TypeScript
75 lines
2.6 KiB
TypeScript
import InputError from '@/components/input-error';
|
|
import LoadingButton from '@/components/loading-button';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Card } from '@/components/ui/card';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Label } from '@/components/ui/label';
|
|
import { Separator } from '@/components/ui/separator';
|
|
import DashboardLayout from '@/layouts/dashboard/layout';
|
|
import { SharedData } from '@/types/global';
|
|
import { Link, useForm, usePage } from '@inertiajs/react';
|
|
import { MoveLeft } from 'lucide-react';
|
|
import { ReactNode } from 'react';
|
|
|
|
interface Props extends SharedData {
|
|
property: LanguagesProperty;
|
|
}
|
|
|
|
const SMTP = ({ property }: Props) => {
|
|
const { props } = usePage<SharedData>();
|
|
const { translate } = props;
|
|
const { button } = translate;
|
|
const { data, setData, put, errors, processing } = useForm(property.properties);
|
|
|
|
const handleSubmit = (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
|
|
put(route('language.property.update', property.id));
|
|
};
|
|
|
|
return (
|
|
<div className="md:px-3">
|
|
<Card className="p-4 sm:p-6">
|
|
<form onSubmit={handleSubmit} className="space-y-6">
|
|
<div className="flex items-center justify-between gap-4">
|
|
<h2 className="text-xl font-semibold">{property.name}</h2>
|
|
<Link href={route('language.edit', property.language.code)}>
|
|
<Button>
|
|
<MoveLeft />
|
|
{button.back}
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
<Separator />
|
|
|
|
<div className="grid grid-cols-1 gap-6 md:grid-cols-2">
|
|
{Object.entries(data).map(([key, value]) => (
|
|
<div key={key}>
|
|
<Label>{key}</Label>
|
|
<Input
|
|
name={key}
|
|
value={data[key] as any}
|
|
placeholder="Enter value"
|
|
onChange={(e) => setData(e.target.name, e.target.value)}
|
|
/>
|
|
<InputError message={errors[key]} />
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
<Separator />
|
|
|
|
<div className="flex items-center justify-end">
|
|
<LoadingButton loading={processing}>{button.save}</LoadingButton>
|
|
</div>
|
|
</form>
|
|
</Card>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
SMTP.layout = (page: ReactNode) => <DashboardLayout children={page} />;
|
|
|
|
export default SMTP;
|