87 lines
3.1 KiB
TypeScript
87 lines
3.1 KiB
TypeScript
import type { ReactNode } from 'react';
|
|
import CatalogueChoiceSelect from '@/components/catalogue-choice-select';
|
|
|
|
export default function FiscalOperationPicker({
|
|
family,
|
|
selected,
|
|
operations,
|
|
onChange,
|
|
}: {
|
|
family: string;
|
|
selected: unknown;
|
|
operations: {
|
|
id: string;
|
|
label: string;
|
|
description: string;
|
|
render: () => ReactNode;
|
|
}[];
|
|
onChange: (selected: string[]) => void;
|
|
}) {
|
|
const saved = Array.isArray(selected)
|
|
? selected.filter((id): id is string => typeof id === 'string')
|
|
: [];
|
|
const chosen = operations.filter((operation) =>
|
|
saved.includes(`${family}:${operation.id}`),
|
|
);
|
|
return (
|
|
<section
|
|
className="space-y-4 rounded border p-4"
|
|
aria-label="Operações fiscais adicionais"
|
|
>
|
|
<h4 className="font-semibold">Operações que pretende analisar</h4>
|
|
<p>
|
|
Acrescente apenas as operações que prevê realizar. Se não sabe
|
|
se uma operação se aplica, consulte a orientação e conserve-a
|
|
por confirmar; o sector, por si só, não determina o
|
|
enquadramento.
|
|
</p>
|
|
<CatalogueChoiceSelect
|
|
label="Adicionar outra operação"
|
|
value=""
|
|
options={operations
|
|
.filter(
|
|
(operation) =>
|
|
!saved.includes(`${family}:${operation.id}`),
|
|
)
|
|
.map((operation) => ({
|
|
value: operation.id,
|
|
label: operation.label,
|
|
keywords: [operation.description],
|
|
}))}
|
|
onChange={(id) => {
|
|
if (operations.some((operation) => operation.id === id))
|
|
onChange([...saved, `${family}:${id}`]);
|
|
}}
|
|
/>
|
|
{!chosen.length && (
|
|
<p>
|
|
Nenhuma operação adicional escolhida. As preparações e os
|
|
resultados anteriormente guardados permanecem no rascunho e
|
|
no histórico.
|
|
</p>
|
|
)}
|
|
{chosen.map((operation) => (
|
|
<section key={operation.id} className="space-y-3 border-t pt-3">
|
|
<h5 className="font-semibold">{operation.label}</h5>
|
|
<p>{operation.description}</p>
|
|
<button
|
|
type="button"
|
|
className="underline"
|
|
onClick={() =>
|
|
onChange(
|
|
saved.filter(
|
|
(id) => id !== `${family}:${operation.id}`,
|
|
),
|
|
)
|
|
}
|
|
>
|
|
Retirar da análise actual, conservando os dados
|
|
guardados
|
|
</button>
|
|
{operation.render()}
|
|
</section>
|
|
))}
|
|
</section>
|
|
);
|
|
}
|