import React from 'react';
import { StoryFn, Meta } from '@storybook/react';
import SourceList from './SourceList';
import sampleSources from '../__mocks__/sample-sources.json';
import { ResourceBrowserSource } from '../types';

export default {
    title: 'Source list',
    component: SourceList,
} as Meta<typeof SourceList>;

const Template: StoryFn<typeof SourceList> = (props) => {
    const sources = sampleSources as ResourceBrowserSource[];
    return (
        <div className="flex justify-center m-3">
            <SourceList
                sources={sources}
                onSourceSelect={(source) => {
                    console.log(`Source ${source?.name} / ${source.id} was selected`);
                }}
            ></SourceList>
        </div>
    );
};

export const Primary = Template.bind({});

Primary.args = {};