import type { Meta, StoryObj } from '@storybook/react';
import { CourseLearningView } from './CourseLearningView';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { BrowserRouter } from 'react-router-dom';

const createMockQueryClient = () => new QueryClient({
    defaultOptions: {
        queries: { retry: false, staleTime: Infinity },
        mutations: { retry: false },
    },
});

const meta: Meta<typeof CourseLearningView> = {
    title: 'Components/Education/CourseLearningView',
    component: CourseLearningView,
    parameters: { layout: 'fullscreen' },
    tags: ['autodocs'],
    decorators: [
        (Story) => (
            <QueryClientProvider client={createMockQueryClient()}>
                <BrowserRouter>
                    <div className="bg-kodo-background min-h-screen">
                        <Story />
                    </div>
                </BrowserRouter>
            </QueryClientProvider>
        ),
    ],
};

export default meta;
type Story = StoryObj<typeof meta>;

export const Default: Story = { name: 'Par défaut' };
export const Complete: Story = { name: 'Terminé' };