Create table feature in core package

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

open-lens/src/renderer/index.ts

@@ -9,7 +9,8 @@ import {
   rendererExtensionApi as Renderer,
   commonExtensionApi as Common,
   registerLensCore,
-  metricsFeature
+  metricsFeature,
+  tableFeature,
 } from "@k8slens/core/renderer";
 import { autoRegister } from "@ogre-tools/injectable-extension-for-auto-registration";
 import { registerFeature } from "@k8slens/feature-core";
@@ -49,7 +50,8 @@ runInAction(() => {
     keyboardShortcutsFeature,
     reactApplicationFeature,
     routingFeature,
-    metricsFeature
+    metricsFeature,
+    tableFeature,
   );
 
   autoRegister({

packages/core/src/features/table/table-component.injectable.ts

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { tableComponentInjectionToken } from "@k8slens/table-tokens";
+import { getInjectable } from "@ogre-tools/injectable";
+import { Table } from "../../renderer/components/table/table";
+
+const tableComponentInjectable = getInjectable({
+  id: "table-component",
+  instantiate: () => ({ Component: Table }),
+  injectionToken: tableComponentInjectionToken,
+});
+
+export default tableComponentInjectable;

packages/core/src/features/table/table-feature.ts

@@ -0,0 +1,10 @@
+import { getFeature } from "@k8slens/feature-core";
+import tableComponentInjectable from "./table-component.injectable";
+
+export const tableFeature = getFeature({
+  id: "core-table-feature",
+
+  register: (di) => {
+    di.register(tableComponentInjectable);
+  },
+});

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

@@ -80,7 +80,7 @@ interface Dependencies {
   openConfirmDialog: OpenConfirmDialog;
   toggleTableColumnVisibility: ToggleTableColumnVisibility;
   isTableColumnHidden: IsTableColumnHidden;
-  table?: TableComponent;
+  table: TableComponent;
 }
 
 @observer
@@ -311,14 +311,11 @@ class NonInjectedItemListLayoutContent<
     const items = getItems();
     const selectedItems = store.pickOnlySelected(items);
 
-    if (table) {
-      return <table.Component tableId={tableId} columns={this.context.columns} {...this.props} />
-    }
-
     return (
       <div className="items box grow flex column">
-        <Table
+        <table.Component
           tableId={tableId}
+          columns={this.context.columns}
           virtual={virtual}
           selectable={hasDetailsView}
           sortable={sortingCallbacks}
@@ -332,7 +329,7 @@ class NonInjectedItemListLayoutContent<
         >
           {this.renderTableHeader()}
           {this.renderItems()}
-        </Table>
+        </table.Component>
 
         <Observer>
           {() => (

packages/core/src/renderer/library.ts

@@ -22,3 +22,4 @@ export * as ReactRouterDom from "react-router-dom";
 export * as rendererExtensionApi from "../extensions/renderer-api";
 export * as commonExtensionApi from "../extensions/common-api";
 export { metricsFeature } from "../features/metrics/metrics-feature";
+export { tableFeature } from "../features/table/table-feature";