From b14d0be0dc867f0b012706bf88a628269fb53cf5 Mon Sep 17 00:00:00 2001
From: heswell <steve@heswell.com>
Date: Sun, 1 Oct 2023 21:55:21 +0100
Subject: [PATCH] fix type issues

---
 .../packages/vuu-data/src/json-data-source.ts |  6 ++
 vuu-ui/packages/vuu-datagrid-types/index.d.ts |  3 +-
 .../ColumnFormattingPanel.tsx                 |  2 +-
 .../CalculatedColumnPanel.css                 |  5 -
 .../CalculatedColumnPanel.tsx                 | 99 -------------------
 .../table-next/table-cell/TableGroupCell.tsx  |  6 +-
 .../vuu-ui-controls/src/list/listTypes.ts     |  3 +-
 .../vuu-utils/src/component-registry.ts       | 13 ++-
 8 files changed, 23 insertions(+), 114 deletions(-)
 delete mode 100644 vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.css
 delete mode 100644 vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.tsx

diff --git a/vuu-ui/packages/vuu-data/src/json-data-source.ts b/vuu-ui/packages/vuu-data/src/json-data-source.ts
index 0fbd1fbd7..9131b38c8 100644
--- a/vuu-ui/packages/vuu-data/src/json-data-source.ts
+++ b/vuu-ui/packages/vuu-data/src/json-data-source.ts
@@ -7,6 +7,7 @@ import {
   VuuSort,
   ClientToServerMenuRPC,
   ClientToServerEditRpc,
+  VuuColumnDataType,
 } from "@finos/vuu-protocol-types";
 import { DataSourceFilter, DataSourceRow } from "@finos/vuu-data-types";
 import {
@@ -374,6 +375,11 @@ export class JsonDataSource
     return undefined;
   }
 
