veza/apps/web/src/components/admin/modals/BanUserModal.stories.tsx

import type { Meta, StoryObj } from '@storybook/react';
import { fn } from '@storybook/test';
import { BanUserModal } from './BanUserModal';

/**
 * BanUserModal - Modal de suspension d'utilisateur
 *
 * Modal permettant de configurer et confirmer la suspension
 * d'un utilisateur avec raison, durée et notes internes.
 */
const meta: Meta<typeof BanUserModal> = {
    title: 'Components/Features/Admin/Modals/BanUserModal',
    component: BanUserModal,
    parameters: {
        layout: 'centered',
        docs: {
            description: {
                component: 'Modal de suspension avec options temporaire/permanent et raisons prédéfinies.',
            },
        },
    },
    tags: ['autodocs'],
    args: {
        username: 'troublemaker_user',
        onClose: fn(),
        onConfirm: fn(),
    },
    argTypes: {
        username: {
            control: 'text',
            description: 'Nom d\'utilisateur à suspendre',
        },
        onClose: {
            action: 'onClose',
            description: 'Callback appelé à la fermeture',
        },
        onConfirm: {
            action: 'onConfirm',
            description: 'Callback appelé à la confirmation avec (reason, details, duration)',
        },
    },
    decorators: [
        (Story) => (
            <div className="bg-kodo-background min-h-screen flex items-center justify-center">
                <Story />
            </div>
        ),
    ],
};

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

/**
 * État par défaut de la modal.
 */
export const Default: Story = {
    name: 'Par défaut',
};

/**
 * Étape de confirmation avant suspension.
 */
export const Confirm: Story = {
    name: 'Confirmation',
    args: {
        username: 'spammer_account',
    },
    parameters: {
        docs: {
            description: {
                story: 'Prêt à confirmer la suspension de l\'utilisateur.',
            },
        },
    },
};