@finos/legend-cube-builder 0.0.2 → 0.0.4

package/src/components/editors/CubeIngestSourceEditor.tsx

@@ -0,0 +1,104 @@
+/**
+ * Copyright (c) 2026-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { IngestDatasetSource } from '@finos/legend-cube';
+import { PanelLoadingIndicator } from '@finos/legend-art';
+import { guaranteeType } from '@finos/legend-shared';
+import { flowResult } from 'mobx';
+import { observer } from 'mobx-react-lite';
+import { CUBE_DATA_PRODUCT_ENVIRONMENT_LABELS } from '../../__lib__/LegendCubeDataProductLabels.js';
+import { CUBE_PENDING_LABEL } from '../../__lib__/LegendCubeLabels.js';
+import { getCubeIngestSettings } from '../../graph-manager/CubeIngest.js';
+import { CubeButton } from '../CubeButton.js';
+import { CubeSchemaColumnsTable } from '../CubeSchemaColumnsTable.js';
+import type { CubeNodeEditorProps } from './CubeNodeEditorRegistry.js';
+import { CubeWarehouseControl } from './CubeWarehouseControl.js';
+
+/**
+ * An ingest data set (PLAN §6.7): where it reads from, the cube's class,
+ * producer deployment and warehouse, which can be edited, its columns as
+ * its deployed definition declares them, and Refresh, which reads the
+ * definition again
+ */
+export const CubeIngestSourceEditor = observer((props: CubeNodeEditorProps) => {
+  const { editorState, readOnly } = props;
+  const source = guaranteeType(props.draft.original, IngestDatasetSource);
+  const { resolution } = source;
+  const refreshing = editorState.isPendingSource(source);
+  const model = editorState.document.context?.model;
+  const settings = model ? getCubeIngestSettings(model) : undefined;
+  return (
+    <div className="relative flex flex-col gap-2">
+      <dl className="grid grid-cols-[max-content_1fr] gap-x-3 gap-y-1 text-base">
+        <dt className="text-[var(--color-text-secondary)]">Definition</dt>
+        <dd className="min-w-0 break-all" title={source.ingestDefinitionUrn}>
+          {source.ingestDefinition}
+        </dd>
+        <dt className="text-[var(--color-text-secondary)]">Data set</dt>
+        <dd className="min-w-0 break-all">{source.dataSet}</dd>
+        {settings && (
+          <>
+            <dt className="text-[var(--color-text-secondary)]">Environment</dt>
+            <dd className="min-w-0 break-all">
+              {CUBE_DATA_PRODUCT_ENVIRONMENT_LABELS[settings.environmentType]}
+            </dd>
+            <dt className="text-[var(--color-text-secondary)]">Producer</dt>
+            <dd className="min-w-0 break-all">
+              {`Deployment ${settings.producerDeploymentId}`}
+            </dd>
+            <dt className="self-center text-[var(--color-text-secondary)]">
+              Warehouse
+            </dt>
+            <dd className="min-w-0">
+              <CubeWarehouseControl
+                runtime={editorState.dataProductRuntime}
+                readOnly={readOnly}
+              />
+            </dd>
+          </>
+        )}
+      </dl>
+      <div className="flex items-center gap-2">
+        <CubeButton
+          title="Read the data set's columns again from the deployed ingest definition"
+          disabled={refreshing}
+          onClick={() => {
+            flowResult(editorState.refreshSource(source.id)).catch(
+              editorState.host.applicationStore.alertUnhandledError,
+            );
+          }}
+        >
+          Refresh
+        </CubeButton>
+        {refreshing && (
+          <span className="text-base text-[var(--color-text-secondary)]">
+            {CUBE_PENDING_LABEL.REFRESHING_SOURCE}
+          </span>
+        )}
+      </div>
+      <PanelLoadingIndicator isLoading={refreshing} />
+      {resolution.kind === 'resolved' ? (
+        <CubeSchemaColumnsTable schema={resolution.schema} />
+      ) : (
+        <div className="text-base text-[var(--color-text-secondary)]">
+          {resolution.kind === 'failed'
+            ? resolution.message
+            : 'The data set has not been typed yet.'}
+        </div>
+      )}
+    </div>
+  );
+});

