webui: Use the new schema

Quentin Gliech created 7 years ago

Change summary

webui/src/Bug.js      | 13 +++++++++----
webui/src/BugPage.js  | 10 ++++++----
webui/src/ListPage.js | 17 ++++++++++++-----
3 files changed, 27 insertions(+), 13 deletions(-)

Detailed changes

webui/src/Bug.js

@@ -17,8 +17,8 @@ const Bug = ({ bug, classes }) => (
   <main className={classes.main}>
     <BugSummary bug={bug} />
 
-    {bug.comments.map((comment, index) => (
-      <Comment key={index} comment={comment} />
+    {bug.comments.edges.map(({ cursor, node }) => (
+      <Comment key={cursor} comment={node} />
     ))}
   </main>
 );
@@ -26,8 +26,13 @@ const Bug = ({ bug, classes }) => (
 Bug.fragment = gql`
   fragment Bug on Bug {
     ...BugSummary
-    comments {
-      ...Comment
+    comments(input: { first: 10 }) {
+      edges {
+        cursor
+        node {
+          ...Comment
+        }
+      }
     }
   }
 

webui/src/BugPage.js

@@ -7,9 +7,11 @@ import CircularProgress from "@material-ui/core/CircularProgress";
 import Bug from "./Bug";
 
 const QUERY = gql`
-  query GetBug($id: BugID!) {
-    bug(id: $id) {
-      ...Bug
+  query GetBug($id: String!) {
+    defaultRepository {
+      bug(prefix: $id) {
+        ...Bug
+      }
     }
   }
 
@@ -21,7 +23,7 @@ const BugPage = ({ match }) => (
     {({ loading, error, data }) => {
       if (loading) return <CircularProgress />;
       if (error) return <p>Error.</p>;
-      return <Bug bug={data.bug} />;
+      return <Bug bug={data.defaultRepository.bug} />;
     }}
   </Query>
 );

webui/src/ListPage.js

@@ -9,8 +9,15 @@ import BugSummary from "./BugSummary";
 
 const QUERY = gql`
   {
-    bugs: allBugs {
-      ...BugSummary
+    defaultRepository {
+      bugs: allBugs(input: { first: 10 }) {
+        edges {
+          cursor
+          node {
+            ...BugSummary
+          }
+        }
+      }
     }
   }
 
@@ -27,8 +34,8 @@ const styles = theme => ({
 
 const List = withStyles(styles)(({ bugs, classes }) => (
   <main className={classes.main}>
-    {bugs.map(bug => (
-      <BugSummary bug={bug} key={bug.id} />
+    {bugs.edges.map(({ cursor, node }) => (
+      <BugSummary bug={node} key={cursor} />
     ))}
   </main>
 ));
@@ -38,7 +45,7 @@ const ListPage = () => (
     {({ loading, error, data }) => {
       if (loading) return <CircularProgress />;
       if (error) return <p>Error.</p>;
-      return <List bugs={data.bugs} />;
+      return <List bugs={data.defaultRepository.bugs} />;
     }}
   </Query>
 );