diff --git a/package-lock.json b/package-lock.json index 237ae036d6..3ad409bb83 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3854,6 +3854,10 @@ "resolved": "packages/utility-features/startable-stoppable", "link": true }, + "node_modules/@k8slens/table": { + "resolved": "packages/table", + "link": true + }, "node_modules/@k8slens/test-utils": { "resolved": "packages/utility-features/test-utils", "link": true @@ -35355,6 +35359,17 @@ "rimraf": "^4.4.1" } }, + "packages/table": { + "version": "6.5.0", + "license": "MIT", + "devDependencies": { + "@k8slens/webpack": "^6.5.0-alpha.8", + "rimraf": "^4.4.1" + }, + "peerDependencies": { + "@ogre-tools/injectable": "^17.1.0" + } + }, "packages/technical-features/application/agnostic": { "name": "@k8slens/application", "version": "6.5.0", diff --git a/packages/core/src/renderer/components/item-object-list/content.tsx b/packages/core/src/renderer/components/item-object-list/content.tsx index de19c1c058..5f7fce51c1 100644 --- a/packages/core/src/renderer/components/item-object-list/content.tsx +++ b/packages/core/src/renderer/components/item-object-list/content.tsx @@ -11,14 +11,14 @@ import { computed, makeObservable } from "mobx"; import { Observer, observer } from "mobx-react"; import type { ConfirmDialogParams } from "../confirm-dialog"; import type { TableProps, TableRowProps, TableSortCallbacks } from "../table"; -import { Table, TableCell, TableHead, TableRow } from "../table"; +import { TableCell, TableHead, TableRow } from "../table"; import type { IClassName, StrictReactNode } from "@k8slens/utilities"; import { cssNames, isDefined, isReactNode, noop, prevDefault, stopPropagation } from "@k8slens/utilities"; import type { AddRemoveButtonsProps } from "../add-remove-buttons"; import { AddRemoveButtons } from "../add-remove-buttons"; import { NoItems } from "../no-items"; import { Spinner } from "../spinner"; -import type { ItemObject, TableCellProps } from "@k8slens/list-layout"; +import type { GeneralKubeObjectListLayoutColumn, ItemObject, TableCellProps } from "@k8slens/list-layout"; import type { Filter, PageFiltersStore } from "./page-filters/store"; import type { LensTheme } from "../../themes/lens-theme"; import { MenuActions } from "../menu/menu-actions"; @@ -35,6 +35,8 @@ import type { ToggleTableColumnVisibility } from "../../../features/user-prefere import toggleTableColumnVisibilityInjectable from "../../../features/user-preferences/common/toggle-table-column-visibility.injectable"; import type { IsTableColumnHidden } from "../../../features/user-preferences/common/is-table-column-hidden.injectable"; import isTableColumnHiddenInjectable from "../../../features/user-preferences/common/is-table-column-hidden.injectable"; +import type { TableComponent } from "@k8slens/table"; +import { tableComponentInjectionToken } from "@k8slens/table"; export interface ItemListLayoutContentProps { getFilters: () => Filter[]; @@ -54,6 +56,7 @@ export interface ItemListLayoutContentProps Partial>; addRemoveButtons?: Partial; virtual?: boolean; + columns?: GeneralKubeObjectListLayoutColumn[]; // item details view hasDetailsView?: boolean; @@ -79,6 +82,7 @@ interface Dependencies { openConfirmDialog: OpenConfirmDialog; toggleTableColumnVisibility: ToggleTableColumnVisibility; isTableColumnHidden: IsTableColumnHidden; + table: TableComponent; } @observer @@ -299,6 +303,7 @@ class NonInjectedItemListLayoutContent< const { store, hasDetailsView, addRemoveButtons = {}, virtual, sortingCallbacks, detailsItem, className, tableProps = {}, tableId, getItems, activeTheme, + table, } = this.props; const selectedItemId = detailsItem && detailsItem.getId(); const classNames = cssNames(className, "box", "grow", activeTheme.get().type); @@ -307,7 +312,7 @@ class NonInjectedItemListLayoutContent< return (
- {this.renderTableHeader()} {this.renderItems()} -
+ {() => ( @@ -385,5 +390,6 @@ export const ItemListLayoutContent = withInjectables(props: ItemListLayoutContentProps) => React.ReactElement; diff --git a/packages/core/src/renderer/components/item-object-list/list-layout.tsx b/packages/core/src/renderer/components/item-object-list/list-layout.tsx index 32f46e7a2a..2bbf95e45c 100644 --- a/packages/core/src/renderer/components/item-object-list/list-layout.tsx +++ b/packages/core/src/renderer/components/item-object-list/list-layout.tsx @@ -13,7 +13,7 @@ import type { TableProps, TableRowProps, TableSortCallbacks } from "../table"; import type { IClassName, StrictReactNode, SingleOrMany } from "@k8slens/utilities"; import { cssNames, noop } from "@k8slens/utilities"; import type { AddRemoveButtonsProps } from "../add-remove-buttons"; -import type { ItemObject, TableCellProps } from "@k8slens/list-layout"; +import type { ItemObject, TableCellProps, GeneralKubeObjectListLayoutColumn } from "@k8slens/list-layout"; import type { SearchInputUrlProps } from "../input"; import type { PageFiltersStore } from "./page-filters/store"; import { FilterType } from "./page-filters/store"; @@ -98,6 +98,7 @@ export type ItemListLayoutProps; customizeHeader?: HeaderCustomizer | HeaderCustomizer[]; + columns?: GeneralKubeObjectListLayoutColumn[]; // items list configuration isReady?: boolean; // show loading indicator while not ready diff --git a/packages/core/src/renderer/components/kube-object-list-layout/kube-object-list-layout.tsx b/packages/core/src/renderer/components/kube-object-list-layout/kube-object-list-layout.tsx index 9280d55ac8..2bbadc144e 100644 --- a/packages/core/src/renderer/components/kube-object-list-layout/kube-object-list-layout.tsx +++ b/packages/core/src/renderer/components/kube-object-list-layout/kube-object-list-layout.tsx @@ -42,7 +42,7 @@ export interface KubeObjectListLayoutProps< // eslint-disable-next-line unused-imports/no-unused-vars-ts, @typescript-eslint/no-unused-vars A extends KubeApi, D extends KubeJsonApiDataFor, -> extends Omit, "getItems" | "dependentStores" | "preloadStores"> { +> extends Omit, "getItems" | "dependentStores" | "preloadStores" | "columns"> { items?: K[]; getItems?: () => K[]; store: KubeItemListStore; @@ -193,6 +193,7 @@ class NonInjectedKubeObjectListLayout< getItems={() => this.props.items || store.contextItems} preloadStores={false} // loading handled in kubeWatchApi.subscribeStores() detailsItem={this.selectedItem} + columns={targetColumns as GeneralKubeObjectListLayoutColumn[]} customizeHeader={[ ({ filters, searchProps, info, ...headerPlaceHolders }) => ({ filters: (