import {
  SegmentedToggleComponentBuilder,
  DropdownComponentBuilder,
  FacesRatingBarComponentBuilder,
  TextInputComponentBuilder,
} from '../builders';

describe('builders', () => {
  it('DropdownComponentBuilder', () => {
    const select = new DropdownComponentBuilder('new_select');

    const json = select
      .setLabel('SELECT')
      .setPlaceholder('SELECT ME')
      .addOption('1', 'First')
      .addOption('2', '2nd')
      .addOption('3', '3rd')
      .build();

    expect(json).toMatchInlineSnapshot(`
{
  "label": "SELECT",
  "options": [
    {
      "displayName": "First",
      "id": "1",
    },
    {
      "displayName": "2nd",
      "id": "2",
    },
    {
      "displayName": "3rd",
      "id": "3",
    },
  ],
  "placeholder": "SELECT ME",
  "questionId": "new_select",
  "type": "Dropdown",
}
`);
  });

  it('FacesRatingBarComponentBuilder', () => {
    const star = new FacesRatingBarComponentBuilder('new_select');

    const json = star
      .setLabel('SELECT')
      .setTooltips(['1', '2', '3', '4', '5'])
      .build();
    expect(json).toMatchInlineSnapshot(`
{
  "label": "SELECT",
  "questionId": "new_select",
  "tooltips": [
    "1",
    "2",
    "3",
    "4",
    "5",
  ],
  "type": "FacesRatingBar",
}
`);
  });
});

describe('validation', () => {
  it('SelectRowBuilder ', () => {
    const select = new DropdownComponentBuilder('new_select');
    expect(select.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_select",
  "messages": [
    "label should be defined",
    "options should be defined",
  ],
  "type": "Dropdown",
  "valid": false,
}
`);

    select.addOption('option1', 'Option 1');
    select.setPlaceholder('Select me');
    select.setLabel('Select me');
    expect(select.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_select",
  "messages": [
    "should be at least 2 options",
  ],
  "type": "Dropdown",
  "valid": false,
}
`);

    select.addOption('option2', 'Option 2');
    expect(select.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_select",
  "messages": [],
  "type": "Dropdown",
  "valid": true,
}
`);
  });

  it('StarRowBuilder', () => {
    const star = new FacesRatingBarComponentBuilder('new_star');
    expect(star.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_star",
  "messages": [
    "label should be defined",
  ],
  "type": "FacesRatingBar",
  "valid": false,
}
`);

    star.setLabel('Faces');
    expect(star.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_star",
  "messages": [],
  "type": "FacesRatingBar",
  "valid": true,
}
`);

    // @ts-expect-error
    star.setTooltips(['1', '2', '3', '4']);
    expect(star.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_star",
  "messages": [
    "should be exactly 5 tooltips",
  ],
  "type": "FacesRatingBar",
  "valid": false,
}
`);

    star.setTooltips(['1', '2', '3', '4', '5']);
    expect(star.isValid()).toMatchInlineSnapshot(`
{
  "id": "new_star",
  "messages": [],
  "type": "FacesRatingBar",
  "valid": true,
}
`);
  });

  it('TextAreaRowBuilder', () => {
    const text = new TextInputComponentBuilder('text');
    expect(text.isValid()).toMatchInlineSnapshot(`
{
  "id": "text",
  "messages": [
    "label should be defined",
  ],
  "type": "TextInput",
  "valid": false,
}
`);
    text.setLabel('Text');
    text.setPlaceholder('Text');
    expect(text.isValid()).toMatchInlineSnapshot(`
{
  "id": "text",
  "messages": [],
  "type": "TextInput",
  "valid": true,
}
`);
  });

  it('ToggleRowBuilder', () => {
    const buttons = new SegmentedToggleComponentBuilder('buttons');
    expect(buttons.isValid()).toMatchInlineSnapshot(`
{
  "id": "buttons",
  "messages": [
    "label should be defined",
  ],
  "type": "SegmentedToggle",
  "valid": false,
}
`);

    buttons.setLabel('Button');
    expect(buttons.isValid()).toMatchInlineSnapshot(`
{
  "id": "buttons",
  "messages": [],
  "type": "SegmentedToggle",
  "valid": true,
}
`);
  });
});