list api called when user directly navigates to details

elastic · Apr 17, 2020 · 2fb8c40 · 2fb8c40
1 parent fd95269
commit 2fb8c40
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 12 deletions.
diff --git a/x-pack/plugins/endpoint/public/applications/endpoint/store/hosts/action.ts b/x-pack/plugins/endpoint/public/applications/endpoint/store/hosts/action.ts
@@ -12,6 +12,11 @@ interface ServerReturnedHostList {
   payload: HostResultList;
 }
 
+interface ServerFailedToReturnHostList {
+  type: 'serverFailedToReturnHostList';
+  payload: ServerApiError;
+}
+
 interface ServerReturnedHostDetails {
   type: 'serverReturnedHostDetails';
   payload: HostInfo;
@@ -24,5 +29,6 @@ interface ServerFailedToReturnHostDetails {
 
 export type HostAction =
   | ServerReturnedHostList
+  | ServerFailedToReturnHostList
   | ServerReturnedHostDetails
   | ServerFailedToReturnHostDetails;
diff --git a/x-pack/plugins/endpoint/public/applications/endpoint/store/hosts/middleware.test.ts b/x-pack/plugins/endpoint/public/applications/endpoint/store/hosts/middleware.test.ts
@@ -56,7 +56,7 @@ describe('host list middleware', () => {
     await sleep();
     expect(fakeHttpServices.post).toHaveBeenCalledWith('/api/endpoint/metadata', {
       body: JSON.stringify({
-        paging_properties: [{ page_index: 0 }, { page_size: 10 }],
+        paging_properties: [{ page_index: '0' }, { page_size: '10' }],
       }),
     });
     expect(listData(getState())).toEqual(apiResponse.hosts.map(hostInfo => hostInfo.metadata));

diff --git a/x-pack/plugins/endpoint/public/applications/endpoint/store/hosts/middleware.ts b/x-pack/plugins/endpoint/public/applications/endpoint/store/hosts/middleware.ts
@@ -5,7 +5,7 @@
  */
 
 import { MiddlewareFactory } from '../../types';
-import { isOnHostPage, hasSelectedHost, uiQueryParams } from './selectors';
+import { isOnHostPage, hasSelectedHost, uiQueryParams, listData } from './selectors';
 import { HostListState } from '../../types';
 import { AppAction } from '../action';
 
@@ -19,18 +19,48 @@ export const hostMiddlewareFactory: MiddlewareFactory<HostListState> = coreStart
       hasSelectedHost(state) !== true
     ) {
       const { page_index: pageIndex, page_size: pageSize } = uiQueryParams(state);
-      const response = await coreStart.http.post('/api/endpoint/metadata', {
-        body: JSON.stringify({
-          paging_properties: [{ page_index: pageIndex }, { page_size: pageSize }],
-        }),
-      });
-      response.request_page_index = Number(pageIndex);
-      dispatch({
-        type: 'serverReturnedHostList',
-        payload: response,
-      });
+      try {
+        const response = await coreStart.http.post('/api/endpoint/metadata', {
+          body: JSON.stringify({
+            paging_properties: [{ page_index: pageIndex }, { page_size: pageSize }],
+          }),
+        });
+        response.request_page_index = Number(pageIndex);
+        dispatch({
+          type: 'serverReturnedHostList',
+          payload: response,
+        });
+      } catch (error) {
+        dispatch({
+          type: 'serverFailedToReturnHostList',
+          payload: error,
+        });
+      }
     }
     if (action.type === 'userChangedUrl' && hasSelectedHost(state) !== false) {
+      // If user navigated directly to a host details page, load the host list
+      if (listData(state).length === 0) {
+        const { page_index: pageIndex, page_size: pageSize } = uiQueryParams(state);
+        try {
+          const response = await coreStart.http.post('/api/endpoint/metadata', {
+            body: JSON.stringify({
+              paging_properties: [{ page_index: pageIndex }, { page_size: pageSize }],
+            }),
+          });
+          response.request_page_index = Number(pageIndex);
+          dispatch({
+            type: 'serverReturnedHostList',
+            payload: response,
+          });
+        } catch (error) {
+          dispatch({
+            type: 'serverFailedToReturnHostList',
+            payload: error,
+          });
+        }
+      }
+
+      // call the host details api
       const { selected_host: selectedHost } = uiQueryParams(state);
       try {
         const response = await coreStart.http.get(`/api/endpoint/metadata/${selectedHost}`);