import { Link } from '@inertiajs/react';

export type EducationDraft = {
    id: string;
    kind: 'demands' | 'capacities';
    version_no: number;
    state: 'draft' | 'submitted';
    updated_at: string;
    payload: Record<string, string | number | null>;
    record_id: string | null;
    references: {
        project_id?: { name?: string };
        course_id?: { title?: string };
        occupation_id?: { name?: string };
        skill_id?: { name?: string };
        territory_path?: { name: string }[];
    } | null;
};
export type EducationDraftSummary = Pick<
    EducationDraft,
    'id' | 'kind' | 'version_no' | 'state' | 'updated_at'
> & { label?: string | null };

export default function EducationSubmittedSnapshot({
    draft,
}: {
    draft: EducationDraft;
}) {
    const labels: Record<string, string> = {
        employer: 'Empregador declarante',
        qualification: 'Qualificação',
        quantity:
            draft.kind === 'demands'
                ? 'Trabalhadores necessários'
                : 'Vagas formativas',
        period_start: 'Início do período',
        period_end: 'Fim do período',
        reference_date: 'Data de referência da fonte',
        valid_until: 'Fonte válida até',
        source: 'Fonte e evidência',
    };
    return (
        <section className="rounded border p-4">
            <h2 className="text-xl font-semibold">Declaração submetida</h2>
            <p>
                Os dados abaixo conservam a submissão efectuada. A revisão
                independente mantém o seu percurso; esta consulta não certifica
                a instituição ou formação.
            </p>
            <dl className="my-4 space-y-2">
                {Object.entries(labels)
                    .filter(
                        ([key]) =>
                            draft.payload[key] !== undefined &&
                            draft.payload[key] !== null &&
                            draft.payload[key] !== '',
                    )
                    .map(([key, label]) => (
                        <div key={key}>
                            <dt className="font-semibold">{label}</dt>
                            <dd className="whitespace-pre-wrap">
                                {draft.payload[key]}
                            </dd>
                        </div>
                    ))}
                {draft.references && (
                    <>
                        <div>
                            <dt className="font-semibold">
                                {draft.kind === 'demands'
                                    ? 'Projecto utilizado'
                                    : 'Curso utilizado'}
                            </dt>
                            <dd>
                                {draft.references.project_id?.name ??
                                    draft.references.course_id?.title ??
                                    'Referência conservada'}
                            </dd>
                        </div>
                        <div>
                            <dt className="font-semibold">
                                Ocupação / competência utilizadas
                            </dt>
                            <dd>
                                {draft.references.occupation_id?.name} /{' '}
                                {draft.references.skill_id?.name}
                            </dd>
                        </div>
                        <div>
                            <dt className="font-semibold">Local utilizado</dt>
                            <dd>
                                {draft.references.territory_path
                                    ?.map((node) => node.name)
                                    .join(' / ') || 'Referência conservada'}
                            </dd>
                        </div>
                    </>
                )}
            </dl>
            {draft.kind === 'demands' && draft.record_id && (
                <Link
                    className="underline"
                    href={`/management/education/demands/${draft.record_id}/analysis`}
                >
                    Consultar análise e estado actual
                </Link>
            )}
        </section>
    );
}