180 lines
6.3 KiB
TypeScript
180 lines
6.3 KiB
TypeScript
// * Packages
|
|
import { useForm, usePage } from "@inertiajs/react";
|
|
import { BookTextIcon, EyeIcon } from "lucide-react";
|
|
// * Other
|
|
import SimpleString from "@/back/Components/Inputs/SimpleString";
|
|
import SimpleSwitch from "@/back/Components/Inputs/SimpleSwitch";
|
|
import EnumSelect from "@/back/Components/Inputs/EnumSelect";
|
|
import FieldsetWrapper from "@/back/Components/FieldsetWrapper";
|
|
import useTrans from "@/hooks/use-translations";
|
|
import str from "@/hooks/use-string";
|
|
import InputError from "@/back/Components/InputError";
|
|
import { AuthProp, LaravelEnum, UserModel } from "@/back/types/global";
|
|
import SubmitButton from "@/back/Components/SubmitButton";
|
|
import useCrudSubmit from "@/hooks/use-crud-submit";
|
|
|
|
export default function Form({
|
|
model,
|
|
modelName,
|
|
modelRoute,
|
|
action,
|
|
method,
|
|
}: {
|
|
model?: UserModel;
|
|
modelName: string;
|
|
modelRoute: string;
|
|
action: string;
|
|
method: number;
|
|
}) {
|
|
/** User roles */
|
|
const userModel = (usePage().props.auth as AuthProp).user;
|
|
const enumUserRole = usePage().props.enumUserRole as LaravelEnum;
|
|
const isConceptor = userModel.role === enumUserRole.conceptor.value;
|
|
const filterRoles = (value: number) => {
|
|
return (
|
|
Object.entries(enumUserRole)
|
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars, no-unused-vars
|
|
.filter(([_, role]) => role.value >= value)
|
|
.reduce((acc, [key, val]) => ({ ...acc, [key]: val }), {})
|
|
);
|
|
};
|
|
|
|
/** Form section */
|
|
const { post, setData, data } = useForm({
|
|
first_name: model?.first_name,
|
|
last_name: model?.last_name,
|
|
email: model?.email,
|
|
published: model?.published ?? false,
|
|
published_at: model?.published_at,
|
|
role: model?.role,
|
|
});
|
|
|
|
const submit = useCrudSubmit({
|
|
method,
|
|
modelRoute,
|
|
modelName,
|
|
action,
|
|
model,
|
|
post,
|
|
modelNameTrans: useTrans(`models.classes.user`),
|
|
data,
|
|
});
|
|
|
|
const transAssociateToRole = str(
|
|
useTrans("back.form_associate_to", {
|
|
params: {
|
|
attribute: useTrans("validation.attributes.role"),
|
|
},
|
|
choice: 1,
|
|
}),
|
|
)
|
|
.ucFirst()
|
|
.value();
|
|
const transFormTitleVisibility = useTrans("back.form_title_visibility");
|
|
const transFormSubtitleVisibility = useTrans(
|
|
"back.form_subtitle_visibility",
|
|
);
|
|
return (
|
|
<form onSubmit={submit}>
|
|
<InputError all />
|
|
<FieldsetWrapper
|
|
title={useTrans("back.form_title_global")}
|
|
icon={<BookTextIcon className="mr-1" />}
|
|
description={useTrans("back.form_subtitle_global")}
|
|
className="sm:grid-cols-2 gap-4"
|
|
>
|
|
<SimpleString
|
|
name="first_name"
|
|
label={str(
|
|
useTrans("back.form_associate_to", {
|
|
params: {
|
|
attribute: useTrans(
|
|
"validation.attributes.first_name",
|
|
),
|
|
},
|
|
choice: 1,
|
|
}),
|
|
)
|
|
.ucFirst()
|
|
.value()}
|
|
placeholder="ex: John Doe"
|
|
value={data.first_name}
|
|
setData={setData}
|
|
/>
|
|
<SimpleString
|
|
name="last_name"
|
|
label={str(
|
|
useTrans("back.form_associate_to", {
|
|
params: {
|
|
attribute: useTrans(
|
|
"validation.attributes.last_name",
|
|
),
|
|
},
|
|
choice: 1,
|
|
}),
|
|
)
|
|
.ucFirst()
|
|
.value()}
|
|
placeholder="ex: John Doe"
|
|
value={data.last_name}
|
|
setData={setData}
|
|
/>
|
|
<SimpleString
|
|
name="email"
|
|
type="email"
|
|
label={str(
|
|
useTrans("back.form_associate_to", {
|
|
params: {
|
|
attribute: useTrans(
|
|
"validation.attributes.email",
|
|
),
|
|
},
|
|
choice: 1,
|
|
}),
|
|
)
|
|
.ucFirst()
|
|
.value()}
|
|
placeholder="ex: john.doe@gmail.com"
|
|
disabled={!isConceptor}
|
|
wordCounter={isConceptor}
|
|
value={data.email}
|
|
setData={setData}
|
|
/>
|
|
{isConceptor && (
|
|
<EnumSelect
|
|
name="role"
|
|
options={
|
|
model?.role &&
|
|
userModel.role !== enumUserRole.conceptor.value
|
|
? filterRoles(model?.role)
|
|
: enumUserRole
|
|
}
|
|
label={transAssociateToRole}
|
|
selected={data.role ? String(data.role) : undefined}
|
|
setData={setData}
|
|
/>
|
|
)}
|
|
</FieldsetWrapper>
|
|
{isConceptor && (
|
|
<FieldsetWrapper
|
|
className="gap-4"
|
|
title={transFormTitleVisibility}
|
|
icon={<EyeIcon className="mr-1" />}
|
|
description={transFormSubtitleVisibility}
|
|
inline
|
|
>
|
|
<SimpleSwitch
|
|
name="published"
|
|
checked={data.published}
|
|
setData={setData}
|
|
/>
|
|
</FieldsetWrapper>
|
|
)}
|
|
<div className="text-center">
|
|
<SubmitButton
|
|
modelTrans={useTrans(`models.classes.${modelName}`)}
|
|
/>
|
|
</div>
|
|
</form>
|
|
);
|
|
}
|