Browse Source

feat(related_issues): Use new data shape from endpoint (#68985)

In #68346 we added a new shape to the endpoint to support multiple types
of related issues. This UI change is to use the new format.

Here's a real example from the API showing both shapes:

```json
{
  "same_root_cause": [3899258706, 3899374652, 3899885094],
  "data": [
    { "type": "same_root_cause", "data": [3899258706, 3899374652, 3899885094] }
  ]
}
```
Armen Zambrano G 11 months ago
parent
commit
98b71a802d

+ 8 - 1
static/app/views/issueDetails/groupRelatedIssues/index.spec.tsx

@@ -29,7 +29,14 @@ describe('Related Issues View', function () {
     });
     relatedIssuesMock = MockApiClient.addMockResponse({
       url: `/issues/${groupId}/related-issues/`,
-      body: {same_root_cause: [group1, group2]},
+      body: {
+        data: [
+          {
+            type: 'same_root_cause',
+            data: [group1, group2],
+          },
+        ],
+      },
     });
     issuesInfoMock = MockApiClient.addMockResponse({
       url: orgIssuesEndpoint,

+ 12 - 5
static/app/views/issueDetails/groupRelatedIssues/index.tsx

@@ -20,7 +20,12 @@ type RouteParams = {
 type Props = RouteComponentProps<RouteParams, {}>;
 
 type RelatedIssuesResponse = {
-  same_root_cause: number[];
+  data: [
+    {
+      data: number[];
+      type: string;
+    },
+  ];
 };
 
 function GroupRelatedIssues({params}: Props) {
@@ -39,11 +44,13 @@ function GroupRelatedIssues({params}: Props) {
     staleTime: 0,
   });
 
+  const sameRootCauseIssues = relatedIssues?.data
+    .filter(item => item.type === 'same_root_cause')
+    .map(item => item.data);
   // If the group we're looking related issues for shows up in the table,
-  // it will trigger a bug in getGroupReprocessingStatus because activites would be empty
-  const groups = relatedIssues?.same_root_cause
-    ?.filter(id => id.toString() !== groupId)
-    ?.join(',');
+  // it will trigger a bug in getGroupReprocessingStatus because activites would be empty,
+  // thus, we excude it from the list of related issues
+  const groups = sameRootCauseIssues?.filter(id => id.toString() !== groupId)?.join(',');
 
   return (
     <Layout.Body>