import { renderWithClient } from '../../../utils/test/react-query';
import Introducer from '../introducer';
import { mockedIntroducer } from '../../../mocks/data';
import { IntroducerType } from '../../../api/introducer';

describe('Introducer component', () => {
  test('successful render component', async () => {
    const result = renderWithClient(<Introducer introducer={mockedIntroducer} />);
    const testIds = [
      'introducer',
      'code',
      'share',
      'discount',
      'valid-days',
      'student-count',
      'share-price',
      'paid-price'
    ];
    for (const testId of testIds) {
      expect(await result.findByTestId(testId)).toBeInTheDocument();
    }
  });

  const introducerParts = [
    { key: 'code', getValue: (introducer: IntroducerType) => introducer.code.text },
    {
      key: 'student-count',
      getValue: (introducer: IntroducerType) => introducer.studentCount.toString()
    },
    {
      key: 'share-price',
      getValue: (introducer: IntroducerType) => introducer.sharePrice.toLocaleString()
    },
    {
      key: 'paid-price',
      getValue: (introducer: IntroducerType) => introducer.paidPrice.toLocaleString()
    }
  ];
  for (const { key, getValue } of introducerParts) {
    test(`render introdcer ${key}`, async () => {
      const result = renderWithClient(<Introducer introducer={mockedIntroducer} />);
      const element = await result.findByTestId(key);
      expect(element).toBeInTheDocument();
      expect(element.innerHTML).toContain(getValue(mockedIntroducer));
    });
  }
});
