{"size": 1958, "ext": "js", "max_stars_repo_path": "app/screens/Groups/GroupsScreen.js", "max_stars_repo_name": "hannahw1ll1ams/trackeroo-client", "max_stars_repo_stars_event_min_datetime": "2019-10-10T13:30:49.000Z", "max_stars_repo_stars_event_max_datetime": "2019-10-10T21:24:24.000Z", "max_issues_repo_path": "app/screens/Groups/GroupsScreen.js", "max_issues_repo_name": "hannahw1ll1ams/trackeroo-client", "max_issues_repo_issues_event_min_datetime": "2021-10-06T05:33:35.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-18T12:16:02.000Z", "max_forks_repo_path": "app/screens/Groups/GroupsScreen.js", "max_forks_repo_name": "hannahw1ll1ams/trackeroo-client", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": 2, "max_forks_count": null, "avg_line_length": 28.3768115942, "max_line_length": 88, "alphanum_fraction": 0.5449438202}
import styles from './styles';
import React, { Component } from 'react';
import { View, Text, Button, Image } from 'react-native';
import { List, ListItem } from 'react-native-elements';
import ViewToggler from '../../components/ViewToggler';

class GroupsScreen extends Component {
  state = {
    groups: [
      {
        title: 'Northcoders',
        img:
          'https://s3.amazonaws.com/uifaces/faces/twitter/adhamdannaway/128.jpg'
      },
      {
        title: 'FunRun',
        img: 'https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg'
      }
    ]
  };
  static navigationOptions = ({ navigation }) => {
    return {
      header: null
    };
  };
  onPress = (event, title) => {
    const { navigate } = this.props.navigation;
    const groupName = 'Trackeroo - ' + title;
    navigate('HomeScreen', { title: 'Home', groupName });
  };

  postNewGroup = newGroup => {
    this.setState(currentState => {
      return { groups: [...currentState.groups, newGroup] };
    });
  };

  render() {
    const { groups } = this.state;
    console.log(groups);
    return (
      <View style={styles.groups}>
        {/* <Image source={require('./fabio.jpg')} style={styles.backgroundImage} /> */}
        <Text style={styles.text}>Your current groups: </Text>
        {groups.map(group => {
          return (
            <ListItem
              key={group.title}
              title={group.title}
              bottomDivider
              rightTitle="View Group"
              onPress={event => this.onPress(event, group.title)}
              leftAvatar={{ source: { uri: group.img } }}
            />
            // <Button
            //   key={group.title}
            //   title={group.title}
            //   onPress={event => this.onPress(event, group.title)}
            // />
          );
        })}
        <ViewToggler item="group" postNewGroup={this.postNewGroup} />
      </View>
    );
  }
}

export default GroupsScreen;
