import type { ExecutableInteraction } from '@star-kitten/lib/discord';
import * as StarKitten from '@star-kitten/lib/discord';
import { actionRow, button, container, text } from '@star-kitten/lib/discord/components';
import type { PageContext } from '@star-kitten/lib/discord/pages';
import { type Appraisal } from '@star-kitten/lib/eve/third-party/janice.js';
import { formatNumberToShortForm } from '@star-kitten/lib/util/text.js';
import type { AppraisalState } from './appraise.command';

export function renderAppraisal(
  appraisal: Appraisal,
  pageCtx: PageContext<AppraisalState>,
  interaction: ExecutableInteraction,
): StarKitten.Component {
  const formatter = new Intl.NumberFormat(interaction.locale || 'en-US', {
    maximumFractionDigits: 2,
    minimumFractionDigits: 2,
  });

  //   const container = createContainer(
  //     {
  //       accent_color: 0x1da57a,
  //     },
  //     createTextDisplay(`
  // # [Appraisal ${appraisal.id} @ ${appraisal.market.name}](https://janice.e-351.com/a/${appraisal.id})
  // ### Buy:  \`${formatter.format(appraisal.effectivePrices.totalBuyPrice)}\` ISK
  // ### Split:  \`${formatter.format(appraisal.effectivePrices.totalSplitPrice)}\` ISK
  // ### Sell:  \`${formatter.format(appraisal.effectivePrices.totalSellPrice)}\` ISK
  // -# Volume: ${formatter.format(appraisal.totalPackagedVolume)} m³
  // \`\`\`
  // Buy:      Sell:     Qty:      Item:
  // ${appraisal.items.map((i) => `${formatNumberToShortForm(i.effectivePrices.buyPrice).padEnd(10)}${formatNumberToShortForm(i.effectivePrices.sellPrice).padEnd(10)}${formatNumberToShortForm(i.amount).padEnd(10)}${i.itemType.name}`).join('\n')}
  // \`\`\`
  // -# https://janice.e-351.com/a/${appraisal.id}\n\n
  // `),
  //   );

  //   if (pageCtx.state.currentPage !== 'share') {
  //     container.components.push(
  //       createActionRow(
  //         createButton('Share in Channel', 'share', {
  //           disabled: !interaction.channel?.id,
  //         }),
  //       ),
  //     );
  //   }

  // return {
  //   type: 1,
  //   components: [container],
  // };
  return (
    <container accent={0x1da57a}>
      <textDisplay
        content={`
# [Appraisal ${appraisal.id} @ ${appraisal.market.name}](https://janice.e-351.com/a/${appraisal.id})
### Buy:  \`${formatter.format(appraisal.effectivePrices.totalBuyPrice)}\` ISK
### Split:  \`${formatter.format(appraisal.effectivePrices.totalSplitPrice)}\` ISK
### Sell:  \`${formatter.format(appraisal.effectivePrices.totalSellPrice)}\` ISK
-# Volume: ${formatter.format(appraisal.totalPackagedVolume)} m³
\`\`\`
Buy:      Sell:     Qty:      Item:
${appraisal.items.map((i) => `${formatNumberToShortForm(i.effectivePrices.buyPrice).padEnd(10)}${formatNumberToShortForm(i.effectivePrices.sellPrice).padEnd(10)}${formatNumberToShortForm(i.amount).padEnd(10)}${i.itemType.name}`).join('\n')}
\`\`\`
-# https://janice.e-351.com/a/${appraisal.id}\n\n
        `}
      />
      {pageCtx.state.currentPage !== 'share' ? (
        <actionRow>
          <button
            customId="share"
            label="Share in Channel"
            disabled={!interaction.channel?.id}
            style={StarKitten.ButtonStyle.PRIMARY}
          />
        </actionRow>
      ) : undefined}
    </container>
  );
}