FactuGES_ERP/modules/customer-invoices/src/web/components/customer-invoice-taxes-multi-select.tsx

import { SpainTaxCatalogProvider } from '@erp/core';
import { MultiSelect } from "@repo/rdx-ui/components";
import { cn } from "@repo/shadcn-ui/lib/utils";
import { useCallback, useMemo } from 'react';
import { useTranslation } from "../i18n";

const taxesList = [
  { label: "IVA 21%", value: "iva_21", group: "IVA" },
  { label: "IVA 10%", value: "iva_10", group: "IVA" },
  { label: "IVA 7,5%", value: "iva_7_5", group: "IVA" },
  { label: "IVA 5%", value: "iva_5", group: "IVA" },
  { label: "IVA 4%", value: "iva_4", group: "IVA" },
  { label: "IVA 2%", value: "iva_2", group: "IVA" },
  { label: "IVA 0%", value: "iva_0", group: "IVA" },
  { label: "Exenta", value: "iva_exenta", group: "IVA" },
  { label: "No sujeto", value: "iva_no_sujeto", group: "IVA" },
  { label: "Iva Intracomunitario Bienes", value: "iva_intracomunitario_bienes", group: "IVA" },
  { label: "Iva Intracomunitario Servicio", value: "iva_intracomunitario_servicio", group: "IVA" },
  { label: "Exportación", value: "iva_exportacion", group: "IVA" },
  { label: "Inv. Suj. Pasivo", value: "iva_inversion_sujeto_pasivo", group: "IVA" },

  { label: "Retención 35%", value: "retencion_35", group: "Retención" },
  { label: "Retención 19%", value: "retencion_19", group: "Retención" },
  { label: "Retención 15%", value: "retencion_15", group: "Retención" },
  { label: "Retención 7%", value: "retencion_7", group: "Retención" },
  { label: "Retención 2%", value: "retencion_2", group: "Retención" },

  { label: "REC 5,2%", value: "rec_5_2", group: "Recargo de equivalencia" },
  { label: "REC 1,75%", value: "rec_1_75", group: "Recargo de equivalencia" },
  { label: "REC 1,4%", value: "rec_1_4", group: "Recargo de equivalencia" },
  { label: "REC 1%", value: "rec_1", group: "Recargo de equivalencia" },
  { label: "REC 0,62%", value: "rec_0_62", group: "Recargo de equivalencia" },
  { label: "REC 0,5%", value: "rec_0_5", group: "Recargo de equivalencia" },
  { label: "REC 0,26%", value: "rec_0_26", group: "Recargo de equivalencia" },
  { label: "REC 0%", value: "rec_0", group: "Recargo de equivalencia" },
];



interface CustomerInvoiceTaxesMultiSelect {
  value: string[];
  onChange: (selectedValues: string[]) => void;
  [key: string]: any; // Allow other props to be passed
}

export const CustomerInvoiceTaxesMultiSelect = (props: CustomerInvoiceTaxesMultiSelect) => {
  const { value, onChange, ...otherProps } = props;
  const { t } = useTranslation();

  const taxCatalog = useMemo(() => SpainTaxCatalogProvider(), []);
  const catalogLookup = useMemo(() => SpainTaxCatalogProvider().toOptionLookup(), []);

  /**
   * Filtra para mantener solo un elemento por grupo.
   * Si hay duplicados dentro del mismo grupo, se queda con el último.
   */
  const filterSelectedByGroup = useCallback((selectedValues: string[]) => {
    const groupMap = new Map<string | undefined, string>();

    selectedValues.forEach((code) => {
      const item = taxCatalog.findByCode(code).getOrUndefined();
      const group = item?.group ?? "ungrouped";
      groupMap.set(group, code); // Sobrescribe el anterior del mismo grupo
    });

    return Array.from(groupMap.values());
  }, [taxCatalog]);

  return (
    <div className={cn("w-full", "max-w-md")}>
      <MultiSelect
        options={catalogLookup}
        onValueChange={onChange}
        defaultValue={value}
        placeholder={t("components.customer_invoice_taxes_multi_select.placeholder")}
        variant='inverted'
        animation={0}
        maxCount={3}
        autoFilter={true}
        filterSelected={filterSelectedByGroup}
        {...otherProps}
      />
    </div>
  );
};