import React from 'react';

import { createDrawerNavigator } from '@react-navigation/drawer';
import { NavigationContainer } from '@react-navigation/native';

import TextFieldsDefault from './snacks/textfields-default/App';
import TextFieldsPrefilled from './snacks/textfields-prefilled/App';
import TextFieldsError from './snacks/textfields-error/App';
import TextFieldsValid from './snacks/textfields-valid/App';
import TextFieldsDisabled from './snacks/textfields-disabled/App';
import TextFieldsDisabledPrefilled from './snacks/textfields-disabled-prefilled/App';
import TextFieldsPassword from './snacks/textfields-password/App';
import TextAllSizes from './snacks/text-all-sizes/App';
import TextOneSize from './snacks/text-one-size/App';
import BasicBackgroundColor from './snacks/basic-background-colors/App';
import BasicBackgroundColorPromo from './snacks/basic-background-colors-promo/App';
import BasicBackgroundColorStatus from './snacks/basic-background-colors-status/App';
import BasicBackgroundColorAll from './snacks/basic-background-colors-all/App';
import BasicIcons from './snacks/basic-icons/App';
import BasicNucleoIcons from './snacks/basic-nucleo-icons/App';
import PrimaryButtons from './snacks/buttons-primary/App';
import SecondaryButtons from './snacks/buttons-secondary/App';
import TertiaryButtons from './snacks/buttons-tertiary/App';
import OrderButtons from './snacks/buttons-order/App';
import PrimaryFullWidthButtons from './snacks/buttons-primary-fullwidth/App';
import SecondaryFullWidthButtons from './snacks/buttons-secondary-fullwidth/App';
import OrderFullWidthButtons from './snacks/buttons-order-fullwidth/App';
import ActionLinksLeft from './snacks/action-links-left/App';
import ActionLinksRight from './snacks/action-links-right/App';
import SelectableBoxRadioButton from './snacks/selectablebox-radio/App';
import SelectableBoxCheckBox from './snacks/selectablebox-checkbox/App';
import InputsCheckBox from './snacks/inputs-checkbox/App';
import ButtonsRadio from './snacks/buttons-radio/App';
import EntryPoints from './snacks/entrypoints/App';
import ProgressIndicator from './snacks/progress-indicator/App';
import InputCounter from './snacks/inputs-counter/App';
import Panels from './snacks/panels/App';
import Pagination from './snacks/snack-pagination/App';
import Bubble from './snacks/bubble/App';
import PatchPromo from './snacks/patch-promo/App';
import MessageBox from './snacks/message-box/App';

const Drawer = createDrawerNavigator();

console.disableYellowBox = true;

const screens: { component: () => JSX.Element; name: string }[] = [
  // {
  //   name: 'Read More',
  //   component: ReadMore,
  // },
  {
    name: 'TextField default',
    component: TextFieldsDefault,
  },
  {
    name: 'Textfield prefilled',
    component: TextFieldsPrefilled,
  },
  {
    name: 'Textfield error',
    component: TextFieldsError,
  },
  {
    name: 'Textfields valid',
    component: TextFieldsValid,
  },
  {
    name: 'Textfields disabled',
    component: TextFieldsDisabled,
  },
  {
    name: 'Textfields disabled prefilled',
    component: TextFieldsDisabledPrefilled,
  },
  {
    name: 'Textfields password',
    component: TextFieldsPassword,
  },
  {
    name: 'Text all sizes',
    component: TextAllSizes,
  },
  {
    name: 'Text one size',
    component: TextOneSize,
  },
  {
    name: 'Basic background colors',
    component: BasicBackgroundColor,
  },
  {
    name: 'Basic background colors Promo',
    component: BasicBackgroundColorPromo,
  },
  {
    name: 'Basic background colors Status',
    component: BasicBackgroundColorStatus,
  },
  {
    name: 'Basic background colors All',
    component: BasicBackgroundColorAll,
  },
  {
    name: 'Basic icons',
    component: BasicIcons,
  },
  {
    name: 'Basic Nucleo icons',
    component: BasicNucleoIcons,
  },
  {
    name: 'Primary buttons',
    component: PrimaryButtons,
  },
  {
    name: 'Secondary buttons',
    component: SecondaryButtons,
  },
  {
    name: 'Tertiary buttons',
    component: TertiaryButtons,
  },
  {
    name: 'Order buttons',
    component: OrderButtons,
  },
  {
    name: 'Primary fullwidth button',
    component: PrimaryFullWidthButtons,
  },
  {
    name: 'Secondary fullwidth button',
    component: SecondaryFullWidthButtons,
  },
  {
    name: 'Order fullwidth button',
    component: OrderFullWidthButtons,
  },
  {
    name: 'Action Link left',
    component: ActionLinksLeft,
  },
  {
    name: 'Action Link right',
    component: ActionLinksRight,
  },
  {
    name: 'Selectable Box Radio',
    component: SelectableBoxRadioButton,
  },
  {
    name: 'Selectable Box Checkbox',
    component: SelectableBoxCheckBox,
  },
  {
    name: 'Checkbox',
    component: InputsCheckBox,
  },
  {
    name: 'Radio',
    component: ButtonsRadio,
  },
  {
    name: 'Entry points',
    component: EntryPoints,
  },
  {
    name: 'Progress indicator',
    component: ProgressIndicator,
  },
  {
    name: 'Inputs -  counter',
    component: InputCounter,
  },
  {
    name: 'Panels - PxPanel',
    component: Panels,
  },
  {
    name: 'Pagination',
    component: Pagination,
  },
  {
    name: 'Bubble',
    component: Bubble,
  },
  {
    name: 'Patch-Promo',
    component: PatchPromo,
  },
  {
    name: 'Message-Box',
    component: MessageBox,
  },
];
export default function () {
  return (
    <NavigationContainer>
      <Drawer.Navigator>
        {screens.map((screenProps, index) => (
          <Drawer.Screen {...screenProps} key={index} />
        ))}
      </Drawer.Navigator>
    </NavigationContainer>
  );
}