// Generated, do not edit. sha256:ae09cffb6bcb813ac103c0c39e8227c38347409ffb83175ba705ade666f63970
import { listMetalAssets, listMetalProducts, createMetalProduct, updateMetalProduct, deleteMetalProduct } from '../data/metals.js';
import { tableViewCfg } from '../data/preferences.js';
import { t, localeTag } from '../i18n/index.js';
import * as dialog from '../ui/dialog.js';
import { ENUMS, CONFIG } from '../../shared/config.js';
import { renderTable } from '../ui/table.js';
import { toBaseByFactor, fromBaseByFactor } from '../ui/format.js';
import { assetLabelHtml } from '../ui/asset-label.js';
import { esc } from '../ui/escape.js';

let tableApi = null;

export async function mount(host) {
  await buildTable(host);
}

async function assetOpts() { return (await listMetalAssets()).map(a => ({ value: a.id, label: `${a.symbol}: ${a.name}` })); }
function formOpts() { return ENUMS.METAL_FORM.map(v => ({ value: v, label: t('enums.metal_form.' + v) })); }

const DEC = CONFIG.METALS.DISPLAY_DECIMALS;
const fmtG = grams => grams.toLocaleString(localeTag(), { maximumFractionDigits: DEC });

async function buildTable(el) {
  const metalAssets = await listMetalAssets();

  const columns = [
    { key: 'assetId', label: t('metalProducts.asset'), sortable: true, sortValue: r => r.asset_symbol,
      render: r => assetLabelHtml({ asset_name: r.asset_name, asset_symbol: r.asset_symbol }),
      group: { value: r => r.asset_symbol, label: v => v },
      edit: { type: 'select', options: assetOpts } },
    { key: 'name', label: t('metalProducts.name'), sortable: true, text: true,
      edit: { type: 'text', placeholder: 'Krugerrand 1 oz' } },
    { key: 'form', label: t('metalProducts.form'), sortable: true,
      render: r => t('enums.metal_form.' + r.form),
      group: { value: r => r.form, label: v => t('enums.metal_form.' + v) },
      edit: { type: 'select', options: formOpts } },
    { key: 'fineGrams', label: t('metalProducts.fineWeight'), align: 'num', sortable: true, sortValue: r => r.fineGrams,
      render: r => `${fmtG(fromBaseByFactor(r.fineGrams, 'g'))} g <span class="t-muted-cell">· ${fmtG(fromBaseByFactor(r.fineGrams, 'ozt'))} ozt</span>`,
      edit: {
        render: vals => {
          const grams = Number.isFinite(Number(vals.fineGrams)) && vals.fineGrams !== '' && vals.fineGrams != null
            ? fromBaseByFactor(vals.fineGrams, 'g') : '';
          const opt = u => `<option value="${u}">${u}</option>`;
          return `<div data-field="fineGrams" style="display:flex;gap:.4rem;align-items:center">
            <input class="input" data-mp-weight type="number" min="0" step="any" value="${esc(grams)}" style="min-width:90px">
            <select class="input" data-mp-unit style="width:auto">${['g', 'ozt', 'kg'].map(opt).join('')}</select>
          </div>`;
        },
        read: host => {
          if (!host) return null;
          const n = parseFloat(host.querySelector('[data-mp-weight]').value);
          const u = host.querySelector('[data-mp-unit]').value;
          if (!Number.isFinite(n) || n <= 0) return null;
          return toBaseByFactor(n, u);
        },
      } },
  ];

  function toPayload(v) {
    const assetId = Number(v.assetId);
    const name = String(v.name || '').trim();
    const fineGrams = v.fineGrams;
    if (!Number.isInteger(assetId) || !name) throw new Error(t('metalProducts.pickMetalAndName'));
    if (!Number.isInteger(fineGrams) || fineGrams <= 0) throw new Error(t('metalProducts.fillFineGrams'));
    return { assetId, name, form: v.form, fineGrams };
  }

  tableApi = renderTable(el, {
    columns, rows: await listMetalProducts(),
    title: t('metalProducts.title'),
    ...(await tableViewCfg('metal-products', { key: 'assetId', dir: 'asc' })),
    emptyText: t('metalProducts.none'),
    noneLabel: t('table.none'),
    collapsibleGroups: true,
    newLabel: t('table.new'),
    newDefaults: { assetId: metalAssets[0] ? metalAssets[0].id : '', form: 'coin' },
    saveLabel: t('metalProducts.save'), cancelLabel: t('metalProducts.cancel'),
    onCreate: async v => { const id = await createMetalProduct(toPayload(v)); tableApi.refresh(await listMetalProducts(), { locate: id }); },
    onSave: async (id, v) => { await updateMetalProduct(id, toPayload(v)); tableApi.refresh(await listMetalProducts()); },
    onDelete: async id => {
      if (!(await dialog.confirm({ message: t('metalProducts.confirmDelete'), danger: true }))) return;
      try { await deleteMetalProduct(id); tableApi.refresh(await listMetalProducts()); }
      catch (e) { dialog.alert({ title: t('dialog.error'), message: e.message }); }
    },
  });
}