// * Packages
import { usePage } from "@inertiajs/react";
import { route } from "ziggy-js";
import { ArrowLeftIcon } from "lucide-react";
// * Other
import AuthenticatedLayout from "@/back/Layouts/AuthenticatedLayout";
import BtnOptionnalLinkWithTooltip from "@/back/Components/BtnOptionnalLinkWithTooltip";
import Form from "@/back/Pages/Users/Form";
import useTrans from "@/hooks/use-translations";
import { Actions, Methods } from "@/lib/enums";
import { AuthProp, SingleResource, UserModel } from "@/back/types/global";

export default function Create({ data }: { data: SingleResource }) {
    const { viewAny } = (usePage().props.auth as AuthProp).policies.users;
    const userModel = data.data as UserModel;

    // Translations.
    const transBackToList = useTrans("back.crud_back_to_list");
    const transTitle = useTrans(
        route().current(`back.users.duplicate`)
            ? "crud.helpers.duplication_model"
            : "crud.helpers.creation_model",
        {
            params: {
                model: useTrans("models.classes.user", { choice: 1 }),
            },
        },
    );

    const beforeNode = () => {
        return (
            viewAny && (
                <div className="flex justify-end items-center gap-x-1.5">
                    <BtnOptionnalLinkWithTooltip
                        link={route("back.users.index")}
                        content={<ArrowLeftIcon />}
                        tooltipContent={<p>{transBackToList}</p>}
                    />
                </div>
            )
        );
    };

    return (
        <AuthenticatedLayout title={transTitle} beforeNode={beforeNode()}>
            <Form
                model={userModel}
                modelName="user"
                modelRoute="users"
                action={Actions.STORE}
                method={Methods.POST}
            />
        </AuthenticatedLayout>
    );
}