<commit_before>import React from 'react'
import { Grid, Navbar, Row, Jumbotron, Button, Col } from 'react-bootstrap'
import { login, logout } from '../api/auth'
import { AppsProvider, withUser } from '../providers'
import AppList from './AppList'
import PlaylistEditor from './PlaylistEditor'

let Manager = ({ signedIn }) =>
  <div>
    <Navbar>
      <Grid>
        <Navbar.Header>
          <Navbar.Brand>
            <a href="/">Digital Signage Manager</a>
          </Navbar.Brand>
          <Navbar.Toggle />
          <LoginButton signedIn={signedIn} />
        </Navbar.Header>
      </Grid>
    </Navbar>

    <AppsProvider>
      <Grid>

      {!signedIn &&
        <Jumbotron>
          <p><Button onClick={login}>Sign in</Button> to edit the playlist.</p>
        </Jumbotron>}

      <Row>
        <Col xs={6}>
          <h2>Playlist</h2>
          <PlaylistEditor editable={signedIn} />
        </Col>

        <Col xs={6}>
          <h2>Applications</h2>
          <AppList />
        </Col>
      </Row>
    </Grid>
  </AppsProvider>

  <footer className="footer">
    <div className="container">
      <p className="text-muted">
        This application manages digital signage.
      </p>
      <p className="text-muted">
        It manages a list of applications, and a playlist that sequences
        those applications.
      </p>
    </div>
  </footer>
</div>
export default  withUser(Manager)
<commit_msg>move header, footer to own components<commit_after>import React from 'react'
import { Grid, Navbar, Row, Jumbotron, Button, Col } from 'react-bootstrap'
import { login, logout } from '../api/auth'
import { AppsProvider, withUser } from '../providers'
import AppList from './AppList'
import PlaylistEditor from './PlaylistEditor'

const Manager = ({ signedIn }) =>
  <div>
    <Header signedIn={signedIn} />

    <AppsProvider>
      <Grid>

      {!signedIn &&
        <Jumbotron>
          <p><Button onClick={login}>Sign in</Button> to edit the playlist.</p>
        </Jumbotron>}

      <Row>
        <Col xs={6}>
          <h2>Playlist</h2>
          <PlaylistEditor editable={signedIn} />
        </Col>

        <Col xs={6}>
          <h2>Applications</h2>
          <AppList />
        </Col>
      </Row>
    </Grid>
  </AppsProvider>

  <Footer />
</div>
export default withUser(Manager)

const Header = ({ signedIn }) =>
  <Navbar>
    <Grid>
      <Navbar.Header>
        <Navbar.Brand>
          <a href="/">Digital Signage Manager</a>
        </Navbar.Brand>
        <Navbar.Toggle />
        <LoginButton signedIn={signedIn} />
      </Navbar.Header>
    </Grid>
  </Navbar>

const Footer = () =>
  <footer className="footer">
    <div className="container">
      <p className="text-muted">
        This application manages digital signage.
      </p>
      <p className="text-muted">
        It manages a list of applications, and a playlist that sequences
        those applications.
      </p>
    </div>
  </footer>

{'fraction_non_alphanumeric': 0.14782315221059736, 'fraction_numerical': 0.004049949375632805, 'mean_word_length': 2.1734475374732334, 'pattern_counts': {'":': 0, '<': 93, '<?xml version=': 0, '>': 97, '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': '3912431', 'n_tokens_mistral': 950, 'n_tokens_neox': 920, 'n_words': 235}