+  applyEdit(rowIndex: number, columnName: string, value: VuuColumnDataType) {
+    console.log(`ArrayDataSource applyEdit ${rowIndex} ${columnName} ${value}`);
+    return true;
+  }
+
   getChildRows(rowKey: string) {
     const parentRow = this.#data.find((row) => row[KEY] === rowKey);
     if (parentRow) {
diff --git a/vuu-ui/packages/vuu-datagrid-types/index.d.ts b/vuu-ui/packages/vuu-datagrid-types/index.d.ts
index 4e601e0c5..7e4b75b21 100644
--- a/vuu-ui/packages/vuu-datagrid-types/index.d.ts
+++ b/vuu-ui/packages/vuu-datagrid-types/index.d.ts
@@ -25,6 +25,7 @@ export type DataCellEditHandler = (
 ) => boolean;
 
 export interface TableCellProps {
+  className?: string;
   column: KeyedColumnDescriptor;
   columnMap: ColumnMap;
   onClick?: (event: MouseEvent, column: KeyedColumnDescriptor) => void;
@@ -34,7 +35,7 @@ export interface TableCellProps {
 
 export interface TableCellRendererProps
   extends Omit<TableCellProps, "onDataEdited"> {
-  onCommit: (value: VuuColumnDataType) => boolean;
+  onCommit?: (value: VuuColumnDataType) => boolean;
 }
 
 export interface TableAttributes {
diff --git a/vuu-ui/packages/vuu-table-extras/src/column-formatting-settings/ColumnFormattingPanel.tsx b/vuu-ui/packages/vuu-table-extras/src/column-formatting-settings/ColumnFormattingPanel.tsx
index 2a6dee520..aa2283517 100644
--- a/vuu-ui/packages/vuu-table-extras/src/column-formatting-settings/ColumnFormattingPanel.tsx
+++ b/vuu-ui/packages/vuu-table-extras/src/column-formatting-settings/ColumnFormattingPanel.tsx
@@ -19,7 +19,7 @@ export interface ColumnFormattingPanelProps
   onChangeRenderer: SelectionChangeHandler<CellRendererDescriptor>;
 }
 
-const itemToString = (item: CellRendererDescriptor) => item.label;
+const itemToString = (item: CellRendererDescriptor) => item.label ?? item.name;
 
 export const ColumnFormattingPanel = ({
   availableRenderers,
diff --git a/vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.css b/vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.css
deleted file mode 100644
index 4b9aee7e3..000000000
--- a/vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.vuuCalculatedColumnPanel {
-    display: flex;
-    flex-direction: column;
-    gap: var(--salt-size-unit);
-}
\ No newline at end of file
diff --git a/vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.tsx b/vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.tsx
deleted file mode 100644
index 03c65da5c..000000000
--- a/vuu-ui/packages/vuu-table-extras/src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import { ColumnDescriptor } from "@finos/vuu-datagrid-types";
-import { VuuTable } from "@finos/vuu-protocol-types";
-import {
-  Button,
-  FormField,
-  FormFieldLabel,
-  Input,
-  Panel,
-  Text,
-} from "@salt-ds/core";
-import {
-  ChangeEventHandler,
-  Dispatch,
-  HTMLAttributes,
-  useCallback,
-  useRef,
-  useState,
-} from "react";
-import {
-  ColumnDefinitionExpression,
-  ColumnExpressionInput,
-  useColumnExpressionSuggestionProvider,
-} from "../../column-expression-input";
-import { ColumnAction } from "../settings-panel/useGridSettings";
-
-import "./CalculatedColumnPanel.css";
-
-export interface CalculatedColumnPanelProps
-  extends HTMLAttributes<HTMLDivElement> {
-  columns: ColumnDescriptor[];
-  dispatchColumnAction: Dispatch<ColumnAction>;
-  table: VuuTable;
-}
-
-export const CalculatedColumnPanel = ({
-  columns,
-  dispatchColumnAction,
-  table,
-}: CalculatedColumnPanelProps) => {
-  const [columnName, setColumnName] = useState("");
-  const [, setExpression] = useState<ColumnDefinitionExpression>();
-  const sourceRef = useRef<string>("");
-
-  const suggestionProvider = useColumnExpressionSuggestionProvider({
-    columns,
-    table,
-  });
-
-  const handleChangeName: ChangeEventHandler<HTMLInputElement> = useCallback(
-    (evt) => {
-      const { value } = evt.target as HTMLInputElement;
-      setColumnName(value);
-    },
-    []
-  );
-  const handleChangeExpression = useCallback((source: string) => {
-    sourceRef.current = source;
-  }, []);
-
-  const handleSubmitExpression = useCallback(
-    (source: string, expression: ColumnDefinitionExpression | undefined) => {
-      console.log({ source });
-      setExpression(expression);
-    },
-    []
-  );
-
-  const handleSave = useCallback(() => {
-    if (sourceRef.current) {
-      console.log(
-        `save expression ${JSON.stringify(sourceRef.current, null, 2)}`
-      );
-      dispatchColumnAction({
-        type: "addCalculatedColumn",
-        columnName,
-        expression: sourceRef.current,
-        columnType: "string",
-      });
-    }
-  }, [columnName, dispatchColumnAction]);
-
-  return (
-    <Panel className="vuuCalculatedColumnPanel" title="Define Computed Column">
-      <Text styleAs="h4">Define Computed Column</Text>
-      <FormField labelPlacement="left">
-        <FormFieldLabel>Column Name</FormFieldLabel>
-        <Input value={columnName} onChange={handleChangeName} />
-      </FormField>
-      <ColumnExpressionInput
-        onChange={handleChangeExpression}
-        onSubmitExpression={handleSubmitExpression}
-        suggestionProvider={suggestionProvider}
-      />
-      <div style={{ marginTop: 12 }}>
-        <Button onClick={handleSave}>Add Column</Button>
-      </div>
-    </Panel>
-  );
-};
diff --git a/vuu-ui/packages/vuu-table/src/table-next/table-cell/TableGroupCell.tsx b/vuu-ui/packages/vuu-table/src/table-next/table-cell/TableGroupCell.tsx
index 09e6cf8b0..046774109 100644
--- a/vuu-ui/packages/vuu-table/src/table-next/table-cell/TableGroupCell.tsx
+++ b/vuu-ui/packages/vuu-table/src/table-next/table-cell/TableGroupCell.tsx
@@ -1,7 +1,9 @@
-import { GroupColumnDescriptor } from "@finos/vuu-datagrid-types";
+import {
+  GroupColumnDescriptor,
+  TableCellProps,
+} from "@finos/vuu-datagrid-types";
 import { getGroupValueAndOffset, metadataKeys } from "@finos/vuu-utils";
 import { MouseEvent, useCallback } from "react";
-import { TableCellProps } from "./TableCell";
 import { useCell } from "../useCell";
 import cx from "classnames";
 
diff --git a/vuu-ui/packages/vuu-ui-controls/src/list/listTypes.ts b/vuu-ui/packages/vuu-ui-controls/src/list/listTypes.ts
index bae846838..23a4547e2 100644
--- a/vuu-ui/packages/vuu-ui-controls/src/list/listTypes.ts
+++ b/vuu-ui/packages/vuu-ui-controls/src/list/listTypes.ts
@@ -14,7 +14,6 @@ import { ScrollingAPI, ViewportTrackingResult } from "./common-hooks";
 
 import {
   CollectionHookResult,
-  CollectionItem,
   ListHandlers,
   NavigationHookResult,
   SelectHandler,
@@ -261,7 +260,7 @@ export interface ListHookProps<Item, Selection extends SelectionStrategy>
 
 export interface ListHookResult<Item, Selection extends SelectionStrategy>
   extends Partial<ViewportTrackingResult<Item>>,
-    Pick<SelectionHookResult<Item, Selection>, "selected" | "setSelected">,
+    Pick<SelectionHookResult<Selection>, "selected" | "setSelected">,
     Partial<Omit<NavigationHookResult, "listProps">>,
     Omit<DragHookResult, "isDragging" | "isScrolling"> {
   keyboardNavigation: RefObject<boolean>;
diff --git a/vuu-ui/packages/vuu-utils/src/component-registry.ts b/vuu-ui/packages/vuu-utils/src/component-registry.ts
index c49f83d1b..388bf41e0 100644
--- a/vuu-ui/packages/vuu-utils/src/component-registry.ts
+++ b/vuu-ui/packages/vuu-utils/src/component-registry.ts
@@ -33,7 +33,7 @@ type CellRendererOptions = {
   [key: string]: unknown;
   description?: string;
   label?: string;
-  serverDataType?: VuuColumnDataType | VuuColumnDataType[] | "private";
+  serverDataType?: VuuColumnDataType | VuuColumnDataType[] | "json" | "private";
 };
 
 export interface CellRendererDescriptor extends CellRendererOptions {
@@ -41,8 +41,13 @@ export interface CellRendererDescriptor extends CellRendererOptions {
 }
 
 const isTypeCompatible = (
-  rendererType: VuuColumnDataType | VuuColumnDataType[] | "private" | undefined,
-  serverDataType: VuuColumnDataType
+  rendererType:
+    | VuuColumnDataType
+    | (VuuColumnDataType | "json")[]
+    | "json"
+    | "private"
+    | undefined,
+  serverDataType: VuuColumnDataType | "json"
 ) => {
   if (rendererType === undefined || rendererType === "private") {
     return true;
@@ -92,7 +97,7 @@ export function registerComponent<
 }
 
 export const getRegisteredCellRenderers = (
-  serverDataType?: VuuColumnDataType
+  serverDataType?: VuuColumnDataType | "json"
 ): CellRendererDescriptor[] => {
   const rendererNames = Array.from(cellRenderersMap.keys());
   const allRenderers = rendererNames.map<CellRendererDescriptor>((name) => ({