Browse Source

fix(issue-alerts): add message if preview is empty (#40734)

Adds a message instead of displaying an empty table.

Before:
![Screen Shot 2022-10-28 at 11 09 58
AM](https://user-images.githubusercontent.com/39287272/198704013-368686cd-f27e-450d-82d6-d55792315d3f.png)

After:
![Screen Shot 2022-10-28 at 11 09 26
AM](https://user-images.githubusercontent.com/39287272/198703924-022c46c7-3747-423f-97dc-4bf43608eaa4.png)
Andrew Xue 2 years ago
parent
commit
e91e570004

+ 18 - 0
static/app/views/alerts/create.spec.jsx

@@ -509,5 +509,23 @@ describe('ProjectAlertsCreate', function () {
       });
       expect(screen.getByText('No preview available')).toBeInTheDocument();
     });
+
+    it('empty preview table', async () => {
+      const mock = MockApiClient.addMockResponse({
+        url: '/projects/org-slug/project-slug/rules/preview',
+        method: 'POST',
+        body: [],
+        headers: {
+          'X-Hits': 0,
+        },
+      });
+      createWrapper({organization});
+      await waitFor(() => {
+        expect(mock).toHaveBeenCalled();
+      });
+      expect(
+        screen.getByText("We couldn't find any issues that would've triggered your rule")
+      ).toBeInTheDocument();
+    });
   });
 });

+ 7 - 0
static/app/views/alerts/rules/issue/previewTable.tsx

@@ -44,6 +44,13 @@ const PreviewTable = ({
         </EmptyStateWarning>
       );
     }
+    if (issueCount === 0) {
+      return (
+        <EmptyStateWarning>
+          <p>{t("We couldn't find any issues that would've triggered your rule")}</p>
+        </EmptyStateWarning>
+      );
+    }
     const memberList = indexMembersByProject(members);
     return previewGroups?.map((id, index) => {
       const group = GroupStore.get(id) as Group | undefined;