webui: Format everything with prettier

8 files changed, 153 insertions, 142 deletions

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 }) => (
       <span className={classes.title}>{bug.title}</span>
       <span className={classes.id}>{bug.humanId}</span>
 
-      <Typography color={"textSecondary"}>
+      <Typography color={'textSecondary'}>
         <Author author={bug.author} />
         <span> opened this bug </span>
         <Date date={bug.createdAt} />
@@ -64,7 +64,7 @@ const Bug = ({ bug, classes }) => (
         <TimelineQuery id={bug.id} />
       </div>
       <div className={classes.sidebar}>
-        <Typography variant={"subheading"}>Labels</Typography>
+        <Typography variant={'subheading'}>Labels</Typography>
         <ul className={classes.labelList}>
           {bug.labels.map(l => (
             <li className={classes.label}>
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}) => (
-  <Query query={QUERY} variables={{id: match.params.id}}>
-    {({loading, error, data}) => {
-      if (loading) return <CircularProgress/>
-      if (error) return <p>Error: {error}</p>
-      return <Bug bug={data.defaultRepository.bug}/>
+const BugQuery = ({ match }) => (
+  <Query query={QUERY} variables={{ id: match.params.id }}>
+    {({ loading, error, data }) => {
+      if (loading) return <CircularProgress />;
+      if (error) return <p>Error: {error}</p>;
+      return <Bug bug={data.defaultRepository.bug} />;
     }}
   </Query>
-)
+);
 
-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 (
     <div className={classes.main}>
       <Author author={op.author} bold />
-      { added.length > 0 && <span> added the </span>}
-      { added.map((label, index) => <Label key={index} label={label} />)}
-      { (added.length > 0 && removed.length > 0) && <span> and</span>}
-      { removed.length > 0 && <span> removed the </span>}
-      { removed.map((label, index) => <Label key={index} label={label} />)}
-      <span> label{ (added.length + removed.length > 1) && 's'} </span>
+      {added.length > 0 && <span> added the </span>}
+      {added.map((label, index) => (
+        <Label key={index} label={label} />
+      ))}
+      {added.length > 0 && removed.length > 0 && <span> and</span>}
+      {removed.length > 0 && <span> removed the </span>}
+      {removed.map((label, index) => (
+        <Label key={index} label={label} />
+      ))}
+      <span>
+        {' '}
+        label
+        {added.length + removed.length > 1 && 's'}{' '}
+      </span>
       <Date date={op.date} />
     </div>
-  )
-}
+  );
+};
 
 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 }) => (
   <div>
     <div className={classes.header}>
       <Author className={classes.author} author={op.author} bold />
@@ -38,7 +38,7 @@ const Message = ({op, classes}) => (
       <Typography>{op.message}</Typography>
     </div>
   </div>
-)
+);
 
 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 (
     <div className={classes.main}>
       <Author author={op.author} bold />
       <span> {op.status.toLowerCase()} this</span>
       <Date date={op.date} />
     </div>
-  )
-}
+  );
+};
 
 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 (
     <div className={classes.main}>
       <Author author={op.author} bold />
@@ -23,8 +23,8 @@ const SetTitle = ({op, classes}) => {
       <span className={classes.bold}>{op.title}</span>
       <Date date={op.date} />
     </div>
-  )
-}
+  );
+};
 
 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 (
       <div className={classes.main}>
-        { ops.map((op, index) => {
+        {ops.map((op, index) => {
           switch (op.__typename) {
             case 'CreateOperation':
-              return <Message key={index} op={op}/>
+              return <Message key={index} op={op} />;
             case 'AddCommentOperation':
-              return <Message key={index} op={op}/>
+              return <Message key={index} op={op} />;
             case 'LabelChangeOperation':
-              return <LabelChange key={index} op={op}/>
+              return <LabelChange key={index} op={op} />;
             case 'SetTitleOperation':
-              return <SetTitle key={index} op={op}/>
+              return <SetTitle key={index} op={op} />;
             case 'SetStatusOperation':
-              return <SetStatus key={index} op={op}/>
+              return <SetStatus key={index} op={op} />;
 
             default:
-              console.log('unsupported operation type ' + op.__typename)
-              return null
+              console.log('unsupported operation type ' + op.__typename);
+              return null;
           }
         })}
       </div>
-    )
+    );
   }
 }
 
-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}) => (
-  <Query query={QUERY} variables={{id, first: 100}}>
-    {({loading, error, data, fetchMore}) => {
-      if (loading) return <CircularProgress/>
-      if (error) return <p>Error: {error}</p>
-      return <Timeline ops={data.defaultRepository.bug.operations.nodes} fetchMore={fetchMore}/>
+const TimelineQuery = ({ id }) => (
+  <Query query={QUERY} variables={{ id, first: 100 }}>
+    {({ loading, error, data, fetchMore }) => {
+      if (loading) return <CircularProgress />;
+      if (error) return <p>Error: {error}</p>;
+      return (
+        <Timeline
+          ops={data.defaultRepository.bug.operations.nodes}
+          fetchMore={fetchMore}
+        />
+      );
     }}
   </Query>
-)
+);
 
-export default TimelineQuery
+export default TimelineQuery;