Fix releases not reloading when selecting namespaces (#2515)

src/renderer/components/item-object-list/item-list-layout.tsx

@@ -172,6 +172,10 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
     return this.props.isReady ?? this.props.store.isLoaded;
   }
 
+  @computed get failedToLoad() {
+    return this.props.store.failedLoading;
+  }
+
   @computed get filters() {
     let { activeFilters } = pageFilters;
     const { isSearchable, searchFilters } = this.props;
@@ -281,6 +285,11 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
     });
   }
 
+  @autobind()
+  toggleFilters() {
+    this.showFilters = !this.showFilters;
+  }
+
   renderFilters() {
     const { hideFilters } = this.props;
     const { isReady, filters } = this;
@@ -293,6 +302,14 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
   }
 
   renderNoItems() {
+    if (this.failedToLoad) {
+      return <NoItems>Failed to load items.</NoItems>;
+    }
+
+    if (!this.isReady) {
+      return <Spinner center />;
+    }
+
     if (this.filters.length > 0) {
       return (
         <NoItems>
@@ -309,6 +326,14 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
     return <NoItems/>;
   }
 
+  renderItems() {
+    if (this.props.virtual) {
+      return null;
+    }
+
+    return this.items.map(item => this.getRow(item.getId()));
+  }
+
   renderHeaderContent(placeholders: IHeaderPlaceholders): ReactNode {
     const { isSearchable, searchFilters } = this.props;
     const { title, filters, search, info } = placeholders;
@@ -317,7 +342,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
       <>
         {title}
         <div className="info-panel box grow">
-          {this.isReady && info}
+          {info}
         </div>
         {filters}
         {isSearchable && searchFilters && search}
@@ -326,20 +351,17 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
   }
 
   renderInfo() {
-    const { items, isReady, filters } = this;
+    const { items, filters } = this;
     const allItemsCount = this.props.store.getTotalCount();
     const itemsCount = items.length;
-    const isFiltered = isReady && filters.length > 0;
-
-    if (isFiltered) {
-      const toggleFilters = () => this.showFilters = !this.showFilters;
 
+    if (filters.length > 0) {
       return (
-        <><a onClick={toggleFilters}>Filtered</a>: {itemsCount} / {allItemsCount}</>
+        <><a onClick={this.toggleFilters}>Filtered</a>: {itemsCount} / {allItemsCount}</>
       );
     }
 
-    return allItemsCount <= 1 ? `${allItemsCount} item` : `${allItemsCount} items`;
+    return allItemsCount === 1 ? `${allItemsCount} item` : `${allItemsCount} items`;
   }
 
   renderHeader() {
@@ -412,40 +434,31 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
 
   renderList() {
     const {
-      store, hasDetailsView, addRemoveButtons = {}, virtual, sortingCallbacks, detailsItem,
-      tableProps = {}, tableId
+      store, hasDetailsView, addRemoveButtons = {}, virtual, sortingCallbacks,
+      detailsItem, className, tableProps = {}, tableId,
     } = this.props;
-    const { isReady, removeItemsDialog, items } = this;
+    const { removeItemsDialog, items } = this;
     const { selectedItems } = store;
     const selectedItemId = detailsItem && detailsItem.getId();
+    const classNames = cssNames(className, "box", "grow", themeStore.activeTheme.type);
 
     return (
       <div className="items box grow flex column">
-        {!isReady && (
-          <Spinner center/>
-        )}
-        {isReady && (
-          <Table
-            tableId={tableId}
-            virtual={virtual}
-            selectable={hasDetailsView}
-            sortable={sortingCallbacks}
-            getTableRow={this.getRow}
-            items={items}
-            selectedItemId={selectedItemId}
-            noItems={this.renderNoItems()}
-            {...({
-              ...tableProps,
-              className: cssNames("box grow", tableProps.className, themeStore.activeTheme.type),
-            })}
-          >
-            {this.renderTableHeader()}
-            {
-              !virtual && items.map(item => this.getRow(item.getId()))
-            }
-          </Table>
-
-        )}
+        <Table
+          tableId={tableId}
+          virtual={virtual}
+          selectable={hasDetailsView}
+          sortable={sortingCallbacks}
+          getTableRow={this.getRow}
+          items={items}
+          selectedItemId={selectedItemId}
+          noItems={this.renderNoItems()}
+          className={classNames}
+          {...tableProps}
+        >
+          {this.renderTableHeader()}
+          {this.renderItems()}
+        </Table>
         <AddRemoveButtons
           onRemove={selectedItems.length ? removeItemsDialog : null}
           removeTooltip={`Remove selected items (${selectedItems.length})`}