1import React from "react";
 2import { Query } from "react-apollo";
 3import gql from "graphql-tag";
 4
 5import CircularProgress from "@material-ui/core/CircularProgress";
 6
 7import Bug from "./Bug";
 8
 9const QUERY = gql`
10  query GetBug($id: BugID!) {
11    bug(id: $id) {
12      ...Bug
13    }
14  }
15
16  ${Bug.fragment}
17`;
18
19const BugPage = ({ match }) => (
20  <Query query={QUERY} variables={{ id: match.params.id }}>
21    {({ loading, error, data }) => {
22      if (loading) return <CircularProgress />;
23      if (error) return <p>Error.</p>;
24      return <Bug bug={data.bug} />;
25    }}
26  </Query>
27);
28
29export default BugPage;