{"size": 2777, "ext": "js", "max_stars_repo_path": "screen/callScreen.js", "max_stars_repo_name": "nis130/vcallx-mobile-app", "max_stars_repo_stars_event_min_datetime": "2021-03-01T15:11:46.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-15T15:40:59.000Z", "max_issues_repo_path": "screen/callScreen.js", "max_issues_repo_name": "nis130/vcallx-mobile-app", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "screen/callScreen.js", "max_forks_repo_name": "nis130/vcallx-mobile-app", "max_forks_repo_forks_event_min_datetime": "2022-02-21T13:21:50.000Z", "max_forks_repo_forks_event_max_datetime": "2022-02-21T13:21:50.000Z"}
{"max_stars_count": 2, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 22.216, "max_line_length": 90, "alphanum_fraction": 0.5722002161}
import React from 'react';
import {
  View,
  Text,
  StyleSheet,
  Dimensions,
  Image,
  ToastAndroid,
} from 'react-native';
import Accept from '../components/button';

class CallRecievedScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      onConnecting: false,
    };
  }
  showToastWithGravity = () => {
    ToastAndroid.showWithGravity('connecting', ToastAndroid.SHORT);
  };

  disconnect = () => {
    this.props.navigation.navigate('home');
    this.props.route.params.dissconect();
  };

  createAnswer = () => {
    this.setState({
      onConnecting: true,
    });
    this.showToastWithGravity();
    this.props.route.params.createAnswer();
  };
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.mainView}>
          <View style={styles.imageSection}>
            <Image
              style={styles.avatar}
              source={{
                uri:
                  'https://cdn.pixabay.com/photo/2013/07/13/10/07/man-156584_960_720.png',
              }}
            />
          </View>
          <Text style={styles.caller}> {this.props.route.params.caller} </Text>
          <View style={styles.buttonSection}>
            <Accept
              name="phone"
              backgroundColor="#26ae60"
              callBackFunction={this.props.route.params.createAnswer}
            />
            <Accept
              name="phone-hangup"
              backgroundColor="red"
              callBackFunction={this.disconnect}
            />
          </View>
        </View>
      </View>
    );
  }
}
const dimensions = Dimensions.get('screen');
var fontColor = 'white';
var backgroundColor = '#6A45BB';
const styles = StyleSheet.create({
  container: {
    flex: 1,
    height: dimensions.height,
    width: dimensions.width,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: backgroundColor,
  },
  mainView: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  imageSection: {
    flex: 5,
    justifyContent: 'flex-end',
  },
  avatar: {
    height: 120,
    width: 120,
    marginBottom: 20,
    borderRadius: 100,
    borderWidth: 2,
    borderColor: 'white',
  },
  caller: {
    fontSize: 25,
    flex: 2,
    alignItems: 'center',
    color: fontColor,
    fontWeight: 'bold',
  },
  buttonSection: {
    flex: 5,
    alignItems: 'center',
    justifyContent: 'center',
    flexDirection: 'row',
  },
  buttonStyles: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  answer: {
    borderWidth: 2,
    borderRadius: 50,
    backgroundColor: '#26ae60',
  },
  decline: {
    borderWidth: 2,
    borderRadius: 50,
    backgroundColor: 'red',
  },
});
export default CallRecievedScreen;
