/* eslint-env jest */
import { act } from 'react';
import { createRoot, type Root } from 'react-dom/client';

import { useContentSite } from '../../../lib/content-site';
import { CreditCostList } from '../CreditCostList';
import { CreditHistoryTable } from '../CreditHistoryTable';

jest.mock('../../../env', () => ({ recomaze_ai_personalization_env: {} }));
jest.mock('../../../lib/content-site', () => ({
  useContentSite: jest.fn(() => false),
}));
jest.mock('../../../service/credits/credits.service', () => ({
  getCreditTransactions: jest.fn(),
  fetchCreditTransactionsExport: jest.fn(),
}));

// eslint-disable-next-line @typescript-eslint/no-var-requires
const service = require('../../../service/credits/credits.service');

(
  globalThis as unknown as { IS_REACT_ACT_ENVIRONMENT: boolean }
).IS_REACT_ACT_ENVIRONMENT = true;

let root: Root;
let host: HTMLDivElement;

beforeEach(() => {
  host = document.createElement('div');
  document.body.appendChild(host);
  root = createRoot(host);
  service.getCreditTransactions.mockResolvedValue({
    message: '',
    transactions: [
      {
        id: 'tx-1',
        user_id: 'u-1',
        amount: -2,
        reason: 'CHAT_CONVERSATION',
        ref_type: null,
        ref_id: null,
        balance_after: 98,
        note: null,
        created_at: '2026-10-16T18:30:00Z',
      },
    ],
    total: 1,
    success: true,
    page: 1,
    total_pages: 1,
  });
});

afterEach(() => {
  act(() => root.unmount());
  host.remove();
  (useContentSite as jest.Mock).mockReturnValue(false);
});

const textOf = async (element: JSX.Element): Promise<string> => {
  await act(async () => {
    root.render(element);
  });
  return host.textContent ?? '';
};

describe('billing for a content site', () => {
  it('prices the chat replies without shoppers or a storefront', async () => {
    (useContentSite as jest.Mock).mockReturnValue(true);
    const text = await textOf(<CreditCostList />);
    expect(text).toContain('Answer the visitors on your website.');
    expect(text).not.toMatch(/storefront|shoppers/i);
  });

  it('names a chat reply in the history a website chat', async () => {
    (useContentSite as jest.Mock).mockReturnValue(true);
    const text = await textOf(<CreditHistoryTable token="t" clientId="c" />);
    expect(text).toContain('Website chat');
    expect(text).not.toContain('Shopper chat');
  });
});

describe('billing for a store', () => {
  it('keeps the shopper chat', async () => {
    expect(await textOf(<CreditCostList />)).toContain(
      'Answer shoppers on your storefront.'
    );
    expect(
      await textOf(<CreditHistoryTable token="t" clientId="c" />)
    ).toContain('Shopper chat');
  });
});