import Guidance from './Guidance.js';
import { render, waitFor } from '@testing-library/react';
import { AppStateProvider, type Draft, useDraft, useDrupal } from '../Context.js';
import { expect } from 'vitest';

const initialState = {
  accountId: '12345',
  drupal: {
    entity: {
      id: 1,
      type: 'canvas_page',
    },
    draftLinked: false,
  },
  keywords: ['gritty', 'phanatic', 'swoop'],
  competitorUrls: [
    'https://www.instagram.com/grittynhl/',
    'https://en.wikipedia.org/wiki/Gritty',
    'https://www.nhl.com/flyers/fans/gritty',
    'https://www.tiktok.com/@grittynhl?lang=en',
    'https://grittys.com',
    'https://www.merriam-webster.com/dictionary/gritty',
    'https://www.instagram.com/reel/DLC8pxqRxqf/?hl=en',
    'https://975thefanatic.com/listicle/top-6-gritty-moments/',
    'https://www.tiktok.com/@grittynhl/video/7517302191233797407',
    'https://www.reddit.com/r/Gritty/',
  ],
};

describe('Guidance', () => {
  test('Draft is created and linked', async () => {
    let draft: Draft = {
      title: 'Untitled Canvas draft',
    };
    let drupal = { draftLinked: false };
    const ContextCapture = () => {
      draft = useDraft();
      drupal = useDrupal();
      return null;
    };
    render(
      <AppStateProvider initialState={initialState}>
        <Guidance />
        <ContextCapture />
      </AppStateProvider>,
    );

    await waitFor(() => {
      expect(draft.id).toBe('bead88f1-bd37-48a7-9861-46f04058141d');
    });
    await waitFor(() => {
      expect(drupal.draftLinked).toBe(true);
    });
  });
});
