import { ComponentStory, ComponentMeta } from '@storybook/react';
import { Container } from 'components/layout';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { User } from './index';

export default {
  title: 'App Components/ Room / Header User',
  component: User,
  argTypes: {
    status: {
      options: ['pending', 'downloading', 'downloaded'],
      control: { type: 'select' },
    },
  },
} as ComponentMeta<typeof User>;

export const Interactive: ComponentStory<typeof User> = (args) => {
  return (
    <SafeAreaProvider>
      <Container mt={20} width={400}>
        <User {...args} />
      </Container>
    </SafeAreaProvider>
  );
};

Interactive.args = {
  isOpen: false,
  isPopUp: false,
  user: {
    profilePhoto: 'https://avatars.githubusercontent.com/u/98377997',
    username: 'Muhammad Sarmad',
  },
  isDivider: true,
  isCaption: true,
  caption: 'last seen 48 hours ago',
};
