import { jsx as _jsx } from "react/jsx-runtime";
import { useEffect } from 'react';
import { fn } from '@storybook/test';
import { StateGroup } from '../../../../../../packages/core/src/domain/generated/output.js';
import { BulkActionToolbar } from './bulk-action-toolbar.js';
import { BulkSelectionProvider, useBulkSelection } from './bulk-selection-context.js';
const mockStates = [
    {
        id: 's1',
        projectId: 'proj-1',
        name: 'Backlog',
        color: '#a3a3a3',
        stateGroup: StateGroup.Backlog,
        displayOrder: 0,
        isDefault: true,
        createdAt: new Date(),
        updatedAt: new Date(),
    },
    {
        id: 's2',
        projectId: 'proj-1',
        name: 'Todo',
        color: '#3b82f6',
        stateGroup: StateGroup.Unstarted,
        displayOrder: 1,
        isDefault: false,
        createdAt: new Date(),
        updatedAt: new Date(),
    },
    {
        id: 's3',
        projectId: 'proj-1',
        name: 'In Progress',
        color: '#f59e0b',
        stateGroup: StateGroup.Started,
        displayOrder: 2,
        isDefault: false,
        createdAt: new Date(),
        updatedAt: new Date(),
    },
    {
        id: 's4',
        projectId: 'proj-1',
        name: 'Done',
        color: '#22c55e',
        stateGroup: StateGroup.Completed,
        displayOrder: 3,
        isDefault: false,
        createdAt: new Date(),
        updatedAt: new Date(),
    },
    {
        id: 's5',
        projectId: 'proj-1',
        name: 'Cancelled',
        color: '#ef4444',
        stateGroup: StateGroup.Cancelled,
        displayOrder: 4,
        isDefault: false,
        createdAt: new Date(),
        updatedAt: new Date(),
    },
];
const mockBulkAction = fn(async () => ({
    ok: true,
    succeeded: ['wi-1', 'wi-2', 'wi-3'],
    failed: [],
}));
const mockBulkActionWithFailure = fn(async () => ({
    ok: false,
    succeeded: ['wi-1'],
    failed: [
        { id: 'wi-2', error: 'Item locked' },
        { id: 'wi-3', error: 'Permission denied' },
    ],
}));
/**
 * Helper component that pre-selects items so the toolbar appears.
 */
function PreSelectItems({ ids, children }) {
    const { selectAll } = useBulkSelection();
    useEffect(() => {
        selectAll(ids);
    }, []); // eslint-disable-line react-hooks/exhaustive-deps
    return children;
}
const meta = {
    title: 'PM/BulkOperations/BulkActionToolbar',
    component: BulkActionToolbar,
    parameters: {
        layout: 'padded',
    },
    tags: ['autodocs'],
    decorators: [
        (Story) => (_jsx(BulkSelectionProvider, { children: _jsx(PreSelectItems, { ids: ['wi-1', 'wi-2', 'wi-3'], children: _jsx("div", { style: { minHeight: '200px' }, children: _jsx(Story, {}) }) }) })),
    ],
};
export default meta;
export const Default = {
    args: {
        states: mockStates,
        onBulkAction: mockBulkAction,
    },
};
export const SingleItemSelected = {
    args: {
        states: mockStates,
        onBulkAction: mockBulkAction,
    },
    decorators: [
        (Story) => {
            const { selectAll } = useBulkSelection();
            useEffect(() => {
                selectAll(['wi-1']);
            }, []); // eslint-disable-line react-hooks/exhaustive-deps
            return _jsx(Story, {});
        },
    ],
};
export const WithFailure = {
    args: {
        states: mockStates,
        onBulkAction: mockBulkActionWithFailure,
    },
};
export const ManyItemsSelected = {
    args: {
        states: mockStates,
        onBulkAction: mockBulkAction,
    },
    decorators: [
        (Story) => {
            const { selectAll } = useBulkSelection();
            useEffect(() => {
                selectAll(Array.from({ length: 25 }, (_, i) => `wi-${i + 1}`));
            }, []); // eslint-disable-line react-hooks/exhaustive-deps
            return _jsx(Story, {});
        },
    ],
};
