diff options
Diffstat (limited to 'webui/src/list/BugRow.js')
-rw-r--r-- | webui/src/list/BugRow.js | 90 |
1 files changed, 46 insertions, 44 deletions
diff --git a/webui/src/list/BugRow.js b/webui/src/list/BugRow.js index 9f55809d..05eafe92 100644 --- a/webui/src/list/BugRow.js +++ b/webui/src/list/BugRow.js @@ -1,78 +1,80 @@ -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}) => <Tooltip title="Open"> - <ErrorOutline nativeColor='#28a745' className={className}/> -</Tooltip> +const Open = ({ className }) => ( + <Tooltip title="Open"> + <ErrorOutline nativeColor="#28a745" className={className} /> + </Tooltip> +); -const Closed = ({className}) => <Tooltip title="Closed"> - <ErrorOutline nativeColor='#cb2431' className={className}/> -</Tooltip> +const Closed = ({ className }) => ( + <Tooltip title="Closed"> + <ErrorOutline nativeColor="#cb2431" className={className} /> + </Tooltip> +); -const Status = ({status, className}) => { +const Status = ({ status, className }) => { switch (status) { - case 'OPEN': - return <Open className={className}/> - case 'CLOSED': - return <Closed className={className}/> + case "OPEN": + return <Open className={className} />; + case "CLOSED": + return <Closed className={className} />; 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 }, expand: { - width: '100%' + width: "100%" }, title: { - display: 'inline', + display: "inline" }, labels: { - ...theme.typography.body2, - display: 'inline', - paddingLeft: theme.spacing.unit, + paddingLeft: theme.spacing.unit } -}) +}); -const BugRow = ({bug, classes}) => ( +const BugRow = ({ bug, classes }) => ( <TableRow hover> <TableCell className={classes.cell}> - <Status status={bug.status} className={classes.status}/> + <Status status={bug.status} className={classes.status} /> <div className={classes.expand}> - <Link to={'bug/' + bug.humanId}> + <Link to={"bug/" + bug.humanId}> <div className={classes.expand}> - <Typography variant={'title'} className={classes.title}> + <Typography variant={"title"} className={classes.title}> {bug.title} </Typography> - { bug.labels.length > 0 && ( + {bug.labels.length > 0 && ( <span className={classes.labels}> {bug.labels.map(l => ( - <Label key={l} label={l}/> + <Label key={l} label={l} /> ))} </span> )} </div> </Link> - <Typography color={'textSecondary'}> + <Typography color={"textSecondary"}> {bug.humanId} opened <Date date={bug.createdAt} /> by {bug.author.name} @@ -80,7 +82,7 @@ const BugRow = ({bug, classes}) => ( </div> </TableCell> </TableRow> -) +); BugRow.fragment = gql` fragment BugRow on Bug { @@ -94,6 +96,6 @@ BugRow.fragment = gql` name } } -` +`; -export default withStyles(styles)(BugRow) +export default withStyles(styles)(BugRow); |