webui: Use Timeline API instead of raw operations

Quentin Gliech created

Change summary

webui/src/bug/LabelChange.js   |  4 ++--
webui/src/bug/Message.js       | 14 +++++++-------
webui/src/bug/SetStatus.js     |  4 ++--
webui/src/bug/SetTitle.js      |  4 ++--
webui/src/bug/Timeline.js      | 10 +++++-----
webui/src/bug/TimelineQuery.js | 10 +++++-----
6 files changed, 23 insertions(+), 23 deletions(-)

Detailed changes

webui/src/bug/LabelChange.js 🔗

@@ -36,8 +36,8 @@ const LabelChange = ({ op, classes }) => {
 };
 
 LabelChange.fragment = gql`
-  fragment LabelChange on Operation {
-    ... on LabelChangeOperation {
+  fragment LabelChange on TimelineItem {
+    ... on LabelChangeTimelineItem {
       date
       author {
         name

webui/src/bug/Message.js 🔗

@@ -32,7 +32,7 @@ const Message = ({ op, classes }) => (
     <div className={classes.header}>
       <Author className={classes.author} author={op.author} bold />
       <span> commented </span>
-      <Date date={op.date} />
+      <Date date={op.createdAt} />
     </div>
     <div className={classes.message}>
       <Typography>{op.message}</Typography>
@@ -41,9 +41,9 @@ const Message = ({ op, classes }) => (
 );
 
 Message.createFragment = gql`
-  fragment Create on Operation {
-    ... on CreateOperation {
-      date
+  fragment Create on TimelineItem {
+    ... on CreateTimelineItem {
+      createdAt
       author {
         name
         email
@@ -55,9 +55,9 @@ Message.createFragment = gql`
 `;
 
 Message.commentFragment = gql`
-  fragment Comment on Operation {
-    ... on AddCommentOperation {
-      date
+  fragment AddComment on TimelineItem {
+    ... on AddCommentTimelineItem {
+      createdAt
       author {
         name
         email

webui/src/bug/SetStatus.js 🔗

@@ -21,8 +21,8 @@ const SetStatus = ({ op, classes }) => {
 };
 
 SetStatus.fragment = gql`
-  fragment SetStatus on Operation {
-    ... on SetStatusOperation {
+  fragment SetStatus on TimelineItem {
+    ... on SetStatusTimelineItem {
       date
       author {
         name

webui/src/bug/SetTitle.js 🔗

@@ -27,8 +27,8 @@ const SetTitle = ({ op, classes }) => {
 };
 
 SetTitle.fragment = gql`
-  fragment SetTitle on Operation {
-    ... on SetTitleOperation {
+  fragment SetTitle on TimelineItem {
+    ... on SetTitleTimelineItem {
       date
       author {
         name

webui/src/bug/Timeline.js 🔗

@@ -27,15 +27,15 @@ class Timeline extends React.Component {
       <div className={classes.main}>
         {ops.map((op, index) => {
           switch (op.__typename) {
-            case 'CreateOperation':
+            case 'CreateTimelineItem':
               return <Message key={index} op={op} />;
-            case 'AddCommentOperation':
+            case 'AddCommentTimelineItem':
               return <Message key={index} op={op} />;
-            case 'LabelChangeOperation':
+            case 'LabelChangeTimelineItem':
               return <LabelChange key={index} op={op} />;
-            case 'SetTitleOperation':
+            case 'SetTitleTimelineItem':
               return <SetTitle key={index} op={op} />;
-            case 'SetStatusOperation':
+            case 'SetStatusTimelineItem':
               return <SetStatus key={index} op={op} />;
 
             default:

webui/src/bug/TimelineQuery.js 🔗

@@ -12,13 +12,13 @@ const QUERY = gql`
   query($id: String!, $first: Int = 10, $after: String) {
     defaultRepository {
       bug(prefix: $id) {
-        operations(first: $first, after: $after) {
+        timeline(first: $first, after: $after) {
           nodes {
-            ...Create
-            ...Comment
             ...LabelChange
-            ...SetTitle
             ...SetStatus
+            ...SetTitle
+            ...AddComment
+            ...Create
           }
           pageInfo {
             hasNextPage
@@ -42,7 +42,7 @@ const TimelineQuery = ({ id }) => (
       if (error) return <p>Error: {error}</p>;
       return (
         <Timeline
-          ops={data.defaultRepository.bug.operations.nodes}
+          ops={data.defaultRepository.bug.timeline.nodes}
           fetchMore={fetchMore}
         />
       );