/**
 * React Native Full App (https://store.enappd.com/product/react-native-full-app)
 *
 * Copyright © 2019-present Enappd. All rights reserved.
 *
 * This source code is licensed as per the terms found in the
 * LICENSE.md file in the root directory of this source tree.
 */
import React, { Component } from 'react';
import getTheme from '../../../../native-base-theme/components';
import material from '../../../../native-base-theme/variables/materialStar';
import {
  Tab,
  Tabs,
  TabHeading,
  StyleProvider,
  Icon,
  Container,
} from 'native-base';
import TinderCardsContainer from '../../../views/star/tinderCards/tinder/tinderCardsContainer';
import WhatsappListContainer from '../../../views/star/tinderCards/whatsAppList/whatsappListContainer';
import HeaderViewContainer from '../header/headerViewContainer';
import { NavigationDrawerScreenProps } from 'react-navigation-drawer';

interface TinderTabsProps extends NavigationDrawerScreenProps {
  cardsState: any;
  renderCard: any;
  onSwipedAllCards: () => void;
  cardIndex: number;
  overlayLabels: any;
  onSwiped: (type: any) => void;
  swipeLeft: () => void;
  swipeBack: () => void;
  swipeRight: () => void;
  swipeTop: () => void;
  getSwiperData: (type: any) => void;
  toggleDrawer: (type: any) => void;
  containerColor: string;
}
class TinderTabs extends React.Component<TinderTabsProps> {
  constructor(props: any) {
    super(props);
    this.state = {};
  }
  toggleDrawer = () => {
    this.props.navigation.toggleDrawer();
  };
  render() {
    return (
      <StyleProvider style={getTheme(material)}>
        <Container>
          <HeaderViewContainer
            hasTabs
            leftIcon={'menu'}
            headerTitle={'Tinder'}
            leftPress={() => this.toggleDrawer()}
          />
          <Tabs
            tabBarPosition="top"
            tabBarUnderlineStyle={{ backgroundColor: '#f53d3d' }}
            locked={true}
          >
            <Tab
              heading={
                <TabHeading>
                  <Icon name="flame" />
                </TabHeading>
              }
            >
              <TinderCardsContainer />
            </Tab>

            <Tab
              heading={
                <TabHeading>
                  <Icon name="chatbubbles" />
                </TabHeading>
              }
            >
              <WhatsappListContainer />
            </Tab>
          </Tabs>
        </Container>
      </StyleProvider>
    );
  }
}

export default TinderTabs;
