import {
  describe,
  expect,
  it
} from 'vitest';

import { buildChatMessageImageGridLayout, formatChatMessageImageOverflowLabel } from './chat-message-image-grid.rules';

describe('chat-message-image-grid rules', () => {
  it('keeps a single image outside the grid', () => {
    expect(buildChatMessageImageGridLayout(1)).toEqual({
      useGrid: false,
      variant: 'none',
      cells: []
    });
  });

  it('lays out two images in a pair grid', () => {
    expect(buildChatMessageImageGridLayout(2)).toEqual({
      useGrid: true,
      variant: 'pair',
      cells: [{ kind: 'image', index: 0 }, { kind: 'image', index: 1 }]
    });
  });

  it('lays out three images in a triple grid', () => {
    expect(buildChatMessageImageGridLayout(3)).toEqual({
      useGrid: true,
      variant: 'triple',
      cells: [
        { kind: 'image', index: 0 },
        { kind: 'image', index: 1 },
        { kind: 'image', index: 2 }
      ]
    });
  });

  it('lays out four images in a quad grid', () => {
    expect(buildChatMessageImageGridLayout(4)).toEqual({
      useGrid: true,
      variant: 'quad',
      cells: [
        { kind: 'image', index: 0 },
        { kind: 'image', index: 1 },
        { kind: 'image', index: 2 },
        { kind: 'image', index: 3 }
      ]
    });
  });

  it('replaces the last grid cell with an overflow tile when more than four images exist', () => {
    expect(buildChatMessageImageGridLayout(7)).toEqual({
      useGrid: true,
      variant: 'quad',
      cells: [
        { kind: 'image', index: 0 },
        { kind: 'image', index: 1 },
        { kind: 'image', index: 2 },
        { kind: 'overflow', hiddenCount: 4 }
      ]
    });
  });

  it('formats overflow labels as amount plus', () => {
    expect(formatChatMessageImageOverflowLabel(4)).toBe('+4');
  });
});
