Sync mains (pull) (#106)

* finos#900 disable failing test * Update check on viewport and context menu (finos#913) * remove reprecated Portal, fixes in COntextMenu * use woff2 font, fix portal * make sure ContextMenu always has theme attributes * type fixes * Tidy package and type issues (finos#914) * fix package references, type issues * add typescript config for correct auto import resolution * Layout Management (finos#916) * fix vuu-filters types * drawer and dialog fix * drag drop flexbox editable * Update vuu-ui/packages/vuu-filters/src/filter-utils.ts Whitespace between guard clauses Co-authored-by: Luke Vincent <[email protected]> * layout header * restore double quotes * layout-provider * layout-reducer * layout-view * palette * palette * placeholder * layout-view decomment * registry * rollback multi filter dropdown * stack * tabs * config wrapper * tools * utils * layout top level * revert flexbox layout change * restore lost semicolon * missing space * change action to a type union * Update README.md * Sync with Finos main * VUU-41 style fixes * VUU-41 rename css variable to --vuu * Manage layout persistence via interface (#55) * VUU-27 interface to return promises * VUU-47 add methods for loading and saving tempLayout * VUU-47 use loadLayoutById in LayoutList * VUU-47 remove unused files * VUU-47 update other examples to use new hook * Calculated column (finos#882) * calculated column in settings, instrument search * additional mock data sources * instrument tiles * calculated column editing * measured-container * Row used columnMap rathe than column key * full keyboard nav for table * fix drag drop in column group headerr * use MeasuredContainer for Table List * table cell editing updates datasource * table editing * fix type issues * fix old background renderer * remove outdated import in showcase story * exclude PatternValidator from semgrep * add vuu tooltip component (finos#885) * VUU-47 improve naming * VUU-47 use placeholder in defaultLayout * VUU-47 update docs with new naming * remove duplicate CSS * VUU-47 fix layoutList styling * VUU-47 add loaded layouts to layout view * VUU-47 rename currentLayout to applicationLayout * VUU-47 make defaultLayout closeable and update features * VUU-27 interface to return promises * VUU-54: Validate IDs in LocalLayoutPersistenceManager * VUU-54: Mock get/saveLocalEntity * VUU-54: Refactor promises * VUU-54: Remove unnecessary asyncs * VUU-54: Use string union to distinguish layouts/metadata * VUU-54: Rename variables * VUU-54: Convert layout types to interfaces * VUU-54: Extract loadAndFilter method * VUU-54: Replace filter with find * VUU-54: Rename validateId variables * VUU-54: Change vars to lets * VUU-54: Update imports for consistency * VUU-54: Add comment to explain filter(Boolean) * VUU-54: Refactor tests * VUU-54: Extract expectError * VUU-54: Remove loadAndFilter method * VUU-54: Remove removeEntry method * VUU-52: Add E2E tests to CI * VUU-52: Use commit hash for cypress-io * VUU-52: Add comment to explain full SHA * VUU-47 rename imports * VUU-59 set up notification context * VUU-47 fix cypress test * Update vuu-ui/packages/vuu-layout/src/layout-persistence/LayoutPersistenceManager.ts Co-authored-by: Cara <[email protected]> * VUU-47 remove unused import * VUU-59 notifications with animation * VUU-59 revert changes to imports * VUU-59 change toast timeout * VUU-59 change notificationType to enum * VUU-59 improvements to example and add comments --------- Co-authored-by: harryhartley <[email protected]> Co-authored-by: Luke Vincent <[email protected]> Co-authored-by: Joe Dunleavy <[email protected]> Co-authored-by: Joe Dunleavy <[email protected]> Co-authored-by: cfisher-scottlogic <[email protected]> Co-authored-by: Cara <[email protected]> Co-authored-by: Peter Ling <[email protected]> Co-authored-by: pling-scottlogic <[email protected]> Co-authored-by: heswell <[email protected]> * add Layout Management Provider to sample apps (finos#917) * add Layout Management Provider to sample apps * fix test dependencies * Drag drop provider (finos#918) * add DragDrop example, resume drag in DragProvider * full flow for remote drag * fix type issues * fix post rebase conflicts, type issues * ignore type issue in drag drop code for now, so packages build * Filterbar styling (finos#919) * improve the keyboards navigation in Toolbar * fix form control styling, uennecessaryb layout rerenders, table resize bug * make sure all table config setting changes are saved, style tweaks * calculated columns * fix dropdown width * fix width of combo in SaveLayout Panel * remove console.log * fix bug in OverflowContainer when orientation vertical * remove global error listener, leave this to cypress * move test schemas out of showcase (finos#920) * Update dependency electron to v22 [SECURITY] (finos#894) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> * bump vite, vitest versions to latest (finos#921) * Instrument picker (finos#923) * make instrument-picker more generic * refactor Table navigation, preparing for row highlighting * fix broken import paths * add empty inlined worker as vitext mocj fails otherwise * reinstate ignore for inlined-wotker so stub file doesn't get overwritten (finos#924) * disable basket functionality in showcase while we wait for full server (finos#925) * disable basket functionality in showcase while we wait for server implementation * remove console log * fix styling of main tabs during drag (finos#929) * wiring together calculated column pieces (finos#931) * wiring together calculated column pieces * remove logging * re-enable all tests * fix FilterTable resize bug (finos#932) * move table height fix to measured container (finos#933) * type fixes (finos#934) * final styling for calculated column input (finos#935) * connect filterbar to persistence (finos#936) * connect filterbar to persistence * skip test for missing TreeWalker finctionality until its there * final adjustments to table column header styling (finos#937) * move date generators to test data package (finos#938) * Bump postcss from 8.4.27 to 8.4.31 in /vuu-ui (finos#926) Bumps [postcss](https://github.com/postcss/postcss) from 8.4.27 to 8.4.31. - [Release notes](https://github.com/postcss/postcss/releases) - [Changelog](https://github.com/postcss/postcss/blob/main/CHANGELOG.md) - [Commits](postcss/postcss@8.4.27...8.4.31) --- updated-dependencies: - dependency-name: postcss dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * finos#850 added for functionality to the rpc service, not ready for the big time yet, but not far off. * finos#850 added ability to reference tables in separate modules. * finos#850 refactored simul module to take prices out to prices module * finos#850 refactored tableDefContainer to make it an implicit, otherwise it is re-used in the tests causing issues. * finos#850 found a bug with basket constituents, not resolved as of this commit. * finos#850 found a bug with basket constituents, not resolved as of this commit. * Update basket tables UI (finos#940) * update all basket tables, integrate basket server changes * filter basket tables when loading * connect cell editing * remove console log * fix newFeature story * remove console log * fix for dropdown width error * remove console.log * basket workflow (finos#941) * Login panel (finos#942) * login panel * WIP * tidy up type issues etc * import fixes * remove deprecated example * finos#944 Added fix for threading related issue in ViewPortContainer.scala when change was called. * finos#944 Reduced logging * Switch UI to new Theme (finos#943) * remove sample app * rename basket trading app to sample-app * fix broken inmports * fix bugs persistning table settings * 862 create a basketdesign table that represents the specific instance of a basket that we are modifying it will be based on a basket entry but can be customized to what the user needs (finos#948) * finos#862 Fixed test versions to abstract out clock. * finos#862 Added Viewport scoped rpc service to test. * finos#862 Added ability to edit baskets join service. * Fix minor UI issues (finos#949) * fix UI dataTable issue - bugs after resize A column resize operation populates the ColumnState state value. From this point on columnState shadows modelColumns so subsequent changes to modelColumns are not rendered. * enable custom editors for cell renderers Column Settings Panel allows a custom renderer to be selected. Some renderers will have settings of their own. This enables editors form those settings to be made available. * fix type issue * update baskets used in showcase examples to match server tables (finos#950) * add initial support for columns backed by lookup tables (finos#951) * move basket data generation into simulated vuu module to pave way for rpc support * add updater for prices, insert for array data source * create Table for test data in modules * fix scrolling issue in table when focusing edit fields * add initial support for table columns backed by lookup tables * wire table cell editing to server calls (finos#953) * Schema load sequence (finos#955) * cache table meta requests with promise to avoid multiple server requests * ensure table meta is loaded before client is notified of subcribe table meta for all tables was being requested from server every time any hook asked for the table data. This was happening twice at startup. Now we cache the metadata. If we didn't have table meta at point where CREATE_VP_SUCCESS was handled, we notified client anyway. This caused tables to be rendered with no type information, so alignment was wrong on numerics. * fix all data tests * Merge persistence manager generator approaches * Fix duplicated NavigationStyle export in `TableNext.examples.tsx` --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: keikeicheung <[email protected]> Co-authored-by: heswell <[email protected]> Co-authored-by: Vasco <[email protected]> Co-authored-by: harryhartley <[email protected]> Co-authored-by: Luke Vincent <[email protected]> Co-authored-by: Joe Dunleavy <[email protected]> Co-authored-by: Joe Dunleavy <[email protected]> Co-authored-by: Peter Ling <[email protected]> Co-authored-by: pling-scottlogic <[email protected]> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: chris <[email protected]> Co-authored-by: chrisjstevo <[email protected]>
ScottLogic · Nov 13, 2023 · c3bfd03 · c3bfd03
1 parent 63f8f47
commit c3bfd03
Show file tree

Hide file tree

Showing 279 changed files with 9,140 additions and 5,843 deletions.
diff --git a/.gitignore b/.gitignore
@@ -34,3 +34,4 @@ website/package-lock.json
 
 # Generated docs
 docs/contributing.md
+vuu-ui/packages/vuu-data/src/inlined-worker.js
diff --git a/docs/rpc/Viewport_rpc.md b/docs/rpc/Viewport_rpc.md
@@ -0,0 +1,11 @@
+import { SvgDottySeparator } from "@site/src/components/SvgDottySeparator";
+
+# RPC Calls
+
+<SvgDottySeparator style={{marginBottom: 32}}/>
+
+## Viewport RPC
+
+```scala
+In Progress
+```
diff --git a/docs/rpc/rpc.md b/docs/rpc/rpc.md
@@ -4,20 +4,34 @@ import { SvgDottySeparator } from "@site/src/components/SvgDottySeparator";
 
 <SvgDottySeparator style={{marginBottom: 32}}/>
 
-## Menus
+## Overview of RPC
+
+There are two scopes where rpc services can be defined:
+
+- Global Scope - these are services that can be called without a viewport being created.
+- Viewport Scope - these are services that are created when a user creates a viewport
+
+## Global Scope - RPC Services
+
+[RPC Services](service.md) allow us to expose server-side functionality to a Vuu client over a low-latency web-socket connection.
+
+The Vuu client framework can discover and programmatically call these services over the WebSocket. While there is no generic UI for invoking/inspecting REST services, many components (such as the Autocomplete Search) use services as an implementation mechanism.
+
+## Global Scope - REST Services
+
+REST Services allow us to expose server-side functionality to a Vuu client. Each service is modeled in REST-ful resource fashion, and can define the following standard verbs: `get_all`, `get`, `post`, `put`, `delete`
+
+## Viewport Scope - Menu Items
 
 [Menu Items](Menu_items.md) act upon a `table`, `selection`, `row` or `cell` (these are called `scope`).
 
 Once a `menu item` is registered by a server side [`provider`](../providers_tables_viewports/providers.md), it will be automatically displayed when user right-clicks on the corresponding Vuu Grid component.
 
 Menu items may have filter expressions (applied for each individual row) that determine for which rows they are visible. If a menu item is visible, it can be invoked. On invocation, depending on the `scope` the RPC handler will receive context information about what are we acting upon.
 
-## RPC Services
-
-[RPC Services](service.md) allow us to expose server-side functionality to a Vuu client over a low-latency connection.
-
-The Vuu client framework can discover and programmatically call these services over the WebSocket. While there is no generic UI for invoking/inspecting REST services, many components (such as the Autocomplete Search) use REST services as an implementation mechanism.
+## Viewport Scope - RPC Calls
 
-## REST Services
+[Viewport RPC](Viewport_rpc.md) calls are specific service methods that we want to call on a viewport we've created. They are specific i.e. the UI component needs
+to understand the type of call that is being called. In that way they should be used in functionally specific UI components.
 
-[REST Services](#) allow us to expose server-side functionality to a Vuu client. Each service is modeled in REST-ful resource fashion, and can define the following standard verbs: `get_all`, `get`, `post`, `put`, `delete`
+They implicitly have access to the viewport and its associated tables that they are being called on.
diff --git a/vuu-ui/.gitignore b/vuu-ui/.gitignore
diff --git a/vuu-ui/package-lock.json b/vuu-ui/package-lock.json
diff --git a/vuu-ui/package.json b/vuu-ui/package.json
@@ -19,12 +19,10 @@
     "format": "prettier --write './**/*.{js,,mjs,jsx,css,md,json}' --config ./.prettierrc",
     "build": "node ./scripts/build-all.mjs",
     "build:app": "cd sample-apps/app-vuu-example && node scripts/build.mjs",
-    "build:app:basket": "cd sample-apps/app-vuu-basket-trader && node scripts/build.mjs",
     "build:packages": "npm run build -- --cjs --license && npm run type-defs",
     "build:packages:debug": "npm run build -- --cjs --debug && npm run type-defs -- --debug",
     "build:salt": "node ./scripts/build-salt.mjs",
     "launch:demo": "node ./scripts/launch-app.mjs",
-    "launch:demo:basket": "node ./scripts/launch-app.mjs -- --basket",
     "launch:demo:electron": "cd tools/electron && node ./node_modules/.bin/electron .",
     "launch:showcase": " cd showcase && node scripts/launch.mjs",
     "deploy:websocket-test": "node ./tools/deploy-websocket-test.mjs",

diff --git a/vuu-ui/packages/vuu-data-ag-grid/src/ViewportRowModelDataSource.ts b/vuu-ui/packages/vuu-data-ag-grid/src/ViewportRowModelDataSource.ts
@@ -1,10 +1,10 @@
 import {
   DataSource,
   DataSourceConfig,
+  isVuuFeatureAction,
   SubscribeCallback,
   VuuFeatureMessage,
 } from "@finos/vuu-data";
-import { isVuuFeatureAction } from "@finos/vuu-data-react";
 import { Filter } from "@finos/vuu-filter-types";
 import { VuuGroupBy, VuuSort } from "@finos/vuu-protocol-types";
 import {

diff --git a/vuu-ui/packages/vuu-data-ag-grid/src/useViewportRowModel.ts b/vuu-ui/packages/vuu-data-ag-grid/src/useViewportRowModel.ts
@@ -1,5 +1,7 @@
 import {
   DataSourceConfig,
+  isViewportMenusAction,
+  isVisualLinksAction,
   MenuRpcResponse,
   RemoteDataSource,
   VuuFeatureMessage,
@@ -8,8 +10,6 @@ import {
 } from "@finos/vuu-data";
 
 import {
-  isViewportMenusAction,
-  isVisualLinksAction,
   MenuActionConfig,
   SuggestionFetcher,
   useTypeaheadSuggestions,

diff --git a/vuu-ui/packages/vuu-data-react/src/hooks/index.ts b/vuu-ui/packages/vuu-data-react/src/hooks/index.ts
@@ -1,4 +1,5 @@
 export * from "./useDataSource";
+export * from "./useLookupValues";
 export * from "./useServerConnectionStatus";
 export * from "./useServerConnectionQuality";
 export * from "./useTypeaheadSuggestions";

diff --git a/vuu-ui/packages/vuu-data-react/src/hooks/useLookupValues.ts b/vuu-ui/packages/vuu-data-react/src/hooks/useLookupValues.ts
@@ -0,0 +1,119 @@
+import {
+  ColumnDescriptor,
+  ListOption,
+  LookupTableDetails,
+} from "@finos/vuu-datagrid-types";
+import { RemoteDataSource } from "@finos/vuu-data";
+import { useShellContext } from "@finos/vuu-shell";
+import {
+  buildColumnMap,
+  isLookupRenderer,
+  isTypeDescriptor,
+} from "@finos/vuu-utils";
+import { useMemo, useState } from "react";
+
+const NO_VALUES: ListOption[] = [];
+
+const lookupValueMap = new Map<string, Promise<ListOption[]>>();
+
+const loadLookupValues = ({
+  labelColumn,
+  table,
+  valueColumn,
+}: LookupTableDetails): Promise<ListOption[]> => {
+  const tableKey = `${table.module}:${table.table}`;
+  const lookupValues = lookupValueMap.get(tableKey);
+  if (lookupValues) {
+    return lookupValues;
+  } else {
+    const promise: Promise<ListOption[]> = new Promise((resolve) => {
+      const columns = [valueColumn, labelColumn];
+      const columnMap = buildColumnMap(columns);
+      const dataSource = new RemoteDataSource({
+        bufferSize: 0,
+        table,
+      });
+      dataSource.subscribe(
+        {
+          columns,
+          range: { from: 0, to: 100 },
+        },
+        (message) => {
+          if (message.type === "viewport-update") {
+            //TODO check we have full dataset
+            if (message.rows) {
+              const listOptions = message.rows.map<ListOption>((row) => ({
+                value: row[columnMap[valueColumn]] as string | number,
+                label: row[columnMap[labelColumn]] as string,
+              }));
+              resolve(listOptions);
+              dataSource.unsubscribe();
+            }
+          }
+        }
+      );
+    });
+    lookupValueMap.set(tableKey, promise);
+    return promise;
+  }
+};
+
+type LookupState = {
+  initialValue: ListOption | null;
+  values: ListOption[];
+};
+
+const getSelectedOption = (
+  values: ListOption[],
+  selectedValue: string | number | undefined
+) => {
+  if (selectedValue === undefined) {
+    return null;
+  }
+  return values.find((option) => option.value === selectedValue) ?? null;
+};
+
+const getLookupDetails = ({ name, type }: ColumnDescriptor) => {
+  if (isTypeDescriptor(type) && isLookupRenderer(type.renderer)) {
+    return type.renderer.lookup;
+  } else {
+    throw Error(
+      `useLookupValues column ${name} is not configured to use lookup values`
+    );
+  }
+};
+
+export const useLookupValues = (
+  column: ColumnDescriptor,
+  initialValueProp: number | string
+) => {
+  const lookupDetails = getLookupDetails(column);
+  const { getLookupValues } = useShellContext();
+
+  const initialState = useMemo<LookupState>(() => {
+    const values = getLookupValues?.(lookupDetails.table) ?? NO_VALUES;
+    return {
+      initialValue: getSelectedOption(values, initialValueProp),
+      values,
+    };
+  }, [getLookupValues, initialValueProp, lookupDetails.table]);
+
+  const [{ initialValue, values }, setLookupState] =
+    useState<LookupState>(initialState);
+
+  useMemo(() => {
+    if (values === NO_VALUES) {
+      loadLookupValues(lookupDetails).then((values) =>
+        setLookupState({
+          initialValue: getSelectedOption(values, initialValueProp),
+          values,
+        })
+      );
+    }
+  }, [values, lookupDetails, initialValueProp]);
+
+  return {
+    initialValue,
+    values,
+  };
+};
diff --git a/vuu-ui/packages/vuu-data-react/src/hooks/useVuuMenuActions.ts b/vuu-ui/packages/vuu-data-react/src/hooks/useVuuMenuActions.ts
@@ -53,34 +53,6 @@ const { KEY } = metadataKeys;
 
 const NO_CONFIG: MenuActionConfig = {};
 
-export const isVisualLinksAction = (
-  action: GridAction
-): action is DataSourceVisualLinksMessage => action.type === "vuu-links";
-
-export const isVisualLinkCreatedAction = (
-  action: GridAction
-): action is DataSourceVisualLinkCreatedMessage =>
-  action.type === "vuu-link-created";
-
-export const isVisualLinkRemovedAction = (
-  action: GridAction
-): action is DataSourceVisualLinkRemovedMessage =>
-  action.type === "vuu-link-removed";
-
-export const isViewportMenusAction = (
-  action: GridAction
-): action is DataSourceMenusMessage => action.type === "vuu-menu";
-
-export const isVuuFeatureAction = (
-  action: GridAction
-): action is VuuFeatureMessage =>
-  isViewportMenusAction(action) || isVisualLinksAction(action);
-
-export const isVuuFeatureInvocation = (
-  action: GridAction
-): action is VuuFeatureInvocationMessage =>
-  action.type === "vuu-link-created" || action.type === "vuu-link-removed";
-
 const isMenuItem = (menu: VuuMenuItem | VuuMenu): menu is VuuMenuItem =>
   "rpcName" in menu;
 
@@ -318,11 +290,12 @@ export const useVuuMenuActions = ({
 }: VuuMenuActionHookProps): ViewServerHookResult => {
   const buildViewserverMenuOptions: MenuBuilder = useCallback(
     (location, options) => {
-      const { visualLink, visualLinks, vuuMenu } = menuActionConfig;
+      const { links, menu } = dataSource;
+      const { visualLink } = menuActionConfig;
       const descriptors: ContextMenuItemDescriptor[] = [];
 
-      if (location === "grid" && visualLinks && !visualLink) {
-        visualLinks.forEach((linkDescriptor: LinkDescriptorWithLabel) => {
+      if (location === "grid" && links && !visualLink) {
+        links.forEach((linkDescriptor: LinkDescriptorWithLabel) => {
           const { link, label: linkLabel } = linkDescriptor;
           const label = linkLabel ? linkLabel : link.toTable;
           descriptors.push({
@@ -333,13 +306,13 @@ export const useVuuMenuActions = ({
         });
       }
 
-      if (vuuMenu && isTableLocation(location)) {
+      if (menu && isTableLocation(location)) {
         const menuDescriptor = buildMenuDescriptor(
-          vuuMenu,
+          menu,
           location,
           options as VuuServerMenuOptions
         );
-        if (isRoot(vuuMenu) && isGroupMenuItemDescriptor(menuDescriptor)) {
+        if (isRoot(menu) && isGroupMenuItemDescriptor(menuDescriptor)) {
           descriptors.push(...menuDescriptor.children);
         } else if (menuDescriptor) {
           descriptors.push(menuDescriptor);
@@ -348,7 +321,7 @@ export const useVuuMenuActions = ({
 
       return descriptors;
     },
-    [menuActionConfig]
+    [dataSource, menuActionConfig]
   );
 
   const handleMenuAction = useCallback(

diff --git a/vuu-ui/packages/vuu-data-react/src/hooks/useVuuTables.ts b/vuu-ui/packages/vuu-data-react/src/hooks/useVuuTables.ts
@@ -18,9 +18,7 @@ export const useVuuTables = () => {
       const { tables } = await server.getTableList();
       const tableSchemas = buildTables(
         await Promise.all(
-          tables.map((tableDescriptor) =>
-            server.getTableSchema(tableDescriptor)
-          )
+          tables.map((vuuTable) => server.getTableSchema(vuuTable))
         )
       );
       setTables(tableSchemas);
Original file line number	Diff line number	Diff line change
Expand Up		@@ -34,3 +34,4 @@ website/package-lock.json

		# Generated docs
		docs/contributing.md
		vuu-ui/packages/vuu-data/src/inlined-worker.js