package/src/components/editors/CubeIntegerField.tsx

@@ -0,0 +1,51 @@
+/**
+ * Copyright (c) 2026-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { clsx } from '@finos/legend-art';
+
+/**
+ * A field for a whole number, such as a size or a row index. It shows the
+ * text as typed and reports every keystroke, so the panel checks the edited
+ * node as the user types. Enter and Escape do nothing special: Apply is the
+ * panel's, and Ctrl+Z is the field's own undo.
+ */
+export const CubeIntegerField: React.FC<{
+  label: string;
+  text: string;
+  invalid: boolean;
+  disabled: boolean;
+  onChange: (text: string) => void;
+}> = (props) => {
+  const { label, text, invalid, disabled, onChange } = props;
+  return (
+    <input
+      aria-label={label}
+      aria-invalid={invalid}
+      className={clsx(
+        'h-6 w-24 rounded-sm border bg-[var(--color-bg-input)] px-1 text-base',
+        invalid
+          ? 'border-[var(--color-status-error)] text-[var(--color-status-error)]'
+          : 'border-[var(--color-border-default)]',
+      )}
+      type="text"
+      inputMode="numeric"
+      spellCheck={false}
+      value={text}
+      disabled={disabled}
+      onChange={(event) => onChange(event.target.value)}
+    />
+  );
+};

package/src/components/editors/CubeJoinEditor.tsx

@@ -14,113 +14,27 @@
  * limitations under the License.
  */
 
-import { TimesIcon } from '@finos/legend-art';
 import {
-  areCompatibleTypes,
   getDuplicateJoinColumns,
   isJoinType,
   JOIN_TYPE_LABELS,
   JOIN_TYPES,
+  planJoinDuplicateFix,
   type Schema,
 } from '@finos/legend-cube';
 import { guaranteeType, noop } from '@finos/legend-shared';
 import { flowResult } from 'mobx';
 import { observer } from 'mobx-react-lite';
 import { useEffect } from 'react';
-import { CUBE_TABLE_FLAG_LABELS } from '../../__lib__/LegendCubeLabels.js';
-import { CubeTableFlag } from '../../graph-manager/CubeEngine.js';
-import {
-  type CubeJoinKeyPair,
-  CubeJoinDraft,
-  isUntypedColumn,
-} from '../../stores/editors/CubeJoinDraft.js';
+import { READ_ONLY_CUBE_TITLE } from '../../__lib__/LegendCubeLabels.js';
+import { CubeJoinDraft } from '../../stores/editors/CubeJoinDraft.js';
 import { CubeButton } from '../CubeButton.js';
-import { CubeColumnPicker } from './CubeColumnPicker.js';
+import { CubeJoinKeyRows } from './CubeJoinKeyRows.js';
 import type { CubeNodeEditorProps } from './CubeNodeEditorRegistry.js';
 
