#RI-4778 - fix loading functions and libraries list

Author: AmirAllayarovSofteq

redisinsight/ui/src/pages/triggeredFunctions/pages/Functions/FunctionsPage.spec.tsx

@@ -161,4 +161,14 @@ describe('FunctionsPage', () => {
     expect(pushMock)
       .toBeCalledWith(Pages.triggeredFunctionsLibraries('instanceId'))
   })
+
+  it('should not render functions list', () => {
+    (triggeredFunctionsFunctionsSelector as jest.Mock).mockReturnValueOnce({
+      data: null,
+      loading: false
+    })
+    const { queryByTestId } = render(<FunctionsPage />)
+
+    expect(queryByTestId('total-functions')).not.toBeInTheDocument()
+  })
 })

redisinsight/ui/src/pages/triggeredFunctions/pages/Functions/FunctionsPage.tsx

@@ -3,7 +3,7 @@ import { EuiFieldSearch, EuiFlexGroup, EuiFlexItem, EuiLoadingSpinner, EuiResiza
 import { useDispatch, useSelector } from 'react-redux'
 import { useHistory } from 'react-router-dom'
 import cx from 'classnames'
-import { find, pick } from 'lodash'
+import { find, isNull, pick } from 'lodash'
 import {
   fetchTriggeredFunctionsFunctionsList,
   setSelectedFunctionToShow,
@@ -164,16 +164,18 @@ const FunctionsPage = () => {
                       <EuiLoadingSpinner size="xl" />
                     </div>
                   )}
-                  <FunctionsList
-                    items={items}
-                    loading={loading}
-                    onRefresh={updateList}
-                    lastRefresh={lastRefresh}
-                    selectedRow={selectedRow}
-                    onSelectRow={handleSelectRow}
-                    message={message}
-                    isRefreshDisabled={!isModuleLoaded}
-                  />
+                  {!isNull(functions) && (
+                    <FunctionsList
+                      items={items}
+                      loading={loading}
+                      onRefresh={updateList}
+                      lastRefresh={lastRefresh}
+                      selectedRow={selectedRow}
+                      onSelectRow={handleSelectRow}
+                      message={message}
+                      isRefreshDisabled={!isModuleLoaded}
+                    />
+                  )}
                 </div>
               </EuiResizablePanel>
               <EuiResizableButton

redisinsight/ui/src/pages/triggeredFunctions/pages/Libraries/LibrariesPage.spec.tsx

@@ -229,4 +229,14 @@ describe('LibrariesPage', () => {
 
     expect(screen.queryByTestId('lib-details-lib1')).not.toBeInTheDocument()
   })
+
+  it('should not render libraries list', () => {
+    (triggeredFunctionsLibrariesSelector as jest.Mock).mockReturnValueOnce({
+      data: null,
+      loading: false
+    })
+    const { queryByTestId } = render(<LibrariesPage />)
+
+    expect(queryByTestId('total-libraries')).not.toBeInTheDocument()
+  })
 })

redisinsight/ui/src/pages/triggeredFunctions/pages/Libraries/LibrariesPage.tsx

@@ -240,17 +240,19 @@ const LibrariesPage = () => {
                       <EuiLoadingSpinner size="xl" />
                     </div>
                   )}
-                  <LibrariesList
-                    items={items}
-                    loading={loading}
-                    onRefresh={updateList}
-                    lastRefresh={lastRefresh}
-                    selectedRow={selectedRow}
-                    onSelectRow={handleSelectRow}
-                    onDeleteRow={handleDelete}
-                    message={message}
-                    isRefreshDisabled={!isModuleLoaded}
-                  />
+                  {!isNull(libraries) && (
+                    <LibrariesList
+                      items={items}
+                      loading={loading}
+                      onRefresh={updateList}
+                      lastRefresh={lastRefresh}
+                      selectedRow={selectedRow}
+                      onSelectRow={handleSelectRow}
+                      onDeleteRow={handleDelete}
+                      message={message}
+                      isRefreshDisabled={!isModuleLoaded}
+                    />
+                  )}
                 </div>
               </EuiResizablePanel>
               <EuiResizableButton