{"size": 2553, "ext": "js", "max_stars_repo_path": "src/screens/ShippingAddress.js", "max_stars_repo_name": "knocknockguesswho/Glamour-Shop", "max_stars_repo_stars_event_min_datetime": "2020-08-24T04:42:04.000Z", "max_stars_repo_stars_event_max_datetime": "2020-08-24T04:42:04.000Z", "max_issues_repo_path": "src/screens/ShippingAddress.js", "max_issues_repo_name": "knocknockguesswho/Glamour-Shop", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/screens/ShippingAddress.js", "max_forks_repo_name": "knocknockguesswho/Glamour-Shop", "max_forks_repo_forks_event_min_datetime": "2020-08-18T10:15:01.000Z", "max_forks_repo_forks_event_max_datetime": "2020-08-18T10:15:01.000Z"}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 25.53, "max_line_length": 79, "alphanum_fraction": 0.5832354093}
import React, {Component} from 'react';
import {Dimensions, StyleSheet, View} from 'react-native';
import {Button, SearchBar} from '../components/atoms';
import {AddressList, HeaderBackButton} from '../components/molecules';
import {connect} from 'react-redux';
import {getAddress} from '../redux/actions/address';

class ShippingAddress extends Component {
  constructor(props) {
    super(props);
    this.state = {
      search: '',
      address: null,
    };
  }

  fetchAddress = async () => {
    const {dispatch, auth, address} = this.props;
    const token = auth.data.token;
    await dispatch(getAddress(token))
      .then((res) => {
        // this.setState({address: address.data});
        if (address.data.length === 0) {
          return this.setState({address: null});
        }
        return this.setState({address: address.data});
        // console.log(address.data.length, 'address');
      })
      .catch((err) => {
        console.log(err);
      });
  };

  handleBackButton = () => {
    this.props.navigation.goBack();
  };

  handleGoToChangeAddress = () => {
    this.props.navigation.push('ChangeAddress');
  };

  componentDidMount() {
    this.fetchAddress();
  }

  render() {
    const {navigation} = this.props;
    return (
      <View style={styles.mainContainer}>
        <HeaderBackButton
          submit={this.handleBackButton}
          middleComponent={true}
          midCompTitle="Shipping Address"
        />
        {/* <View style={styles.searchBarContainer}>
          <SearchBar
            placeholder="Search"
            value={this.state.search}
            type="web-search"
          />
        </View> */}
        <View style={styles.addressList}>
          <AddressList title="Shipping Address" address={this.state.address} />
        </View>
        <View>
          <Button
            title="ADD NEW ADDRESS"
            big={true}
            type="outline"
            submit={() => navigation.navigate('AddShippingAddress')}
          />
        </View>
      </View>
    );
  }
}

const {height, width} = Dimensions.get('screen');
const styles = StyleSheet.create({
  mainContainer: {
    height: height,
    width: width,
    flex: 1,
    alignSelf: 'center',
  },
  searchBarContainer: {
    marginTop: width * 0.05,
    marginBottom: width * 0.03,
    alignItems: 'center',
  },
  addressList: {
    marginBottom: width * 0.04,
  },
});
const mapStateToProps = (state) => ({
  auth: state.auth,
  address: state.address,
});
export default connect(mapStateToProps)(ShippingAddress);
