flatten file heirarchy

Signed-off-by: Sebastian Malton <sebastian@malton.name>

src/renderer/components/+apps-helm-charts/helm-charts.tsx

@@ -12,7 +12,7 @@ import { helmChartStore } from "./helm-chart.store";
 import type { HelmChart } from "../../../common/k8s-api/endpoints/helm-charts.api";
 import { HelmChartDetails } from "./helm-chart-details";
 import { navigation } from "../../navigation";
-import { ItemListLayout } from "../item-object-list/item-list-layout";
+import { ItemListLayout } from "../item-object-list/list-layout";
 import { helmChartsURL } from "../../../common/routes";
 import type { HelmChartsRouteParams } from "../../../common/routes";
 

src/renderer/components/+network-port-forwards/port-forwards.tsx

@@ -8,7 +8,7 @@ import "./port-forwards.scss";
 import React from "react";
 import { disposeOnUnmount, observer } from "mobx-react";
 import type { RouteComponentProps } from "react-router-dom";
-import { ItemListLayout } from "../item-object-list/item-list-layout";
+import { ItemListLayout } from "../item-object-list/list-layout";
 import type { PortForwardItem, PortForwardStore } from "../../port-forward";
 import { PortForwardMenu } from "./port-forward-menu";
 import { PortForwardsRouteParams, portForwardsURL } from "../../../common/routes";

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

@@ -3,24 +3,24 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-import "../item-list-layout.scss";
+import "./item-list-layout.scss";
 
 import React, { ReactNode } from "react";
 import { computed, makeObservable } from "mobx";
 import { observer } from "mobx-react";
