import { storiesOf } from '@storybook/react-native';
import * as React from 'react';

import { StoryScreen, Story, UseCase } from '~/storybook/views';

import { RemoteConfigVariables } from './remote-config-variables';
import { Variables } from './remote-config-variables.props';

const MOCK_REMOTE_CONFIG: Variables = [
  { key: 'cameraBarcodeReadTimeout', value: 500 },
  { key: 'dismissTimeout', value: 1500 },
  { key: 'interactionTimeout', value: 4000 },
  {
    key: 'scannersList',
    value: [
      {
        brand: 'Eyoyo',
        characteristic: '00002aa1-0000-1000-8000-00805f9b34fb',
        model: 'MJ-R30',
        nameOrId: 'BarCode ScannerBLE',
        service: '0000feea-0000-1000-8000-00805f9b34fb',
      },
      {
        brand: 'GeneralScan',
        characteristic: '0000fff1-0000-1000-8000-00805f9b34fb',
        model: 'GS R1000BT-HP',
        nameOrId: 'GS-BarcodeScanner  BT4.0',
        service: '0000fff0-0000-1000-8000-00805f9b34fb',
      },
    ],
  },
];

storiesOf('RemoteConfigVariables', module)
  .addDecorator((fn) => <StoryScreen>{fn()}</StoryScreen>)
  .add('Default', () => (
    <Story>
      <UseCase text="Remote config visualization" usage="Show all variables">
        <RemoteConfigVariables variables={MOCK_REMOTE_CONFIG} />
      </UseCase>
    </Story>
  ));
