<commit_before>'use strict';

require('../stylesheets/react-spinner.css');

import React, { Component, PropTypes } from 'react';
import { Button, Col, Grid, Row } from 'react-bootstrap';
import Spinner from './Spinner';
import TripIdeas from '../containers/TripIdeas';
import { viewTripsPage } from '../actions/navigation';

class TripPage extends Component {
  componentWillMount() {
    const { tripId } = this.props.params;
    const { onGetTrip, trip } = this.props;

    // Fetch the trip from the server upon load
    if (!trip) {
      onGetTrip(tripId);
    }
  }

  render() {
    const { error, trip } = this.props;

    if (error) {
      return (
        <div>{error}</div>
      );
    }

    if (!trip) {
      return (
        <div>
          <p style={styles.loadingText}>Loading Trip</p>
          <div>
            <Spinner />
          </div>
        </div>
      );
    }

    const tripPlan = trip.plan.map(day => {
      return (
        <p key={day._id}>Day</p>
      );
    });

    return (
      <Grid>
        <Row>
          <Col md={12} style={styles.titleSection}>
            <h1 style={styles.h1}>{trip.title}</h1>
            <p>Destination: {trip.destination && trip.destination.name}</p>
            <p>Visibility: {trip.visibility}</p>
          </Col>
        </Row>
        <Row>
          <Col md={4}>
            <TripIdeas />
          </Col>
          <Col md={8}>
            <h3>Plan</h3>
            <div>{tripPlan}</div>
          </Col>
        </Row>
        <Row>
          <Col>
            <Button
              bsStyle="primary"
              onClick={viewTripsPage}>
              Home
            </Button>
          </Col>
        </Row>
      </Grid>
    );
  }
}

TripPage.propTypes = {
  error: PropTypes.string,
  onGetTrip: PropTypes.func.isRequired,
  trip: PropTypes.object
};

const styles = {
  titleSection: {
    textAlign: 'center'
  },
  h1: {
    fontSize: 48
  },
  loadingText: {
    color: '#333333',
    fontFamily: 'Arial',
    fontSize: 24,
    textAlign: 'center',
    margin: 20
  }
};

export default TripPage;<commit_msg>Move away from bootstrap grid layout for now<commit_after>'use strict';

require('../stylesheets/react-spinner.css');

import React, { Component, PropTypes } from 'react';
import { Button } from 'react-bootstrap';
import Spinner from './Spinner';
import TripIdeas from '../containers/TripIdeas';
import { viewTripsPage } from '../actions/navigation';

class TripPage extends Component {
  componentWillMount() {
    const { tripId } = this.props.params;
    const { onGetTrip, trip } = this.props;

    // Fetch the trip from the server upon load
    if (!trip) {
      onGetTrip(tripId);
    }
  }

  render() {
    const { error, trip } = this.props;

    if (error) {
      return (
        <div>{error}</div>
      );
    }

    // Loading UI
    if (!trip) {
      return (
        <div>
          <p style={styles.loadingText}>Loading Trip</p>
          <div>
            <Spinner />
          </div>
        </div>
      );
    }

    const tripPlan = trip.plan.map(day => {
      return (
        <p key={day._id}>Day</p>
      );
    });

    const titleSection = (
      <div style={styles.titleSection}>
        <h1 style={styles.h1}>{trip.title}</h1>
        <p>Destination: {trip.destination && trip.destination.name}</p>
        <p>Visibility: {trip.visibility}</p>
      </div>
    );

    return (
      <div>
        <div style={styles.leftColumn}>
          {titleSection}
          <TripIdeas />
          <Button
            bsStyle="primary"
            onClick={viewTripsPage}>
            Home
          </Button>
        </div>
        <div>
          <h1>Map</h1>
        </div>
      </div>
    );
  }
}

TripPage.propTypes = {
  error: PropTypes.string,
  onGetTrip: PropTypes.func.isRequired,
  trip: PropTypes.object
};

const styles = {
  h1: {
    fontSize: 32
  },
  leftColumn: {
    float: 'left',
    padding: '0 20 0',
    width: 400
  },
  loadingText: {
    color: '#333333',
    fontFamily: 'Arial',
    fontSize: 24,
    textAlign: 'center',
    margin: 20
  },
  titleSection: {
    marginBottom: 30
  }
};

export default TripPage;
{'fraction_non_alphanumeric': 0.1514497963096094, 'fraction_numerical': 0.011742151929067817, 'mean_word_length': 1.8336727766463001, 'pattern_counts': {'":': 0, '<': 73, '<?xml version=': 0, '>': 75, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1430749', 'n_tokens_mistral': 1414, 'n_tokens_neox': 1347, 'n_words': 290}