-import { ConfirmDialog, ConfirmDialogParams } from "../../confirm-dialog";
+import { ConfirmDialog, ConfirmDialogParams } from "../confirm-dialog";
-import { Table, TableCell, TableCellProps, TableHead, TableProps, TableRow, TableRowProps, TableSortCallbacks } from "../../table";
+import { Table, TableCell, TableCellProps, TableHead, TableProps, TableRow, TableRowProps, TableSortCallbacks } from "../table";
-import { boundMethod, cssNames, IClassName, isReactNode, prevDefault, stopPropagation } from "../../../utils";
+import { boundMethod, cssNames, IClassName, isReactNode, prevDefault, stopPropagation } from "../../utils";
-import { AddRemoveButtons, AddRemoveButtonsProps } from "../../add-remove-buttons";
+import { AddRemoveButtons, AddRemoveButtonsProps } from "../add-remove-buttons";
-import { NoItems } from "../../no-items";
+import { NoItems } from "../no-items";
-import { Spinner } from "../../spinner";
+import { Spinner } from "../spinner";
-import type { ItemObject, ItemStore } from "../../../../common/item.store";
+import type { ItemObject, ItemStore } from "../../../common/item.store";
-import { Filter, pageFilters } from "../page-filters.store";
+import { Filter, pageFilters } from "./page-filters.store";
-import { ThemeStore } from "../../../theme.store";
+import { ThemeStore } from "../../theme.store";
-import { MenuActions } from "../../menu/menu-actions";
+import { MenuActions } from "../menu/menu-actions";
-import { MenuItem } from "../../menu";
+import { MenuItem } from "../menu";
-import { Checkbox } from "../../checkbox";
+import { Checkbox } from "../checkbox";
-import { UserStore } from "../../../../common/user-store";
+import { UserStore } from "../../../common/user-store";
 
 interface ItemListLayoutContentProps<I extends ItemObject> {
   getFilters: () => Filter[]

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

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import "./item-list-layout.scss";
+
+import React from "react";
+import { PageFiltersList } from "./page-filters-list";
+import { observer } from "mobx-react";
+import type { Filter } from "./page-filters.store";
+
+export interface ItemListLayoutFilterProps {
+  getIsReady: () => boolean
+  getFilters: () => Filter[]
+  getFiltersAreShown: () => boolean
+  hideFilters: boolean
+}
+
+export const ItemListLayoutFilters = observer(({ getFilters, getFiltersAreShown, getIsReady, hideFilters }: ItemListLayoutFilterProps) => {
+  const filters = getFilters();
+
+  if (!getIsReady() || !filters.length || hideFilters || !getFiltersAreShown()) {
+    return null;
+  }
+
+  return <PageFiltersList filters={filters} />;
+});
+

src/renderer/components/item-object-list/header-filters.tsx

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { observer } from "mobx-react";
+import React from "react";
+import type { HeaderPlaceholders } from "./list-layout";
+
+export interface ItemListLayoutHeaderFiltersProps {
+  headerPlaceholders: HeaderPlaceholders
+}
+
+export const ItemListLayoutHeaderFilters = observer(({ headerPlaceholders }: ItemListLayoutHeaderFiltersProps) => (
+  <>
+    {headerPlaceholders.filters}
+  </>
+));

src/renderer/components/item-object-list/header-info.tsx

@@ -0,0 +1,54 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+import { observer } from "mobx-react";
+import type { ItemObject, ItemStore } from "../../../common/item.store";
+import type { Filter } from "./page-filters.store";
+import type { HeaderPlaceholders } from "./list-layout";
+
+interface ItemListLayoutHeaderInfoProps<I extends ItemObject> {
+  headerPlaceholders: HeaderPlaceholders;
+  getItems: () => I[];
+  store: ItemStore<I>;
+  getFilters: () => Filter[]
+  toggleFilters: () => void
+}
+
+export const ItemListLayoutHeaderInfo = observer(<I extends ItemObject>({
+  headerPlaceholders,
+  getItems,
+  getFilters,
+  store,
+  toggleFilters,
+}: ItemListLayoutHeaderInfoProps<I>) => {
+  const renderInfo = () => {
+    const allItemsCount = store.getTotalCount();
+    const itemsCount = getItems().length;
+
+    if (getFilters().length > 0) {
+      return (
+        <>
+          <a onClick={toggleFilters}>Filtered</a>: {itemsCount} / {allItemsCount}
+        </>
+      );
+    }
+
+    return allItemsCount === 1
+      ? `${allItemsCount} item`
+      : `${allItemsCount} items`;
+  };
+
+  const info = headerPlaceholders.info ?? renderInfo();
+
+  if (!info) {
+    return null;
+  }
+
+  return (
+    <div className="info-panel box grow">
+      {info}
+    </div>
+  );
+});

src/renderer/components/item-object-list/header-search.tsx

@@ -0,0 +1,27 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { observer } from "mobx-react";
+import type { ItemObject } from "../../../common/item.store";
+import { SearchInputUrl } from "../input";
+import React from "react";
+import type { HeaderPlaceholders, SearchFilter } from "./list-layout";
+
+interface ItemListLayoutHeaderSearchProps<I extends ItemObject> {
+  searchFilters: SearchFilter<I>[];
+  headerPlaceholders: HeaderPlaceholders;
+}
+
+export const ItemListLayoutHeaderSearch = observer(<I extends ItemObject>({
+  searchFilters,
+  headerPlaceholders = {},
+}: ItemListLayoutHeaderSearchProps<I>) => {
+  const { searchProps } = headerPlaceholders;
+
+  if (searchFilters.length === 0 || !searchProps) {
+    return null;
+  }
+
+  return <SearchInputUrl {...searchProps} />;
+});

src/renderer/components/item-object-list/header-title.tsx

@@ -4,7 +4,7 @@
  */
 import { observer } from "mobx-react";
 import React from "react";
-import type { HeaderPlaceholders } from "../../item-list-layout";
+import type { HeaderPlaceholders } from "./list-layout";
 
 interface ItemListLayoutHeaderTitleProps {
   renderHeaderTitle: React.ReactNode | (() => React.ReactNode);

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

@@ -3,20 +3,20 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-import "../item-list-layout.scss";
+import "./item-list-layout.scss";
 
 import React, { ReactNode } from "react";
 import { observer } from "mobx-react";
-import { cssNames, IClassName } from "../../../utils";
+import { cssNames, IClassName } from "../../utils";
-import type { ItemObject, ItemStore } from "../../../../common/item.store";
+import type { ItemObject, ItemStore } from "../../../common/item.store";
-import type { Filter } from "../page-filters.store";
+import type { Filter } from "./page-filters.store";
-import { ItemListLayoutHeaderTitle } from "./item-list-layout-header-title/item-list-layout-header-title";
+import { ItemListLayoutHeaderTitle } from "./header-title";
-import { ItemListLayoutHeaderInfo } from "./item-list-layout-header-info/item-list-layout-header-info";
+import { ItemListLayoutHeaderInfo } from "./header-info";
-import { ItemListLayoutHeaderFilters } from "./item-list-layout-header-filters/item-list-layout-header-filters";
+import { ItemListLayoutHeaderFilters } from "./header-filters";
-import { ItemListLayoutHeaderSearch } from "./item-list-layout-header-search/item-list-layout-header-search";
+import { ItemListLayoutHeaderSearch } from "./header-search";
-import type { HeaderCustomizer, SearchFilter } from "../item-list-layout";
+import type { HeaderCustomizer, SearchFilter } from "./list-layout";
 
-interface ItemListLayoutHeaderProps<I extends ItemObject> {
+export interface ItemListLayoutHeaderProps<I extends ItemObject> {
   getItems: () => I[];
   getFilters: () => Filter[];
   toggleFilters: () => void;
@@ -44,6 +44,10 @@ export class ItemListLayoutHeader<I extends ItemObject> extends React.Component<
       renderHeaderTitle,
       headerClassName,
       searchFilters,
+      getItems,
+      store,
+      getFilters,
+      toggleFilters,
     } = this.props;
 
     if (!showHeader) {
@@ -69,10 +73,10 @@ export class ItemListLayoutHeader<I extends ItemObject> extends React.Component<
 
         <ItemListLayoutHeaderInfo
           headerPlaceholders={headerPlaceholders}
-          getItems={this.props.getItems}
+          getItems={getItems}
-          store={this.props.store}
+          store={store}
-          getFilters={this.props.getFilters}
+          getFilters={getFilters}
-          toggleFilters={this.props.toggleFilters}
+          toggleFilters={toggleFilters}
         />
 
         <ItemListLayoutHeaderFilters headerPlaceholders={headerPlaceholders} />

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

@@ -3,4 +3,4 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-export * from "./item-list-layout";
+export * from "./list-layout";

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

@@ -1,32 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-import "../item-list-layout.scss";
-
-import React from "react";
-import { PageFiltersList } from "../page-filters-list";
-import { observer } from "mobx-react";
-import type { Filter } from "../page-filters.store";
-
-interface ItemListLayoutFilterProps {
-  getIsReady: () => boolean
-  getFilters: () => Filter[]
-  getFiltersAreShown: () => boolean
-  hideFilters: boolean
-}
-
-@observer
-export class ItemListLayoutFilters extends React.Component<ItemListLayoutFilterProps> {
-  render() {
-    const filters = this.props.getFilters();
-
-    if (!this.props.getIsReady() || !filters.length || this.props.hideFilters || !this.props.getFiltersAreShown()) {
-      return null;
-    }
-
-    return <PageFiltersList filters={filters} />;
-  }
-}
-

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

@@ -1,17 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import { observer } from "mobx-react";
-import React from "react";
-import type { HeaderPlaceholders } from "../../item-list-layout";
-
-interface ItemListLayoutHeaderFiltersProps {
-  headerPlaceholders: HeaderPlaceholders
-}
-
-export const ItemListLayoutHeaderFilters = observer(
-  ({ headerPlaceholders }: ItemListLayoutHeaderFiltersProps) => (
-    <>{headerPlaceholders.filters}</>
-  ),
-);

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

@@ -1,53 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import React from "react";
-import { observer } from "mobx-react";
-import type { ItemObject, ItemStore } from "../../../../../common/item.store";
-import type { Filter } from "../../page-filters.store";
-import type { HeaderPlaceholders } from "../../item-list-layout";
-
-interface ItemListLayoutHeaderInfoProps<I extends ItemObject> {
-  headerPlaceholders: HeaderPlaceholders;
-  getItems: () => I[];
-  store: ItemStore<I>;
-  getFilters: () => Filter[]
-  toggleFilters: () => void
-}
-
-export const ItemListLayoutHeaderInfo = observer(
-  <I extends ItemObject>(props: ItemListLayoutHeaderInfoProps<I>) => {
-    const { headerPlaceholders, getItems, getFilters, store, toggleFilters } =
-      props;
-
-    const renderInfo = () => {
-      const allItemsCount = store.getTotalCount();
-      const itemsCount = getItems().length;
-
-      if (getFilters().length > 0) {
-        return (
-          <>
-            <a onClick={toggleFilters}>Filtered</a>: {itemsCount} /{" "}
-            {allItemsCount}
-          </>
-        );
-      }
-
-      return allItemsCount === 1
-        ? `${allItemsCount} item`
-        : `${allItemsCount} items`;
-    };
-
-    const info =
-      headerPlaceholders.info === undefined
-        ? renderInfo()
-        : headerPlaceholders.info;
-
-    if (!info) {
-      return null;
-    }
-
-    return <div className="info-panel box grow">{info}</div>;
-  },
-);

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

@@ -1,32 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import { observer } from "mobx-react";
-import type { ItemObject } from "../../../../../common/item.store";
-import { SearchInputUrl } from "../../../input";
-import React from "react";
-import type { HeaderPlaceholders, SearchFilter } from "../../item-list-layout";
-
-interface ItemListLayoutHeaderSearchProps<I extends ItemObject> {
-  searchFilters: SearchFilter<I>[];
-  headerPlaceholders: HeaderPlaceholders;
-}
-
-export const ItemListLayoutHeaderSearch = observer(
-  <I extends ItemObject>({
-    searchFilters,
-    headerPlaceholders,
-  }: ItemListLayoutHeaderSearchProps<I>) => {
-    const searchProps =
-      headerPlaceholders.searchProps !== undefined
-        ? headerPlaceholders.searchProps
-        : {};
-
-    if (searchFilters.length === 0 || !searchProps) {
-      return null;
-    }
-
-    return <SearchInputUrl {...searchProps} />;
-  },
-);

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

@@ -32,11 +32,11 @@ import type { NamespaceStore } from "../+namespaces/namespace-store/namespace.st
 import namespaceStoreInjectable from "../+namespaces/namespace-store/namespace-store.injectable";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import itemListLayoutStorageInjectable
-  from "./item-list-layout-storage/item-list-layout-storage.injectable";
+  from "./storage.injectable";
-import { ItemListLayoutContent } from "./item-list-layout-content/item-list-layout-content";
+import { ItemListLayoutContent } from "./content";
-import { ItemListLayoutHeader } from "./item-list-layout-header/item-list-layout-header";
+import { ItemListLayoutHeader } from "./header";
 import groupBy from "lodash/groupBy";
-import { ItemListLayoutFilters } from "./item-list-layout-filters/item-list-layout-filters";
+import { ItemListLayoutFilters } from "./filters";
 import { observer } from "mobx-react";
 
 export type SearchFilter<I extends ItemObject> = (item: I) => string | number | (string | number)[];
@@ -286,38 +286,28 @@ class NonInjectedItemListLayout<I extends ItemObject> extends React.Component<It
           failedToLoadMessage={this.props.failedToLoadMessage}
         />
 
-        {this.props.renderFooter && this.props.renderFooter(this)}
+        {this.props.renderFooter?.(this)}
       </div>
     ));
   }
 }
 
