From bb4ebed08c3f1b1a7ba9968ede75a07f1705d2df Mon Sep 17 00:00:00 2001 From: Quentin Gliech Date: Sat, 18 Aug 2018 17:00:53 -0400 Subject: webui: Format everything with prettier --- webui/src/App.js | 38 +++++++-------- webui/src/Author.js | 22 ++++----- webui/src/Date.js | 12 ++--- webui/src/Label.js | 32 ++++++------- webui/src/bug/Bug.js | 52 ++++++++++----------- webui/src/bug/BugQuery.js | 28 +++++------ webui/src/bug/LabelChange.js | 48 +++++++++++-------- webui/src/bug/Message.js | 26 +++++------ webui/src/bug/SetStatus.js | 25 +++++----- webui/src/bug/SetTitle.js | 28 +++++------ webui/src/bug/Timeline.js | 47 +++++++++---------- webui/src/bug/TimelineQuery.js | 41 +++++++++------- webui/src/index.js | 22 ++++----- webui/src/list/BugRow.js | 54 ++++++++++----------- webui/src/list/List.js | 103 ++++++++++++++++++++--------------------- webui/src/list/ListQuery.js | 36 +++++++------- 16 files changed, 314 insertions(+), 300 deletions(-) (limited to 'webui/src') diff --git a/webui/src/App.js b/webui/src/App.js index 47a31e45..3a693dcb 100644 --- a/webui/src/App.js +++ b/webui/src/App.js @@ -1,25 +1,25 @@ -import AppBar from '@material-ui/core/AppBar' -import CssBaseline from '@material-ui/core/CssBaseline' -import { withStyles } from '@material-ui/core/styles' -import Toolbar from '@material-ui/core/Toolbar' -import Typography from '@material-ui/core/Typography' -import React from 'react' -import { Route, Switch, withRouter } from 'react-router' -import { Link } from 'react-router-dom' +import AppBar from '@material-ui/core/AppBar'; +import CssBaseline from '@material-ui/core/CssBaseline'; +import { withStyles } from '@material-ui/core/styles'; +import Toolbar from '@material-ui/core/Toolbar'; +import Typography from '@material-ui/core/Typography'; +import React from 'react'; +import { Route, Switch, withRouter } from 'react-router'; +import { Link } from 'react-router-dom'; -import BugQuery from './bug/BugQuery' -import ListQuery from './list/ListQuery' +import BugQuery from './bug/BugQuery'; +import ListQuery from './list/ListQuery'; const styles = theme => ({ appTitle: { color: 'white', - textDecoration: 'none' - } -}) + textDecoration: 'none', + }, +}); -const App = ({location, classes}) => ( +const App = ({ location, classes }) => ( - + @@ -30,10 +30,10 @@ const App = ({location, classes}) => ( - - + + -) +); -export default withStyles(styles)(withRouter(App)) +export default withStyles(styles)(withRouter(App)); diff --git a/webui/src/Author.js b/webui/src/Author.js index 37de7aa7..0ad7e257 100644 --- a/webui/src/Author.js +++ b/webui/src/Author.js @@ -1,24 +1,24 @@ -import Tooltip from '@material-ui/core/Tooltip/Tooltip' -import React from 'react' -import { withStyles } from '@material-ui/core/styles' +import Tooltip from '@material-ui/core/Tooltip/Tooltip'; +import React from 'react'; +import { withStyles } from '@material-ui/core/styles'; const styles = theme => ({ author: { ...theme.typography.body2, }, bold: { - fontWeight: 'bold' - } -}) + fontWeight: 'bold', + }, +}); -const Author = ({author, bold, classes}) => { - const klass = bold ? [classes.author, classes.bold] : [classes.author] +const Author = ({ author, bold, classes }) => { + const klass = bold ? [classes.author, classes.bold] : [classes.author]; return ( {author.name} - ) -} + ); +}; -export default withStyles(styles)(Author) +export default withStyles(styles)(Author); diff --git a/webui/src/Date.js b/webui/src/Date.js index b20fd274..46741924 100644 --- a/webui/src/Date.js +++ b/webui/src/Date.js @@ -1,11 +1,11 @@ -import Tooltip from '@material-ui/core/Tooltip/Tooltip' -import * as moment from 'moment' -import React from 'react' +import Tooltip from '@material-ui/core/Tooltip/Tooltip'; +import * as moment from 'moment'; +import React from 'react'; -const Date = ({date}) => ( +const Date = ({ date }) => ( {moment(date).fromNow()} -) +); -export default Date +export default Date; diff --git a/webui/src/Label.js b/webui/src/Label.js index 8981142d..e7c25c23 100644 --- a/webui/src/Label.js +++ b/webui/src/Label.js @@ -1,11 +1,11 @@ -import React from "react"; -import { withStyles } from "@material-ui/core/styles"; +import React from 'react'; +import { withStyles } from '@material-ui/core/styles'; import { getContrastRatio, - darken -} from "@material-ui/core/styles/colorManipulator"; -import * as allColors from "@material-ui/core/colors"; -import { common } from "@material-ui/core/colors"; + darken, +} from '@material-ui/core/styles/colorManipulator'; +import * as allColors from '@material-ui/core/colors'; +import { common } from '@material-ui/core/colors'; // JS's modulo returns negative numbers sometimes. // This ensures the result is positive. @@ -21,7 +21,7 @@ const labelColors = Object.entries(allColors) // Generate a hash (number) from a string const hash = string => - string.split("").reduce((a, b) => ((a << 5) - a + b.charCodeAt(0)) | 0, 0); + string.split('').reduce((a, b) => ((a << 5) - a + b.charCodeAt(0)) | 0, 0); // Get the background color from the label const getColor = label => @@ -36,7 +36,7 @@ const getTextColor = background => const _genStyle = background => ({ backgroundColor: background, color: getTextColor(background), - borderBottomColor: darken(background, 0.2) + borderBottomColor: darken(background, 0.2), }); // Generate a style object (text, background and border colors) from the label @@ -45,14 +45,14 @@ const genStyle = label => _genStyle(getColor(label)); const styles = theme => ({ label: { ...theme.typography.body2, - padding: "0 6px", - fontSize: "0.9em", - margin: "0 1px", - borderRadius: "3px", - display: "inline-block", - borderBottom: "solid 1.5px", - verticalAlign: "bottom" - } + padding: '0 6px', + fontSize: '0.9em', + margin: '0 1px', + borderRadius: '3px', + display: 'inline-block', + borderBottom: 'solid 1.5px', + verticalAlign: 'bottom', + }, }); const Label = ({ label, classes }) => ( diff --git a/webui/src/bug/Bug.js b/webui/src/bug/Bug.js index c6edda35..329fdd72 100644 --- a/webui/src/bug/Bug.js +++ b/webui/src/bug/Bug.js @@ -1,49 +1,49 @@ -import { withStyles } from "@material-ui/core/styles"; -import Typography from "@material-ui/core/Typography/Typography"; -import gql from "graphql-tag"; -import React from "react"; -import Author from "../Author"; -import Date from "../Date"; -import TimelineQuery from "./TimelineQuery"; -import Label from "../Label"; +import { withStyles } from '@material-ui/core/styles'; +import Typography from '@material-ui/core/Typography/Typography'; +import gql from 'graphql-tag'; +import React from 'react'; +import Author from '../Author'; +import Date from '../Date'; +import TimelineQuery from './TimelineQuery'; +import Label from '../Label'; const styles = theme => ({ main: { maxWidth: 600, - margin: "auto", - marginTop: theme.spacing.unit * 4 + margin: 'auto', + marginTop: theme.spacing.unit * 4, }, header: {}, title: { - ...theme.typography.headline + ...theme.typography.headline, }, id: { ...theme.typography.subheading, - marginLeft: 15 + marginLeft: 15, }, container: { - display: "flex", - marginBottom: 30 + display: 'flex', + marginBottom: 30, }, timeline: { - width: "70%", + width: '70%', marginTop: 20, - marginRight: 20 + marginRight: 20, }, sidebar: { - width: "30%" + width: '30%', }, labelList: { - listStyle: "none", + listStyle: 'none', padding: 0, - margin: 0 + margin: 0, }, label: { - margin: "4px 0", - "& > *": { - display: "block" - } - } + margin: '4px 0', + '& > *': { + display: 'block', + }, + }, }); const Bug = ({ bug, classes }) => ( @@ -52,7 +52,7 @@ const Bug = ({ bug, classes }) => ( {bug.title} {bug.humanId} - + opened this bug @@ -64,7 +64,7 @@ const Bug = ({ bug, classes }) => (
- Labels + Labels
    {bug.labels.map(l => (
  • diff --git a/webui/src/bug/BugQuery.js b/webui/src/bug/BugQuery.js index 22421414..dbf24c31 100644 --- a/webui/src/bug/BugQuery.js +++ b/webui/src/bug/BugQuery.js @@ -1,9 +1,9 @@ -import CircularProgress from '@material-ui/core/CircularProgress' -import gql from 'graphql-tag' -import React from 'react' -import { Query } from 'react-apollo' +import CircularProgress from '@material-ui/core/CircularProgress'; +import gql from 'graphql-tag'; +import React from 'react'; +import { Query } from 'react-apollo'; -import Bug from './Bug' +import Bug from './Bug'; const QUERY = gql` query GetBug($id: String!) { @@ -15,16 +15,16 @@ const QUERY = gql` } ${Bug.fragment} -` +`; -const BugQuery = ({match}) => ( - - {({loading, error, data}) => { - if (loading) return - if (error) return

    Error: {error}

    - return +const BugQuery = ({ match }) => ( + + {({ loading, error, data }) => { + if (loading) return ; + if (error) return

    Error: {error}

    ; + return ; }}     -) +); -export default BugQuery +export default BugQuery; diff --git a/webui/src/bug/LabelChange.js b/webui/src/bug/LabelChange.js index f954372a..bb546678 100644 --- a/webui/src/bug/LabelChange.js +++ b/webui/src/bug/LabelChange.js @@ -1,31 +1,39 @@ -import { withStyles } from '@material-ui/core/styles' -import gql from 'graphql-tag' -import React from 'react' -import Author from '../Author' -import Date from '../Date' -import Label from '../Label' +import { withStyles } from '@material-ui/core/styles'; +import gql from 'graphql-tag'; +import React from 'react'; +import Author from '../Author'; +import Date from '../Date'; +import Label from '../Label'; const styles = theme => ({ main: { - ...theme.typography.body2 + ...theme.typography.body2, }, -}) +}); -const LabelChange = ({op, classes}) => { - const {added, removed} = op +const LabelChange = ({ op, classes }) => { + const { added, removed } = op; return (
    - { added.length > 0 && added the } - { added.map((label, index) =>
    - ) -} + ); +}; LabelChange.fragment = gql` fragment LabelChange on Operation { @@ -39,6 +47,6 @@ LabelChange.fragment = gql` removed } } -` +`; -export default withStyles(styles)(LabelChange) +export default withStyles(styles)(LabelChange); diff --git a/webui/src/bug/Message.js b/webui/src/bug/Message.js index 2a96e52d..2d03e780 100644 --- a/webui/src/bug/Message.js +++ b/webui/src/bug/Message.js @@ -1,9 +1,9 @@ -import { withStyles } from '@material-ui/core/styles' -import Typography from '@material-ui/core/Typography' -import gql from 'graphql-tag' -import React from 'react' -import Author from '../Author' -import Date from '../Date' +import { withStyles } from '@material-ui/core/styles'; +import Typography from '@material-ui/core/Typography'; +import gql from 'graphql-tag'; +import React from 'react'; +import Author from '../Author'; +import Date from '../Date'; const styles = theme => ({ header: { @@ -24,10 +24,10 @@ const styles = theme => ({ minHeight: 50, padding: 5, whiteSpace: 'pre-wrap', - } -}) + }, +}); -const Message = ({op, classes}) => ( +const Message = ({ op, classes }) => (
    @@ -38,7 +38,7 @@ const Message = ({op, classes}) => ( {op.message}
    -) +); Message.createFragment = gql` fragment Create on Operation { @@ -51,7 +51,7 @@ Message.createFragment = gql` message } } -` +`; Message.commentFragment = gql` fragment Comment on Operation { @@ -64,6 +64,6 @@ Message.commentFragment = gql` message } } -` +`; -export default withStyles(styles)(Message) +export default withStyles(styles)(Message); diff --git a/webui/src/bug/SetStatus.js b/webui/src/bug/SetStatus.js index eb41fc28..7d6bccf3 100644 --- a/webui/src/bug/SetStatus.js +++ b/webui/src/bug/SetStatus.js @@ -1,25 +1,24 @@ -import { withStyles } from '@material-ui/core/styles' -import gql from 'graphql-tag' -import React from 'react' -import Author from '../Author' -import Date from '../Date' +import { withStyles } from '@material-ui/core/styles'; +import gql from 'graphql-tag'; +import React from 'react'; +import Author from '../Author'; +import Date from '../Date'; const styles = theme => ({ main: { - ...theme.typography.body2 + ...theme.typography.body2, }, -}) - -const SetStatus = ({op, classes}) => { +}); +const SetStatus = ({ op, classes }) => { return (
    {op.status.toLowerCase()} this
    - ) -} + ); +}; SetStatus.fragment = gql` fragment SetStatus on Operation { @@ -32,6 +31,6 @@ SetStatus.fragment = gql` status } } -` +`; -export default withStyles(styles)(SetStatus) +export default withStyles(styles)(SetStatus); diff --git a/webui/src/bug/SetTitle.js b/webui/src/bug/SetTitle.js index b6bb8b70..838219e2 100644 --- a/webui/src/bug/SetTitle.js +++ b/webui/src/bug/SetTitle.js @@ -1,19 +1,19 @@ -import { withStyles } from '@material-ui/core/styles' -import gql from 'graphql-tag' -import React from 'react' -import Author from '../Author' -import Date from '../Date' +import { withStyles } from '@material-ui/core/styles'; +import gql from 'graphql-tag'; +import React from 'react'; +import Author from '../Author'; +import Date from '../Date'; const styles = theme => ({ main: { - ...theme.typography.body2 + ...theme.typography.body2, }, bold: { - fontWeight: 'bold' - } -}) + fontWeight: 'bold', + }, +}); -const SetTitle = ({op, classes}) => { +const SetTitle = ({ op, classes }) => { return (
    @@ -23,8 +23,8 @@ const SetTitle = ({op, classes}) => { {op.title}
    - ) -} + ); +}; SetTitle.fragment = gql` fragment SetTitle on Operation { @@ -38,6 +38,6 @@ SetTitle.fragment = gql` was } } -` +`; -export default withStyles(styles)(SetTitle) +export default withStyles(styles)(SetTitle); diff --git a/webui/src/bug/Timeline.js b/webui/src/bug/Timeline.js index a15409ab..d331d11d 100644 --- a/webui/src/bug/Timeline.js +++ b/webui/src/bug/Timeline.js @@ -1,52 +1,51 @@ -import { withStyles } from '@material-ui/core/styles' -import React from 'react' -import LabelChange from './LabelChange' -import Message from './Message' -import SetStatus from './SetStatus' -import SetTitle from './SetTitle' +import { withStyles } from '@material-ui/core/styles'; +import React from 'react'; +import LabelChange from './LabelChange'; +import Message from './Message'; +import SetStatus from './SetStatus'; +import SetTitle from './SetTitle'; const styles = theme => ({ main: { '& > *:not(:last-child)': { - marginBottom: 10 - } - } -}) + marginBottom: 10, + }, + }, +}); class Timeline extends React.Component { - props: { ops: Array, - fetchMore: (any) => any, + fetchMore: any => any, classes: any, - } + }; render() { - const {ops, classes} = this.props + const { ops, classes } = this.props; return (
    - { ops.map((op, index) => { + {ops.map((op, index) => { switch (op.__typename) { case 'CreateOperation': - return + return ; case 'AddCommentOperation': - return + return ; case 'LabelChangeOperation': - return + return ; case 'SetTitleOperation': - return + return ; case 'SetStatusOperation': - return + return ; default: - console.log('unsupported operation type ' + op.__typename) - return null + console.log('unsupported operation type ' + op.__typename); + return null; } })}
    - ) + ); } } -export default withStyles(styles)(Timeline) +export default withStyles(styles)(Timeline); diff --git a/webui/src/bug/TimelineQuery.js b/webui/src/bug/TimelineQuery.js index 3ee4cb28..78658a6f 100644 --- a/webui/src/bug/TimelineQuery.js +++ b/webui/src/bug/TimelineQuery.js @@ -1,12 +1,12 @@ -import CircularProgress from '@material-ui/core/CircularProgress' -import gql from 'graphql-tag' -import React from 'react' -import { Query } from 'react-apollo' -import LabelChange from './LabelChange' -import SetStatus from './SetStatus' -import SetTitle from './SetTitle' -import Timeline from './Timeline' -import Message from './Message' +import CircularProgress from '@material-ui/core/CircularProgress'; +import gql from 'graphql-tag'; +import React from 'react'; +import { Query } from 'react-apollo'; +import LabelChange from './LabelChange'; +import SetStatus from './SetStatus'; +import SetTitle from './SetTitle'; +import Timeline from './Timeline'; +import Message from './Message'; const QUERY = gql` query($id: String!, $first: Int = 10, $after: String) { @@ -33,16 +33,21 @@ const QUERY = gql` ${LabelChange.fragment} ${SetTitle.fragment} ${SetStatus.fragment} -` +`; -const TimelineQuery = ({id}) => ( - - {({loading, error, data, fetchMore}) => { - if (loading) return - if (error) return

    Error: {error}

    - return +const TimelineQuery = ({ id }) => ( + + {({ loading, error, data, fetchMore }) => { + if (loading) return ; + if (error) return

    Error: {error}

    ; + return ( + + ); }}     -) +); -export default TimelineQuery +export default TimelineQuery; diff --git a/webui/src/index.js b/webui/src/index.js index c34cc7cc..f5d95ccc 100644 --- a/webui/src/index.js +++ b/webui/src/index.js @@ -1,23 +1,23 @@ -import ApolloClient from 'apollo-boost' -import React from 'react' -import { ApolloProvider } from 'react-apollo' -import ReactDOM from 'react-dom' -import { BrowserRouter } from 'react-router-dom' +import ApolloClient from 'apollo-boost'; +import React from 'react'; +import { ApolloProvider } from 'react-apollo'; +import ReactDOM from 'react-dom'; +import { BrowserRouter } from 'react-router-dom'; -import App from './App' +import App from './App'; const client = new ApolloClient({ - uri: "/graphql", - connectToDevTools: true -}) + uri: '/graphql', + connectToDevTools: true, +}); ReactDOM.render( - + , document.getElementById('root') -) +); diff --git a/webui/src/list/BugRow.js b/webui/src/list/BugRow.js index 05eafe92..9253cc88 100644 --- a/webui/src/list/BugRow.js +++ b/webui/src/list/BugRow.js @@ -1,14 +1,14 @@ -import { withStyles } from "@material-ui/core/styles"; -import TableCell from "@material-ui/core/TableCell/TableCell"; -import TableRow from "@material-ui/core/TableRow/TableRow"; -import Tooltip from "@material-ui/core/Tooltip/Tooltip"; -import Typography from "@material-ui/core/Typography"; -import ErrorOutline from "@material-ui/icons/ErrorOutline"; -import gql from "graphql-tag"; -import React from "react"; -import { Link } from "react-router-dom"; -import Date from "../Date"; -import Label from "../Label"; +import { withStyles } from '@material-ui/core/styles'; +import TableCell from '@material-ui/core/TableCell/TableCell'; +import TableRow from '@material-ui/core/TableRow/TableRow'; +import Tooltip from '@material-ui/core/Tooltip/Tooltip'; +import Typography from '@material-ui/core/Typography'; +import ErrorOutline from '@material-ui/icons/ErrorOutline'; +import gql from 'graphql-tag'; +import React from 'react'; +import { Link } from 'react-router-dom'; +import Date from '../Date'; +import Label from '../Label'; const Open = ({ className }) => ( @@ -24,35 +24,35 @@ const Closed = ({ className }) => ( const Status = ({ status, className }) => { switch (status) { - case "OPEN": + case 'OPEN': return ; - case "CLOSED": + case 'CLOSED': return ; default: - return "unknown status " + status; + return 'unknown status ' + status; } }; const styles = theme => ({ cell: { - display: "flex", - alignItems: "center", - "& a": { - textDecoration: "none" - } + display: 'flex', + alignItems: 'center', + '& a': { + textDecoration: 'none', + }, }, status: { - margin: 10 + margin: 10, }, expand: { - width: "100%" + width: '100%', }, title: { - display: "inline" + display: 'inline', }, labels: { - paddingLeft: theme.spacing.unit - } + paddingLeft: theme.spacing.unit, + }, }); const BugRow = ({ bug, classes }) => ( @@ -60,9 +60,9 @@ const BugRow = ({ bug, classes }) => (
    - +
    - + {bug.title} {bug.labels.length > 0 && ( @@ -74,7 +74,7 @@ const BugRow = ({ bug, classes }) => ( )}
    - + {bug.humanId} opened by {bug.author.name} diff --git a/webui/src/list/List.js b/webui/src/list/List.js index 880782c7..d36be8a1 100644 --- a/webui/src/list/List.js +++ b/webui/src/list/List.js @@ -1,115 +1,114 @@ -import { withStyles } from '@material-ui/core/styles' -import Table from '@material-ui/core/Table/Table' -import TableBody from '@material-ui/core/TableBody/TableBody' -import TablePagination from '@material-ui/core/TablePagination/TablePagination' -import React from 'react' -import BugRow from './BugRow' +import { withStyles } from '@material-ui/core/styles'; +import Table from '@material-ui/core/Table/Table'; +import TableBody from '@material-ui/core/TableBody/TableBody'; +import TablePagination from '@material-ui/core/TablePagination/TablePagination'; +import React from 'react'; +import BugRow from './BugRow'; const styles = theme => ({ main: { maxWidth: 600, margin: 'auto', - marginTop: theme.spacing.unit * 4 - } -}) + marginTop: theme.spacing.unit * 4, + }, +}); class List extends React.Component { - props: { bugs: Array, - fetchMore: (any) => any, + fetchMore: any => any, classes: any, - } + }; state = { page: 0, rowsPerPage: 10, - lastQuery: {} - } + lastQuery: {}, + }; handleChangePage = (event, page) => { - const {bugs, fetchMore} = this.props - const {rowsPerPage} = this.state - const pageInfo = bugs.pageInfo + const { bugs, fetchMore } = this.props; + const { rowsPerPage } = this.state; + const pageInfo = bugs.pageInfo; if (page === this.state.page + 1) { if (!pageInfo.hasNextPage) { - return + return; } const variables = { after: pageInfo.endCursor, - first: rowsPerPage - } + first: rowsPerPage, + }; fetchMore({ variables, updateQuery: this.updateQuery, - }) + }); - this.setState({page, lastQuery: variables}) - return + this.setState({ page, lastQuery: variables }); + return; } if (page === this.state.page - 1) { if (!pageInfo.hasPreviousPage) { - return + return; } const variables = { before: pageInfo.startCursor, - last: rowsPerPage - } + last: rowsPerPage, + }; fetchMore({ variables, updateQuery: this.updateQuery, - }) + }); - this.setState({page, lastQuery: variables}) - return + this.setState({ page, lastQuery: variables }); + return; } - throw new Error('non neighbour page pagination is not supported') - } + throw new Error('non neighbour page pagination is not supported'); + }; handleChangeRowsPerPage = event => { - const {fetchMore} = this.props - const {lastQuery} = this.state - const rowsPerPage = event.target.value + const { fetchMore } = this.props; + const { lastQuery } = this.state; + const rowsPerPage = event.target.value; - const variables = lastQuery + const variables = lastQuery; if (lastQuery.first) { - variables.first = rowsPerPage + variables.first = rowsPerPage; } else if (lastQuery.last) { - variables.last = rowsPerPage + variables.last = rowsPerPage; } else { - variables.first = rowsPerPage + variables.first = rowsPerPage; } fetchMore({ variables, updateQuery: this.updateQuery, - }) + }); - this.setState({rowsPerPage, lastQuery: variables}) - } + this.setState({ rowsPerPage, lastQuery: variables }); + }; - updateQuery = (previousResult, {fetchMoreResult}) => { - return fetchMoreResult ? fetchMoreResult : previousResult - } + updateQuery = (previousResult, { fetchMoreResult }) => { + return fetchMoreResult ? fetchMoreResult : previousResult; + }; render() { - const {classes, bugs} = this.props - const {page, rowsPerPage} = this.state + const { classes, bugs } = this.props; + const { page, rowsPerPage } = this.state; return (
    - {bugs.edges.map(({cursor, node}) => ( - + {bugs.edges.map(({ cursor, node }) => ( + ))}
    @@ -119,17 +118,17 @@ class List extends React.Component { rowsPerPage={rowsPerPage} page={page} backIconButtonProps={{ - 'aria-label': 'Previous Page' + 'aria-label': 'Previous Page', }} nextIconButtonProps={{ - 'aria-label': 'Next Page' + 'aria-label': 'Next Page', }} onChangePage={this.handleChangePage} onChangeRowsPerPage={this.handleChangeRowsPerPage} />
    - ) + ); } } -export default withStyles(styles)(List) +export default withStyles(styles)(List); diff --git a/webui/src/list/ListQuery.js b/webui/src/list/ListQuery.js index 3b57fcc2..9dbe4e53 100644 --- a/webui/src/list/ListQuery.js +++ b/webui/src/list/ListQuery.js @@ -1,15 +1,20 @@ // @flow -import CircularProgress from '@material-ui/core/CircularProgress' -import gql from 'graphql-tag' -import React from 'react' -import { Query } from 'react-apollo' -import BugRow from './BugRow' -import List from './List' +import CircularProgress from '@material-ui/core/CircularProgress'; +import gql from 'graphql-tag'; +import React from 'react'; +import { Query } from 'react-apollo'; +import BugRow from './BugRow'; +import List from './List'; const QUERY = gql` query($first: Int = 10, $last: Int, $after: String, $before: String) { defaultRepository { - bugs: allBugs(first: $first, last: $last, after: $after, before: $before) { + bugs: allBugs( + first: $first + last: $last + after: $after + before: $before + ) { totalCount edges { cursor @@ -17,7 +22,7 @@ const QUERY = gql` ...BugRow } } - pageInfo{ + pageInfo { hasNextPage hasPreviousPage startCursor @@ -27,18 +32,17 @@ const QUERY = gql` } } - ${BugRow.fragment} -` +`; const ListQuery = () => ( - {({loading, error, data, fetchMore}) => { - if (loading) return - if (error) return

    Error: {error}

    - return + {({ loading, error, data, fetchMore }) => { + if (loading) return ; + if (error) return

    Error: {error}

    ; + return ; }}     -) +); -export default ListQuery +export default ListQuery; -- cgit