text: import React from 'react';
  
  import QRCode from 'react-native-qrcode';
  import Icon from 'react-native-vector-icons/MaterialIcons';
  
  import { Container, Code, Nav, NavItem, NavText, SingOutButton, SingOutButtonText } from './styles';
  
  export default function Menu({ translateY }) {
      return (
          
          // Decreasing the opacity of the main menu as the white card descends
          <Container style={{
              opacity: translateY.interpolate({
                  inputRange: [0, 150],
                  outputRange: [0, 1],
              }),
          }}>
  
              {/* Creating QRCode */}
              <Code>
                  <QRCode 
                      value='https://rocketseat.com.br'
                      size={80}
                      fgColor='#FFF'
                      bgColor='#8B10AE'
                  />
              </Code>
  
              {/* Creating the main menu navigation */}
              <Nav>
                  <NavItem>
                      <Icon name='help-outline' size={20} color='#FFF' />
                      <NavText>Help me</NavText>
                  </NavItem>
                  <NavItem>
                      <Icon name='person-outline' size={20} color='#FFF' />
                      <NavText>Profile</NavText>
                  </NavItem>
                  <NavItem>
                      <Icon name='credit-card' size={20} color='#FFF' />
                      <NavText>Set up card</NavText>
                  </NavItem>
                  <NavItem>
                      <Icon name='smartphone' size={20} color='#FFF' />
                      <NavText>App settings</NavText>
                  </NavItem>
              </Nav>
  
              {/* Creating output button */}
              <SingOutButton onPress={() => {}}>
                  <SingOutButtonText>LEAVE THE APP</SingOutButtonText>
              </SingOutButton>
              
          </Container>
      );
  }