-export function ItemListLayout<I extends ItemObject>(
+const InjectedItemListLayout = withInjectables<Dependencies, ItemListLayoutProps<ItemObject>>(NonInjectedItemListLayout, {
-  props: ItemListLayoutProps<I>,
+  getProps: (di, props) => ({
-) {
+    namespaceStore: di.inject(namespaceStoreInjectable),
-  const InjectedItemListLayout = withInjectables<
+    itemListLayoutStorage: di.inject(itemListLayoutStorageInjectable),
-    Dependencies,
+    ...props,
-    ItemListLayoutProps<I>
+  }),
-  >(
+});
-    NonInjectedItemListLayout,
-
-    {
-      getProps: (di, props) => ({
-        namespaceStore: di.inject(namespaceStoreInjectable),
-        itemListLayoutStorage: di.inject(itemListLayoutStorageInjectable),
-        ...props,
-      }),
-    },
-  );
 
+export function ItemListLayout<I extends ItemObject>(props: ItemListLayoutProps<I>) {
   return <InjectedItemListLayout {...props} />;
 }
 
-const applyFilters = <I extends ItemObject>(
+function applyFilters<I extends ItemObject>(filters: ItemsFilter<I>[], items: I[]): I[] {
-  filters: ItemsFilter<I>[],
+  if (!filters || !filters.length) {
-  items: I[],
+    return items;
-): I[] => {
+  }
-  if (!filters || !filters.length) return items;
 
   return filters.reduce((items, filter) => filter(items), items);
-};
+}

src/renderer/components/item-object-list/storage.injectable.ts

@@ -3,7 +3,7 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
-import createStorageInjectable from "../../../utils/create-storage/create-storage.injectable";
+import createStorageInjectable from "../../utils/create-storage/create-storage.injectable";
 
 const itemListLayoutStorageInjectable = getInjectable({
   instantiate: (di) => {

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

@@ -10,7 +10,7 @@ import { computed, makeObservable, observable, reaction } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { cssNames, Disposer } from "../../utils";
 import type { KubeObject } from "../../../common/k8s-api/kube-object";
-import { ItemListLayout, ItemListLayoutProps } from "../item-object-list/item-list-layout";
+import { ItemListLayout, ItemListLayoutProps } from "../item-object-list/list-layout";
 import type { KubeObjectStore } from "../../../common/k8s-api/kube-object.store";
 import { KubeObjectMenu } from "../kube-object-menu";
 import { NamespaceSelectFilter } from "../+namespaces/namespace-select-filter";