Add notifications for failed network requests

Summary: Also acts as a model for using the computeNotifications api.

Reviewed By: passy

Differential Revision: D10240659

fbshipit-source-id: 610512de7484e10c9c0ed8e661913c2fe10869da

src/plugins/network/index.js

@@ -7,6 +7,7 @@
 
 import type {TableHighlightedRows, TableRows, TableBodyRow} from 'flipper';
 
+import type {NotificationSet} from '../../plugin';
 import {
   ContextMenu,
   FlexColumn,
@@ -152,6 +153,26 @@ export default class extends FlipperPlugin<State, *, PersistedState> {
     this.props.setPersistedState({responses: {}, requests: {}});
   };
 
+  computeNotifications(props: *, state: State) {
+    const notifications: NotificationSet = {};
+    const persistedState = props.persistedState;
+    for (const response in persistedState.responses) {
+      const status = persistedState.responses[response].status;
+      if (status >= 400) {
+        const url = persistedState.requests[response]?.url;
+        const startTime = persistedState.requests[response]?.timestamp;
+        const endTime = persistedState.responses[response].timestamp;
+        notifications[`${url}-${startTime}`] = {
+          timestamp: endTime,
+          title: 'Failed network request',
+          message: `Response for ${url} failed with status code ${status}`,
+          severity: 'error',
+        };
+      }
+    }
+    return notifications;
+  }
+
   renderSidebar = () => {
     const {requests, responses} = this.props.persistedState;
     const {selectedIds} = this.state;