Separate injection token as package

Signed-off-by: Sami Tiilikainen <97873007+samitiilikainen@users.noreply.github.com>

packages/core/package.json

@@ -115,6 +115,7 @@
     "@k8slens/metrics": "^6.5.0-alpha.3",
     "@k8slens/node-fetch": "^6.5.0-alpha.3",
     "@k8slens/react-application": "^1.0.0-alpha.2",
+    "@k8slens/list-layout": "^6.5.0-alpha.2",
     "@kubernetes/client-node": "^0.18.1",
     "@material-ui/styles": "^4.11.5",
     "@sentry/electron": "^3.0.8",

packages/core/src/renderer/components/+workloads-pods/columns/pods-age-column.injectable.tsx

@@ -5,8 +5,8 @@
 import { getInjectable } from "@ogre-tools/injectable";
 import React from "react";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 import { KubeObjectAge } from "../../kube-object/age";
 
 export const podsAgeColumnInjectable = getInjectable({

packages/core/src/renderer/components/+workloads-pods/columns/pods-containers-column.injectable.tsx

@@ -7,8 +7,8 @@ import { getInjectable } from "@ogre-tools/injectable";
 import startCase from "lodash/startCase";
 import React from "react";
 import type { ContainerStateValues, Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 import { StatusBrick } from "../../status-brick";
 
 function renderState(name: string, ready: boolean, key: string, data?: ContainerStateValues) {

packages/core/src/renderer/components/+workloads-pods/columns/pods-name-column.injectable.tsx

@@ -6,8 +6,8 @@ import { getConvertedParts } from "@k8slens/utilities";
 import { getInjectable } from "@ogre-tools/injectable";
 import React from "react";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 import { Tooltip } from "../../tooltip";
 
 export const podsNameColumnInjectable = getInjectable({

packages/core/src/renderer/components/+workloads-pods/columns/pods-namespace-column.injectable.tsx

@@ -6,8 +6,8 @@ import { getInjectable } from "@ogre-tools/injectable";
 import React from "react";
 import { NamespaceSelectBadge } from "../../+namespaces/namespace-select-badge";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 
 export const podsNamespaceColumnInjectable = getInjectable({
   id: "pods-namespace-column",

packages/core/src/renderer/components/+workloads-pods/columns/pods-node-column.injectable.tsx

@@ -9,8 +9,8 @@ import nodeApiInjectable from "../../../../common/k8s-api/endpoints/node.api.inj
 import type { Pod } from "../../../../common/k8s-api/endpoints";
 import { Badge } from "../../badge";
 import getDetailsUrlInjectable from "../../kube-detail-params/get-details-url.injectable";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 import { stopPropagation } from "@k8slens/utilities";
 
 export const podsNodeColumnInjectable = getInjectable({

packages/core/src/renderer/components/+workloads-pods/columns/pods-owners-column.injectable.tsx

@@ -10,8 +10,8 @@ import apiManagerInjectable from "../../../../common/k8s-api/api-manager/manager
 import type { Pod } from "../../../../common/k8s-api/endpoints";
 import { Badge } from "../../badge";
 import getDetailsUrlInjectable from "../../kube-detail-params/get-details-url.injectable";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 
 export const podsOwnersColumnInjectable = getInjectable({
   id: "pods-owners-column",

packages/core/src/renderer/components/+workloads-pods/columns/pods-qos-column.injectable.tsx

@@ -4,8 +4,8 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 
 export const podsQosColumnInjectable = getInjectable({
   id: "pods-qos-column",

packages/core/src/renderer/components/+workloads-pods/columns/pods-restarts-column.injectable.tsx

@@ -4,8 +4,8 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 
 export const podsRestartsColumnInjectable = getInjectable({
   id: "pods-restarts-column",

packages/core/src/renderer/components/+workloads-pods/columns/pods-status-column.injectable.tsx

@@ -5,8 +5,8 @@
 import { getInjectable } from "@ogre-tools/injectable";
 import { kebabCase } from "lodash";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 
 export const podsStatusColumnInjectable = getInjectable({
   id: "pods-status-column",

packages/core/src/renderer/components/+workloads-pods/columns/pods-status-icon-column.injectable.tsx

@@ -5,8 +5,8 @@
 import { getInjectable } from "@ogre-tools/injectable";
 import React from "react";
 import type { Pod } from "../../../../common/k8s-api/endpoints";
-import type { KubeObjectListLayoutColumn } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
-import { kubeObjectListLayoutColumnInjectionToken } from "../../kube-object-list-layout/kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 import { KubeObjectStatusIcon } from "../../kube-object-status-icon";
 
 export const podsQosColumnInjectable = getInjectable({

packages/core/src/renderer/components/kube-object-list-layout/kube-object-list-layout-column-injection-token.tsx

@@ -1,24 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import type { ReactNode } from "react";
-import type { SearchFilter } from "../item-object-list/list-layout";
-import type { TableCellProps, TableSortCallback } from "../table";
-import type { ItemObject } from "../../../common/item.store";
-import { getInjectionToken } from "@ogre-tools/injectable";
-
-export interface KubeObjectListLayoutColumn<Item extends ItemObject> {
-  id: string;
-  kind: string;
-  apiVersion: string;
-  priority: number;
-  sortingCallBack?: TableSortCallback<Item>;
-  searchFilter?: SearchFilter<Item>;
-  header: (TableCellProps | undefined | null);
-  content: (item: Item) => (ReactNode | TableCellProps);
-}
-
-export const kubeObjectListLayoutColumnInjectionToken = getInjectionToken<KubeObjectListLayoutColumn<any>>({
-  id: "kube-object-list-layout-column",
-});

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

@@ -29,9 +29,9 @@ import type { ToggleKubeDetailsPane } from "../kube-detail-params/toggle-details
 import kubeSelectedUrlParamInjectable from "../kube-detail-params/kube-selected-url.injectable";
 import toggleKubeDetailsPaneInjectable from "../kube-detail-params/toggle-details.injectable";
 import type { ClusterContext } from "../../cluster-frame-context/cluster-frame-context";
-import type { KubeObjectListLayoutColumn } from "./kube-object-list-layout-column-injection-token";
+import type { KubeObjectListLayoutColumn } from "@k8slens/list-layout";
 import type { ItemObject } from "../../../common/item.store";
-import { kubeObjectListLayoutColumnInjectionToken } from "./kube-object-list-layout-column-injection-token";
+import { kubeObjectListLayoutColumnInjectionToken } from "@k8slens/list-layout";
 import { sortBy } from "lodash";
 
 export interface KubeObjectListLayoutProps<

packages/core/src/renderer/library.ts

@@ -10,7 +10,6 @@ import setStatusBarStatusInjectable from "./components/status-bar/set-status-bar
 // @experimental
 export type { Environments } from "../extensions/as-legacy-globals-for-extension-api/legacy-global-di-for-extension-api";
 export { nodeEnvInjectionToken } from "../common/vars/node-env-injection-token";
-export * from "./components/kube-object-list-layout/kube-object-list-layout-column-injection-token";
 export { registerLensCore } from "./register-lens-core";
 export {
   React,

packages/list-layout/.eslintrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+  extends: "@k8slens/eslint-config/eslint",
+  parserOptions: {
+    project: "./tsconfig.json",
+  },
+};

packages/list-layout/.prettierrc

@@ -0,0 +1 @@
+"@k8slens/eslint-config/prettier"

packages/list-layout/index.ts

@@ -0,0 +1 @@
+export * from "./kube-object-list-layout-column-injection-token";

packages/list-layout/jest.config.js

@@ -0,0 +1 @@
+module.exports = require("@k8slens/jest").monorepoPackageConfig(__dirname).configForReact;

packages/list-layout/kube-object-list-layout-column-injection-token.tsx

@@ -0,0 +1,97 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import type { ReactNode } from "react";
+import type { SingleOrMany } from "@k8slens/utilities";
+import { getInjectionToken } from "@ogre-tools/injectable";
+
+export interface ItemObject {
+  getId(): string;
+  getName(): string;
+}
+
+export type TableSortBy = string;
+export type TableOrderBy = "asc" | "desc";
+export interface TableSortParams {
+  sortBy: TableSortBy;
+  orderBy: TableOrderBy;
+}
+
+export type TableSortCallback<Item> = (data: Item) => undefined | string | number | (string | number)[];
+export type TableSortCallbacks<Item> = Record<string, TableSortCallback<Item>>;
+
+export type SearchFilter<I extends ItemObject> = (item: I) => SingleOrMany<string | number | undefined | null>;
+
+export interface TableCellProps extends React.DOMAttributes<HTMLDivElement> {
+  /**
+   * used for configuration visibility of columns
+   */
+  id?: string;
+
+  /**
+   * Any css class names for this table cell. Only used if `title` is a "simple" react node
+   */
+  className?: string;
+
+  /**
+   * The actual value of the cell
+   */
+  title?: ReactNode;
+
+  /**
+   * content inside could be scrolled
+   */
+  scrollable?: boolean;
+
+  /**
+   * render cell with a checkbox
+   */
+  checkbox?: boolean;
+
+  /**
+   * mark checkbox as checked or not
+   */
+  isChecked?: boolean;
+
+  /**
+   * column name, must be same as key in sortable object <Table sortable={}/>
+   */
+  sortBy?: TableSortBy;
+
+  /**
+   * id of the column which follow same visibility rules
+   */
+  showWithColumn?: string;
+
+  /**
+   * @internal
+   */
+  _sorting?: Partial<TableSortParams>;
+
+  /**
+   * @internal
+   */
+  _sort?(sortBy: TableSortBy): void;
+
+  /**
+   * @internal
+   * indicator, might come from parent <TableHead>, don't use this prop outside (!)
+   */
+  _nowrap?: boolean;
+}
+
+export interface KubeObjectListLayoutColumn<Item extends ItemObject> {
+  id: string;
+  kind: string;
+  apiVersion: string;
+  priority: number;
+  sortingCallBack?: TableSortCallback<Item>;
+  searchFilter?: SearchFilter<Item>;
+  header: TableCellProps | undefined | null;
+  content: (item: Item) => ReactNode | TableCellProps;
+}
+
+export const kubeObjectListLayoutColumnInjectionToken = getInjectionToken<KubeObjectListLayoutColumn<any>>({
+  id: "kube-object-list-layout-column",
+});

packages/list-layout/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@k8slens/list-layout",
+  "private": false,
+  "version": "6.5.0-alpha.2",
+  "description": "Injection tokens for list layout",
+  "type": "commonjs",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/lensapp/lens.git"
+  },
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "author": {
+    "name": "OpenLens Authors",
+    "email": "info@k8slens.dev"
+  },
+  "license": "MIT",
+  "homepage": "https://github.com/lensapp/lens",
+  "scripts": {
+    "build": "webpack",
+    "clean": "rimraf dist/",
+    "dev": "webpack --mode=development --watch",
+    "test": "jest --coverage --runInBand",
+    "lint": "lens-lint",
+    "lint:fix": "lens-lint --fix"
+  },
+  "peerDependencies": {
+    "@ogre-tools/injectable": "^15.1.2",
+    "react": "^17.0.2"
+  },
+  "devDependencies": {
+    "@k8slens/eslint-config": "6.5.0-alpha.1"
+  }
+}

packages/list-layout/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "@k8slens/typescript/config/base.json",
+  "include": ["**/*.ts"]
+}

packages/list-layout/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require("@k8slens/webpack").configForReact;