{"size": 2573, "ext": "js", "max_stars_repo_path": "components/Header.js", "max_stars_repo_name": "velas/mobile-wallet", "max_stars_repo_stars_event_min_datetime": "2021-02-02T06:46:43.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-09T14:50:03.000Z", "max_issues_repo_path": "components/Header.js", "max_issues_repo_name": "velas/mobile-wallet", "max_issues_repo_issues_event_min_datetime": "2021-01-17T20:22:40.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-23T18:40:46.000Z", "max_forks_repo_path": "components/Header.js", "max_forks_repo_name": "velas/mobile-wallet", "max_forks_repo_forks_event_min_datetime": "2021-05-22T08:45:18.000Z", "max_forks_repo_forks_event_max_datetime": "2022-03-24T15:14:50.000Z"}
{"max_stars_count": 11, "max_issues_count": 52, "max_forks_count": 9, "avg_line_length": 24.7403846154, "max_line_length": 79, "alphanum_fraction": 0.4931986009}
import React from 'react';
import {
  Container,
  Header,
  Left,
  Body,
  Right,
  Title,
  Icon,
  Button,
  Thumbnail,
  Text,
  View,
  Toast,
} from 'native-base';
import IdentIcon from '../components/Identicon.js';
import BackButton from '../components/BackButton.js';
import StatusBar from '../components/StatusBar.js';
import styles from '../Styles.js';
import { useNetInfo } from '@react-native-community/netinfo';

export default (props) => {
  const connectivityChange = () => {
    const netInfo = useNetInfo();
    // console.log('netInfo', netInfo)
    if (
      !netInfo.details ||
      netInfo.isConnected === true ||
      netInfo.type === 'cellular' ||
      netInfo.type === 'wifi'
    ) {
      return null;
    } else {
      console.log('No Internet');
      Toast.show({
        text: 'No Internet Connection',
        position: 'top',
        duration: 3000,
        type: 'warning',
        style: { top: 15 },
      });
    }
  };
  return (
    <>
      <Header
        style={[
          props.transparent
            ? {
                backgroundColor: 'transparent',
                borderBottomColor: 'transparent',
              }
            : styles.headerBg,
          styles.marginTopAndroid,
        ]}
        androidStatusBarColor="black"
        noShadow={false}
      >
        <Left>
          {props.onBack && (
            <BackButton
              onBack={props.onBack}
              style={props.greenBack ? styles.leftBtnColor : { color: '#fff' }}
            />
          )}
          {props.onBackHandlerOnly && (
            <BackButton onBack={props.onBackHandlerOnly} transparent />
          )}
        </Left>
        <Body>
          <Title
            style={
              props.smallTitle ? styles.headerTitleSmall : styles.headerTitle
            }
          >
            {props.title}
          </Title>
        </Body>
        <Right>
          {props.identIcon && (
            <IdentIcon
              {...props}
              address={props.identIcon}
              size={20}
              backgroundColor={'rgba(22, 26, 63, 1)'}
              //   marginRight={15}
            />
          )}
          {props.addWalletIcon && (
            <Button transparent onPress={props.onForward}>
              <Icon name="md-create" style={styles.refreshHeaderIcon} />
            </Button>
          )}
          {props.coin && (
            <Thumbnail square small source={{ uri: props.coin }} />
          )}
        </Right>
      </Header>
      <StatusBar />
      {connectivityChange()}
    </>
  );
};
