List layout column injection token package (#7544)

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
Signed-off-by: Sami Tiilikainen <97873007+samitiilikainen@users.noreply.github.com>
Co-authored-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

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,43 @@
+{
+  "name": "@k8slens/list-layout",
+  "private": false,
+  "version": "1.0.0-alpha.0",
+  "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.2",
+    "@k8slens/jest": "^6.5.0-alpha.2",
+    "@k8slens/typescript": "^6.5.0-alpha.2"
+  }
+}

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;