-const TYPE_UNKNOWN = CUBE_TABLE_FLAG_LABELS[CubeTableFlag.TYPE_UNKNOWN];
-
-const CubeJoinKeyRow = observer(
-  (props: {
-    editorProps: CubeNodeEditorProps;
-    draft: CubeJoinDraft;
-    pair: CubeJoinKeyPair;
-    index: number;
-    leftSchema: Schema;
-    rightSchema: Schema;
-  }) => {
-    const { editorProps, draft, pair, index, leftSchema, rightSchema } = props;
-    const { editorState, readOnly } = editorProps;
-    const { query } = editorState.document;
-    const { analysis, modelOutline } = editorState;
-    const [leftId, rightId] = query.getInputIds(draft.original.id);
-    const leftType = leftSchema.type(pair.left);
-    const rightType = rightSchema.type(pair.right);
-    const isIncompatible =
-      leftType !== undefined &&
-      rightType !== undefined &&
-      !areCompatibleTypes(leftType, rightType);
-    const isUntyped =
-      (leftId !== undefined &&
-        Boolean(pair.left) &&
-        isUntypedColumn(modelOutline, query, analysis, leftId, pair.left)) ||
-      (rightId !== undefined &&
-        Boolean(pair.right) &&
-        isUntypedColumn(modelOutline, query, analysis, rightId, pair.right));
-    const position = index + 1;
-    return (
-      <li className="flex flex-col gap-1 border-b border-[var(--color-border-subtle)] py-1">
-        <div className="grid grid-cols-[1fr_auto_1fr_auto] items-center gap-1">
-          <CubeColumnPicker
-            label={`Left join column ${position}`}
-            schema={leftSchema}
-            value={pair.left}
-            invalid={isIncompatible}
-            disabled={readOnly}
-            onChange={(name) => draft.setLeftColumn(pair.key, name)}
-          />
-          <span className="text-[var(--color-text-secondary)]">=</span>
-          <CubeColumnPicker
-            label={`Right join column ${position}`}
-            schema={rightSchema}
-            value={pair.right}
-            invalid={isIncompatible}
-            disabled={readOnly}
-            onChange={(name) => draft.setRightColumn(pair.key, name)}
-          />
-          <button
-            className="flex h-6 w-6 items-center justify-center text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] disabled:text-[var(--color-text-disabled)]"
-            aria-label={`Remove join columns ${position}`}
-            title="Remove these join columns"
-            disabled={readOnly}
-            onClick={() => draft.removePair(pair.key)}
-          >
-            <TimesIcon />
-          </button>
-        </div>
-        {isIncompatible && (
-          <div className="text-sm text-[var(--color-status-error)]">
-            {`${leftType.displayName} and ${rightType.displayName} can't be compared`}
-          </div>
-        )}
-        {isUntyped && (
-          <div
-            className="text-sm text-[var(--color-status-warn)]"
-            title={TYPE_UNKNOWN.description}
-          >
-            {`${TYPE_UNKNOWN.label}: the column's real type is not known to Cube, so the engine may not match its values`}
-          </div>
-        )}
-      </li>
-    );
-  },
-);
-
 /**
- * The Join editor (spec §17.6): the join type, pairs of key columns, a left
- * one from the Left input and a right one from the Right input, and Swap
- * Inputs. A pair whose types can't be compared is marked; one on a column
- * Cube can't type is warned about, not blocked.
+ * The Join editor (spec §17.6): the join type, pairs of key columns
+ * (`CubeJoinKeyRows`), and Swap Inputs.
  */
 export const CubeJoinEditor = observer((props: CubeNodeEditorProps) => {
   const { editorState, inputSchemas, readOnly } = props;
@@ -137,10 +51,10 @@ export const CubeJoinEditor = observer((props: CubeNodeEditorProps) => {
     edited.leftColumns,
     edited.rightColumns,
   );
-  const canAddPair =
-    !readOnly &&
-    draft.pairs.length <
-      Math.min(leftSchema.columns.length, rightSchema.columns.length);
+  // the names the autofix would give, to show beside each shared column
+  const fix = duplicates.length
+    ? planJoinDuplicateFix(edited, leftSchema, rightSchema)
+    : undefined;
   return (
     <div className="flex flex-col gap-2 text-base">
       <div className="flex items-center gap-2">
@@ -172,38 +86,12 @@ export const CubeJoinEditor = observer((props: CubeNodeEditorProps) => {
           Swap Inputs
         </CubeButton>
       </div>
-      <div className="grid grid-cols-[1fr_auto_1fr_auto] gap-1 text-sm text-[var(--color-text-secondary)]">
-        <span>Left</span>
-        <span />
-        <span>Right</span>
-        <span />
-      </div>
-      <ul aria-label="Join columns">
-        {draft.pairs.map((pair, index) => (
-          <CubeJoinKeyRow
-            key={pair.key}
-            editorProps={props}
-            draft={draft}
-            pair={pair}
-            index={index}
-            leftSchema={leftSchema}
-            rightSchema={rightSchema}
-          />
-        ))}
-      </ul>
-      <div>
-        <CubeButton
-          title={
-            canAddPair
-              ? 'Add a pair of join columns'
-              : 'Every column of an input is already a join column'
-          }
-          disabled={!canAddPair}
-          onClick={() => draft.addPair()}
-        >
-          Add join columns
-        </CubeButton>
-      </div>
+      <CubeJoinKeyRows
+        editorProps={props}
+        draft={draft}
+        leftSchema={leftSchema}
+        rightSchema={rightSchema}
+      />
       {duplicates.length > 0 && (
         <div className="text-sm text-[var(--color-status-warn)]">
           <div>
@@ -211,12 +99,27 @@ export const CubeJoinEditor = observer((props: CubeNodeEditorProps) => {
             both:
           </div>
           <ul aria-label="Columns in both inputs">
-            {duplicates.map((name) => (
-              <li key={name} className="font-mono">
-                {name}
+            {duplicates.map((name, index) => (
+              <li key={name} className="break-all font-mono">
+                {fix
+                  ? `${name} → ${fix.left[index]?.to} (Left), ${fix.right[index]?.to} (Right)`
+                  : name}
               </li>
             ))}
           </ul>
+          <div className="mt-1">
+            <CubeButton
+              title={
+                readOnly
+                  ? READ_ONLY_CUBE_TITLE
+                  : 'Add a Rename before each input that gives these columns new names. Applies your changes too, as one step to undo.'
+              }
+              disabled={!editorState.nodeEditor.canRenameDuplicateColumns}
+              onClick={() => editorState.nodeEditor.renameDuplicateColumns()}
+            >
+              Rename them
+            </CubeButton>
+          </div>
         </div>
       )}
     </div>

package/src/components/editors/CubeJoinKeyRows.tsx

@@ -0,0 +1,183 @@
+/**
+ * Copyright (c) 2026-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { TimesIcon } from '@finos/legend-art';
+import {
+  areCompatibleTypes,
+  isDateOrTimestampType,
+  type Schema,
+} from '@finos/legend-cube';
+import { observer } from 'mobx-react-lite';
+import {
+  CUBE_TABLE_FLAG_LABELS,
+  DATE_OR_TIMESTAMP_WARNING,
+} from '../../__lib__/LegendCubeLabels.js';
+import { CubeTableFlag } from '../../graph-manager/CubeEngine.js';
+import { isUntypedColumn } from '../../stores/editors/CubeJoinDraft.js';
+import type {
+  CubeJoinKeyPair,
+  CubeJoinKeysDraft,
+} from '../../stores/editors/CubeJoinKeyPairs.js';
+import { CubeButton } from '../CubeButton.js';
+import { CubeColumnPicker } from './CubeColumnPicker.js';
+import type { CubeNodeEditorProps } from './CubeNodeEditorRegistry.js';
+
+const TYPE_UNKNOWN = CUBE_TABLE_FLAG_LABELS[CubeTableFlag.TYPE_UNKNOWN];
+
+const CubeJoinKeyRow = observer(
+  (props: {
+    editorProps: CubeNodeEditorProps;
+    draft: CubeJoinKeysDraft;
+    pair: CubeJoinKeyPair;
+    index: number;
+    leftSchema: Schema;
+    rightSchema: Schema;
+  }) => {
+    const { editorProps, draft, pair, index, leftSchema, rightSchema } = props;
+    const { editorState, readOnly } = editorProps;
+    const { query } = editorState.document;
+    const { analysis, modelOutline } = editorState;
+    const [leftId, rightId] = query.getInputIds(draft.original.id);
+    const leftType = leftSchema.type(pair.left);
+    const rightType = rightSchema.type(pair.right);
+    const isIncompatible =
+      leftType !== undefined &&
+      rightType !== undefined &&
+      !areCompatibleTypes(leftType, rightType);
+    const isUntyped =
+      (leftId !== undefined &&
+        Boolean(pair.left) &&
+        isUntypedColumn(modelOutline, query, analysis, leftId, pair.left)) ||
+      (rightId !== undefined &&
+        Boolean(pair.right) &&
+        isUntypedColumn(modelOutline, query, analysis, rightId, pair.right));
+    // a converted Date (Convert types): its dates match timestamps only at midnight
+    const isDateOrTimestamp =
+      !isIncompatible &&
+      [leftType, rightType].some(
+        (type) => type !== undefined && isDateOrTimestampType(type),
+      );
+    const position = index + 1;
+    return (
+      <li className="flex flex-col gap-1 border-b border-[var(--color-border-subtle)] py-1">
+        <div className="grid grid-cols-[1fr_auto_1fr_auto] items-center gap-1">
+          <CubeColumnPicker
+            label={`Left join column ${position}`}
+            schema={leftSchema}
+            value={pair.left}
+            invalid={isIncompatible}
+            disabled={readOnly}
+            onChange={(name) => draft.setLeftColumn(pair.key, name)}
+          />
+          <span className="text-[var(--color-text-secondary)]">=</span>
+          <CubeColumnPicker
+            label={`Right join column ${position}`}
+            schema={rightSchema}
+            value={pair.right}
+            invalid={isIncompatible}
+            disabled={readOnly}
+            onChange={(name) => draft.setRightColumn(pair.key, name)}
+          />
+          <button
+            className="flex h-6 w-6 items-center justify-center text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] disabled:text-[var(--color-text-disabled)]"
+            aria-label={`Remove join columns ${position}`}
+            title="Remove these join columns"
+            disabled={readOnly}
+            onClick={() => draft.removePair(pair.key)}
+          >
+            <TimesIcon />
+          </button>
+        </div>
+        {isIncompatible && (
+          <div className="text-sm text-[var(--color-status-error)]">
+            {`${leftType.displayName} and ${rightType.displayName} can't be compared`}
+          </div>
+        )}
+        {isDateOrTimestamp && (
+          <div className="text-sm text-[var(--color-status-warn)]">
+            {DATE_OR_TIMESTAMP_WARNING}
+          </div>
+        )}
+        {isUntyped && (
+          <div
+            className="text-sm text-[var(--color-status-warn)]"
+            title={TYPE_UNKNOWN.description}
+          >
+            {`${TYPE_UNKNOWN.label}: the column's real type is not known to Cube, so the engine may not match its values`}
+          </div>
+        )}
+      </li>
+    );
+  },
+);
+
+/**
+ * The pairs of key columns of a node that joins its two inputs (a Join's, spec
+ * §17.6; a Difference's, PLAN §11.7): a left one from the Left input and a
+ * right one from the Right input on each row, and a button that adds a pair.
+ * A pair whose types can't be compared is marked; one on a column Cube can't
+ * type is warned about, not blocked.
+ */
+export const CubeJoinKeyRows = observer(
+  (props: {
+    editorProps: CubeNodeEditorProps;
+    draft: CubeJoinKeysDraft;
+    leftSchema: Schema;
+    rightSchema: Schema;
+  }) => {
+    const { editorProps, draft, leftSchema, rightSchema } = props;
+    const canAddPair =
+      !editorProps.readOnly &&
+      draft.pairs.length <
+        Math.min(leftSchema.columns.length, rightSchema.columns.length);
+    return (
+      <>
+        <div className="grid grid-cols-[1fr_auto_1fr_auto] gap-1 text-sm text-[var(--color-text-secondary)]">
+          <span>Left</span>
+          <span />
+          <span>Right</span>
+          <span />
+        </div>
+        <ul aria-label="Join columns">
+          {draft.pairs.map((pair, index) => (
+            <CubeJoinKeyRow
+              key={pair.key}
+              editorProps={editorProps}
+              draft={draft}
+              pair={pair}
+              index={index}
+              leftSchema={leftSchema}
+              rightSchema={rightSchema}
+            />
+          ))}
+        </ul>
+        <div>
+          <CubeButton
+            title={
+              canAddPair
+                ? 'Add a pair of join columns'
+                : 'Every column of an input is already a join column'
+            }
+            disabled={!canAddPair}
+            onClick={() => draft.addPair()}
+          >
+            Add join columns
+          </CubeButton>
+        </div>
+      </>
+    );
+  },
+);