@finos/legend-application-studio 28.21.42 → 28.21.44

package/lib/components/editor/editor-group/data-editor/RelationElementSampleValuesEditor.js

@@ -0,0 +1,126 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * 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 { observer } from 'mobx-react-lite';
+import { useState } from 'react';
+import { Dialog, LongArrowRightIcon, Modal, ModalBody, ModalFooter, ModalFooterButton, ModalHeader, PencilEditIcon, PlusIcon, Tooltip, } from '@finos/legend-art';
+import { ActionAlertActionType, ActionAlertType, } from '@finos/legend-application';
+import { RelationElementEditor } from './RelationElementsDataEditor.js';
+import { useEditorStore } from '../../EditorStoreProvider.js';
+export const RelationElementSampleValuesEditor = observer((props) => {
+    const { title, relationElementState, isReadOnly, isBusy, hideColumnDefinitions, deleteConfirmMessage, onAdd, onDelete, hasMismatch, mismatchMessage, readOnlySource, } = props;
+    const editorStore = useEditorStore();
+    const [isModalOpen, setIsModalOpen] = useState(false);
+    const isEditMode = Boolean(relationElementState) || Boolean(readOnlySource);
+    const closeModal = () => setIsModalOpen(false);
+    const handleClick = () => {
+        if (isEditMode) {
+            setIsModalOpen(true);
+            return;
+        }
+        Promise.resolve(onAdd())
+            .then(() => setIsModalOpen(true))
+            .catch(editorStore.applicationStore.alertUnhandledError);
+    };
+    const handleDelete = () => {
+        editorStore.applicationStore.alertService.setActionAlertInfo({
+            message: deleteConfirmMessage,
+            type: ActionAlertType.CAUTION,
+            actions: [
+                {
+                    label: 'Confirm',
+                    type: ActionAlertActionType.PROCEED_WITH_CAUTION,
+                    handler: () => {
+                        onDelete();
+                        closeModal();
+                    },
+                },
+                {
+                    label: 'Cancel',
+                    type: ActionAlertActionType.PROCEED,
+                    default: true,
+                },
+            ],
+        });
+    };
+    const buttonStyle = {
+        cursor: isReadOnly ? 'not-allowed' : 'pointer',
+    };
+    if (relationElementState && !readOnlySource) {
+        buttonStyle.border = hasMismatch
+            ? '2px solid var(--color-red-300)'
+            : '1px solid var(--color-blue-200)';
+    }
+    return (_jsxs(_Fragment, { children: [_jsxs("button", { className: "access-point-editor__sample-values-btn", onClick: handleClick, disabled: isReadOnly || isBusy, title: isEditMode ? 'Edit sample values' : 'Add sample values', style: buttonStyle, children: [isEditMode ? _jsx(PencilEditIcon, {}) : _jsx(PlusIcon, {}), _jsx("span", { children: "Sample Values" })] }), isModalOpen && (_jsx(Dialog, { open: isModalOpen, onClose: closeModal, classes: {
+                    root: 'editor-modal__root-container',
+                    container: 'editor-modal__container',
+                    paper: 'editor-modal__content',
+                }, children: _jsxs(Modal, { className: "editor-modal", darkMode: !editorStore.applicationStore.layoutService
+                        .TEMPORARY__isLightColorThemeEnabled, children: [_jsx(ModalHeader, { title: title }), _jsx(ModalBody, { children: _jsx("div", { style: {
+                                    padding: 0,
+                                    height: '100%',
+                                    flex: 1,
+                                    overflowY: 'auto',
+                                    overflowX: 'hidden',
+                                }, children: readOnlySource ? (_jsxs("div", { style: {
+                                        padding: '1.5rem',
+                                        display: 'flex',
+                                        alignItems: 'center',
+                                        justifyContent: 'center',
+                                        gap: '1rem',
+                                    }, children: [_jsx("span", { style: {
+                                                color: 'var(--color-light-grey-200)',
+                                                whiteSpace: 'nowrap',
+                                                fontSize: '1.3rem',
+                                                fontWeight: 600,
+                                            }, children: readOnlySource.message ??
+                                                'Sample Values already in Data Element' }), _jsxs("div", { style: {
+                                                display: 'flex',
+                                                alignItems: 'center',
+                                                gap: '0.5rem',
+                                                padding: '0.5rem 1rem',
+                                                background: 'var(--color-dark-grey-100)',
+                                                border: '1px solid var(--color-dark-grey-300)',
+                                                borderRadius: '0.2rem',
+                                            }, children: [_jsx("span", { style: {
+                                                        fontSize: '1.3rem',
+                                                        fontWeight: 600,
+                                                        color: 'var(--color-light-grey-200)',
+                                                    }, children: readOnlySource.label }), _jsx("button", { className: "btn--sm btn--dark", onClick: readOnlySource.onNavigate, tabIndex: -1, title: "Navigate to data element", style: {
+                                                        padding: '0.3rem 0.5rem',
+                                                        display: 'flex',
+                                                        alignItems: 'center',
+                                                    }, children: _jsx(LongArrowRightIcon, {}) })] })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { style: {
+                                                color: 'var(--color-orange-200)',
+                                                fontWeight: 'bold',
+                                                fontSize: '14px',
+                                                padding: '0.5rem',
+                                                marginBottom: '1rem',
+                                                textAlign: 'center',
+                                                backgroundColor: 'var(--color-orange-50)',
+                                                border: '2px solid var(--color-orange-200)',
+                                                borderRadius: '4px',
+                                            }, children: "DO NOT ADD SENSITIVE DATA" }), relationElementState && (_jsx(Tooltip, { title: mismatchMessage ?? '', arrow: true, placement: "top", disableHoverListener: !hasMismatch, children: _jsx("div", { style: {
+                                                    border: hasMismatch
+                                                        ? '2px solid var(--color-red-300)'
+                                                        : 'none',
+                                                    borderRadius: '4px',
+                                                    padding: hasMismatch ? '0.5rem' : '0',
+                                                }, children: _jsx(RelationElementEditor, { relationElementState: relationElementState, isReadOnly: isReadOnly, ...(hideColumnDefinitions !== undefined
+                                                        ? { hideColumnDefinitions }
+                                                        : {}) }) }) }))] })) }) }), _jsxs(ModalFooter, { children: [!readOnlySource && (_jsx(ModalFooterButton, { title: "Delete sample values", onClick: handleDelete, text: "Delete", type: "secondary", disabled: isReadOnly })), _jsx(ModalFooterButton, { title: "Close sample values editor", onClick: closeModal, text: "Close", type: "secondary" })] })] }) }))] }));
+});
+//# sourceMappingURL=RelationElementSampleValuesEditor.js.map

package/lib/components/editor/editor-group/data-editor/RelationElementSampleValuesEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RelationElementSampleValuesEditor.js","sourceRoot":"","sources":["../../../../../src/components/editor/editor-group/data-editor/RelationElementSampleValuesEditor.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAsB,MAAM,OAAO,CAAC;AACrD,OAAO,EACL,MAAM,EACN,kBAAkB,EAClB,KAAK,EACL,SAAS,EACT,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,cAAc,EACd,QAAQ,EACR,OAAO,GACR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,qBAAqB,EACrB,eAAe,GAChB,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAQ9D,MAAM,CAAC,MAAM,iCAAiC,GAAG,QAAQ,CACvD,CAAC,KAYA,EAAE,EAAE;IACH,MAAM,EACJ,KAAK,EACL,oBAAoB,EACpB,UAAU,EACV,MAAM,EACN,qBAAqB,EACrB,oBAAoB,EACpB,KAAK,EACL,QAAQ,EACR,WAAW,EACX,eAAe,EACf,cAAc,GACf,GAAG,KAAK,CAAC;IACV,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,OAAO,CAAC,oBAAoB,CAAC,IAAI,OAAO,CAAC,cAAc,CAAC,CAAC;IAE5E,MAAM,UAAU,GAAG,GAAS,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAErD,MAAM,WAAW,GAAG,GAAS,EAAE;QAC7B,IAAI,UAAU,EAAE,CAAC;YACf,cAAc,CAAC,IAAI,CAAC,CAAC;YACrB,OAAO;QACT,CAAC;QACD,OAAO,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;aACrB,IAAI,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;aAChC,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,GAAS,EAAE;QAC9B,WAAW,CAAC,gBAAgB,CAAC,YAAY,CAAC,kBAAkB,CAAC;YAC3D,OAAO,EAAE,oBAAoB;YAC7B,IAAI,EAAE,eAAe,CAAC,OAAO;YAC7B,OAAO,EAAE;gBACP;oBACE,KAAK,EAAE,SAAS;oBAChB,IAAI,EAAE,qBAAqB,CAAC,oBAAoB;oBAChD,OAAO,EAAE,GAAS,EAAE;wBAClB,QAAQ,EAAE,CAAC;wBACX,UAAU,EAAE,CAAC;oBACf,CAAC;iBACF;gBACD;oBACE,KAAK,EAAE,QAAQ;oBACf,IAAI,EAAE,qBAAqB,CAAC,OAAO;oBACnC,OAAO,EAAE,IAAI;iBACd;aACF;SACF,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,WAAW,GAAkB;QACjC,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;KAC/C,CAAC;IACF,IAAI,oBAAoB,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5C,WAAW,CAAC,MAAM,GAAG,WAAW;YAC9B,CAAC,CAAC,gCAAgC;YAClC,CAAC,CAAC,iCAAiC,CAAC;IACxC,CAAC;IAED,OAAO,CACL,8BACE,kBACE,SAAS,EAAC,wCAAwC,EAClD,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,UAAU,IAAI,MAAM,EAC9B,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,mBAAmB,EAC9D,KAAK,EAAE,WAAW,aAEjB,UAAU,CAAC,CAAC,CAAC,KAAC,cAAc,KAAG,CAAC,CAAC,CAAC,KAAC,QAAQ,KAAG,EAC/C,2CAA0B,IACnB,EACR,WAAW,IAAI,CACd,KAAC,MAAM,IACL,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE;oBACP,IAAI,EAAE,8BAA8B;oBACpC,SAAS,EAAE,yBAAyB;oBACpC,KAAK,EAAE,uBAAuB;iBAC/B,YAED,MAAC,KAAK,IACJ,SAAS,EAAC,cAAc,EACxB,QAAQ,EACN,CAAC,WAAW,CAAC,gBAAgB,CAAC,aAAa;yBACxC,mCAAmC,aAGxC,KAAC,WAAW,IAAC,KAAK,EAAE,KAAK,GAAI,EAC7B,KAAC,SAAS,cACR,cACE,KAAK,EAAE;oCACL,OAAO,EAAE,CAAC;oCACV,MAAM,EAAE,MAAM;oCACd,IAAI,EAAE,CAAC;oCACP,SAAS,EAAE,MAAM;oCACjB,SAAS,EAAE,QAAQ;iCACpB,YAEA,cAAc,CAAC,CAAC,CAAC,CAChB,eACE,KAAK,EAAE;wCACL,OAAO,EAAE,QAAQ;wCACjB,OAAO,EAAE,MAAM;wCACf,UAAU,EAAE,QAAQ;wCACpB,cAAc,EAAE,QAAQ;wCACxB,GAAG,EAAE,MAAM;qCACZ,aAED,eACE,KAAK,EAAE;gDACL,KAAK,EAAE,6BAA6B;gDACpC,UAAU,EAAE,QAAQ;gDACpB,QAAQ,EAAE,QAAQ;gDAClB,UAAU,EAAE,GAAG;6CAChB,YAEA,cAAc,CAAC,OAAO;gDACrB,uCAAuC,GACpC,EACP,eACE,KAAK,EAAE;gDACL,OAAO,EAAE,MAAM;gDACf,UAAU,EAAE,QAAQ;gDACpB,GAAG,EAAE,QAAQ;gDACb,OAAO,EAAE,aAAa;gDACtB,UAAU,EAAE,4BAA4B;gDACxC,MAAM,EAAE,sCAAsC;gDAC9C,YAAY,EAAE,QAAQ;6CACvB,aAED,eACE,KAAK,EAAE;wDACL,QAAQ,EAAE,QAAQ;wDAClB,UAAU,EAAE,GAAG;wDACf,KAAK,EAAE,6BAA6B;qDACrC,YAEA,cAAc,CAAC,KAAK,GAChB,EACP,iBACE,SAAS,EAAC,mBAAmB,EAC7B,OAAO,EAAE,cAAc,CAAC,UAAU,EAClC,QAAQ,EAAE,CAAC,CAAC,EACZ,KAAK,EAAC,0BAA0B,EAChC,KAAK,EAAE;wDACL,OAAO,EAAE,eAAe;wDACxB,OAAO,EAAE,MAAM;wDACf,UAAU,EAAE,QAAQ;qDACrB,YAED,KAAC,kBAAkB,KAAG,GACf,IACL,IACF,CACP,CAAC,CAAC,CAAC,CACF,8BACE,cACE,KAAK,EAAE;gDACL,KAAK,EAAE,yBAAyB;gDAChC,UAAU,EAAE,MAAM;gDAClB,QAAQ,EAAE,MAAM;gDAChB,OAAO,EAAE,QAAQ;gDACjB,YAAY,EAAE,MAAM;gDACpB,SAAS,EAAE,QAAQ;gDACnB,eAAe,EAAE,wBAAwB;gDACzC,MAAM,EAAE,mCAAmC;gDAC3C,YAAY,EAAE,KAAK;6CACpB,0CAGG,EACL,oBAAoB,IAAI,CACvB,KAAC,OAAO,IACN,KAAK,EAAE,eAAe,IAAI,EAAE,EAC5B,KAAK,EAAE,IAAI,EACX,SAAS,EAAC,KAAK,EACf,oBAAoB,EAAE,CAAC,WAAW,YAElC,cACE,KAAK,EAAE;oDACL,MAAM,EAAE,WAAW;wDACjB,CAAC,CAAC,gCAAgC;wDAClC,CAAC,CAAC,MAAM;oDACV,YAAY,EAAE,KAAK;oDACnB,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG;iDACtC,YAED,KAAC,qBAAqB,IACpB,oBAAoB,EAAE,oBAAoB,EAC1C,UAAU,EAAE,UAAU,KAClB,CAAC,qBAAqB,KAAK,SAAS;wDACtC,CAAC,CAAC,EAAE,qBAAqB,EAAE;wDAC3B,CAAC,CAAC,EAAE,CAAC,GACP,GACE,GACE,CACX,IACA,CACJ,GACG,GACI,EACZ,MAAC,WAAW,eACT,CAAC,cAAc,IAAI,CAClB,KAAC,iBAAiB,IAChB,KAAK,EAAC,sBAAsB,EAC5B,OAAO,EAAE,YAAY,EACrB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAE,UAAU,GACpB,CACH,EACD,KAAC,iBAAiB,IAChB,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAE,UAAU,EACnB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,WAAW,GAChB,IACU,IACR,GACD,CACV,IACA,CACJ,CAAC;AACJ,CAAC,CACF,CAAC"}

package/lib/components/editor/editor-group/dataProduct/DataProductEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataProductEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/editor/editor-group/dataProduct/DataProductEditor.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,gBAAgB,EACrB,KAAK,yBAAyB,EAK/B,MAAM,mGAAmG,CAAC;AA+K3G,OAAO,KAAK,EACV,eAAe,EAGhB,MAAM,0FAA0F,CAAC;AAIlG,oBAAY,qBAAqB;IAC/B,gBAAgB,wBAAwB;IACxC,iBAAiB,8BAA8B;IAC/C,uBAAuB,+BAA+B;IACtD,aAAa,+BAA+B;IAC5C,cAAc,qCAAqC;IACnD,oBAAoB,sCAAsC;CAC3D;AAED,eAAO,MAAM,qBAAqB,+DAC4B,CAAC;AAK/D,MAAM,MAAM,qBAAqB,GAAG;IAClC,gBAAgB,EAAE,gBAAgB,CAAC;CACpC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,qBAAqB,CAAC;CACnC,CAAC;AA0dF,eAAO,MAAM,qCAAqC,WACxC;IACN,gBAAgB,EAAE,yBAAyB,CAAC;IAC5C,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;CAChD;;CAokBF,CAAC;AAw/DF,eAAO,MAAM,iBAAiB;;CAsK5B,CAAC"}
+{"version":3,"file":"DataProductEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/editor/editor-group/dataProduct/DataProductEditor.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,gBAAgB,EACrB,KAAK,yBAAyB,EAK/B,MAAM,mGAAmG,CAAC;AA8K3G,OAAO,KAAK,EACV,eAAe,EAGhB,MAAM,0FAA0F,CAAC;AAIlG,oBAAY,qBAAqB;IAC/B,gBAAgB,wBAAwB;IACxC,iBAAiB,8BAA8B;IAC/C,uBAAuB,+BAA+B;IACtD,aAAa,+BAA+B;IAC5C,cAAc,qCAAqC;IACnD,oBAAoB,sCAAsC;CAC3D;AAED,eAAO,MAAM,qBAAqB,+DAC4B,CAAC;AAK/D,MAAM,MAAM,qBAAqB,GAAG;IAClC,gBAAgB,EAAE,gBAAgB,CAAC;CACpC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,qBAAqB,CAAC;CACnC,CAAC;AAwQF,eAAO,MAAM,qCAAqC,WACxC;IACN,gBAAgB,EAAE,yBAAyB,CAAC;IAC5C,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;CAChD;;CA2iBF,CAAC;AAu8DF,eAAO,MAAM,iBAAiB;;CAsK5B,CAAC"}

package/lib/components/editor/editor-group/dataProduct/DataProductEditor.js

@@ -17,7 +17,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { observer } from 'mobx-react-lite';
 import { useEditorStore } from '../../EditorStoreProvider.js';
 import { DATA_PRODUCT_TAB, DATA_PRODUCT_TYPE, DataProductEditorState, ModelAccessPointGroupState, } from '../../../../stores/editor/editor-state/element-editor-state/dataProduct/DataProductEditorState.js';
-import { BugIcon, BuildingIcon, CaretDownIcon, Checkbox, CloseEyeIcon, clsx, compressImage, ControlledDropdownMenu, CustomSelectorInput, Dialog, DragPreviewLayer, ErrorWarnIcon, EyeIcon, GroupWorkIcon, HomeIcon, IconSelectorGrid, IconSelectorIcons, InfoCircleIcon, ListEditor, LockIcon, MenuContent, MenuContentItem, Modal, ModalBody, ModalFooter, ModalFooterButton, ModalHeader, ModalTitle, PanelContent, PanelDnDEntry, PanelEntryDragHandle, PanelFormTextField, PanelHeader, PanelHeaderActionItem, PanelHeaderActions, PencilEditIcon, PlusIcon, QuestionCircleIcon, ResizablePanel, ResizablePanelGroup, ResizablePanelSplitter, Switch, TimesIcon, Tooltip, UploadIcon, useDragPreviewLayer, WarningIcon, LongArrowRightIcon, PURE_MappingIcon, GitBranchIcon, ListIcon, PanelLoadingIndicator, GearSuggestIcon, FlaskIcon, SparkleIcon, } from '@finos/legend-art';
+import { BugIcon, BuildingIcon, CaretDownIcon, Checkbox, CloseEyeIcon, clsx, compressImage, ControlledDropdownMenu, CustomSelectorInput, Dialog, DragPreviewLayer, ErrorWarnIcon, EyeIcon, GroupWorkIcon, HomeIcon, IconSelectorGrid, IconSelectorIcons, InfoCircleIcon, ListEditor, LockIcon, MenuContent, MenuContentItem, Modal, ModalBody, ModalFooter, ModalFooterButton, ModalHeader, PanelContent, PanelDnDEntry, PanelEntryDragHandle, PanelFormTextField, PanelHeader, PanelHeaderActionItem, PanelHeaderActions, PencilEditIcon, PlusIcon, QuestionCircleIcon, ResizablePanel, ResizablePanelGroup, ResizablePanelSplitter, Switch, TimesIcon, Tooltip, UploadIcon, useDragPreviewLayer, WarningIcon, LongArrowRightIcon, PURE_MappingIcon, GitBranchIcon, ListIcon, PanelLoadingIndicator, GearSuggestIcon, FlaskIcon, SparkleIcon, } from '@finos/legend-art';
 import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
 import { assertErrorThrown, guaranteeNonNullable, guaranteeType, HttpStatus, isNonNullable, NetworkClientError, UserSearchService, } from '@finos/legend-shared';
 import { AccessorQueryBuilderState, getCompatibleRuntimesFromAccessorOwner, InlineLambdaEditor, LineageViewer, QueryBuilderActionConfig, QueryBuilderAdvancedWorkflowState, } from '@finos/legend-query-builder';
@@ -34,7 +34,7 @@ import { useDrag, useDrop } from 'react-dnd';
 import { annotatedElement_addStereotype, annotatedElement_deleteStereotype, } from '../../../../stores/graph-modifier/DomainGraphModifierHelper.js';
 import { buildElementOption, } from '@finos/legend-lego/graph-editor';
 import { DataProductViewerState, ProductViewer, } from '@finos/legend-extension-dsl-data-product';
-import { RelationElementEditor } from '../data-editor/RelationElementsDataEditor.js';
+import { RelationElementSampleValuesEditor } from '../data-editor/RelationElementSampleValuesEditor.js';
 import { LegendStudioTelemetryHelper } from '../../../../__lib__/LegendStudioTelemetryHelper.js';
 import { LEGEND_STUDIO_DOCUMENTATION_KEY } from '../../../../__lib__/LegendStudioDocumentation.js';
 export var AP_GROUP_MODAL_ERRORS;
@@ -133,102 +133,6 @@ const AccessPointGenerationViewer = observer((props) => {
         }, children: _jsxs(Modal, { className: "editor-modal", darkMode: !editorStore.applicationStore.layoutService
                 .TEMPORARY__isLightColorThemeEnabled, children: [_jsx(ModalHeader, { title: `${accessPointState.accessPoint.id} Plan Generation` }), _jsx(ModalBody, { children: _jsx("div", { className: "panel__content execution-plan-viewer__panel__content", children: _jsx(CodeEditor, { inputValue: generationOutput, isReadOnly: true, language: CODE_EDITOR_LANGUAGE.JSON, hidePadding: true, hideMinimap: true }) }) }), _jsx(ModalFooter, { children: _jsx(ModalFooterButton, { title: "Close plan generation modal", onClick: closeDebug, text: "Close", type: "secondary" }) })] }) }));
 });
-const SampleValuesEditorModal = observer((props) => {
-    const { accessPointState, isReadOnly } = props;
-    const editorStore = accessPointState.state.state.editorStore;
-    const dataElementPath = accessPointState.relationElementExistsinDataElementReference();
-    const closeModal = () => {
-        accessPointState.setShowSampleValuesModal(false);
-    };
-    const handleDeleteSampleValues = () => {
-        editorStore.applicationStore.alertService.setActionAlertInfo({
-            message: `Are you sure you want to delete sample values for Access Point ${accessPointState.accessPoint.id}?`,
-            type: ActionAlertType.CAUTION,
-            actions: [
-                {
-                    label: 'Confirm',
-                    type: ActionAlertActionType.PROCEED_WITH_CAUTION,
-                    handler: () => {
-                        accessPointState.deleteRelationElement();
-                        closeModal();
-                    },
-                },
-                {
-                    label: 'Cancel',
-                    type: ActionAlertActionType.PROCEED,
-                    default: true,
-                },
-            ],
-        });
-    };
-    const handleNavigateToDataElement = () => {
-        if (dataElementPath) {
-            const dataElement = editorStore.graphManagerState.graph.getNullableElement(dataElementPath);
-            if (dataElement) {
-                editorStore.graphEditorMode.openElement(dataElement);
-                closeModal();
-            }
-        }
-    };
-    return (_jsx(Dialog, { open: accessPointState.showSampleValuesModal, onClose: closeModal, classes: {
-            root: 'editor-modal__root-container',
-            container: 'editor-modal__container',
-            paper: 'editor-modal__content',
-        }, children: _jsxs(Modal, { className: "editor-modal", darkMode: !editorStore.applicationStore.layoutService
-                .TEMPORARY__isLightColorThemeEnabled, children: [_jsx(ModalHeader, { title: `${accessPointState.accessPoint.title ?? accessPointState.accessPoint.id} Sample Values` }), _jsx(ModalBody, { children: _jsx("div", { style: {
-                            padding: 0,
-                            height: '100%',
-                            flex: 1,
-                            overflowY: 'auto',
-                            overflowX: 'hidden',
-                        }, children: dataElementPath !== undefined ? (_jsxs("div", { style: {
-                                padding: '1.5rem',
-                                display: 'flex',
-                                alignItems: 'center',
-                                justifyContent: 'center',
-                                gap: '1rem',
-                            }, children: [_jsx("span", { style: {
-                                        color: 'var(--color-light-grey-200)',
-                                        whiteSpace: 'nowrap',
-                                        fontSize: '1.3rem',
-                                        fontWeight: 600,
-                                    }, children: "Sample Values already in Data Element" }), _jsxs("div", { style: {
-                                        display: 'flex',
-                                        alignItems: 'center',
-                                        gap: '0.5rem',
-                                        padding: '0.5rem 1rem',
-                                        background: 'var(--color-dark-grey-100)',
-                                        border: '1px solid var(--color-dark-grey-300)',
-                                        borderRadius: '0.2rem',
-                                    }, children: [_jsx("span", { style: {
-                                                fontSize: '1.3rem',
-                                                fontWeight: 600,
-                                                color: 'var(--color-light-grey-200)',
-                                            }, children: dataElementPath }), _jsx("button", { className: "btn--sm btn--dark", onClick: handleNavigateToDataElement, tabIndex: -1, title: "Navigate to data element", style: {
-                                                padding: '0.3rem 0.5rem',
-                                                display: 'flex',
-                                                alignItems: 'center',
-                                            }, children: _jsx(LongArrowRightIcon, {}) })] })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { style: {
-                                        color: 'var(--color-orange-200)',
-                                        fontWeight: 'bold',
-                                        fontSize: '14px',
-                                        padding: '0.5rem',
-                                        marginBottom: '1rem',
-                                        textAlign: 'center',
-                                        backgroundColor: 'var(--color-orange-50)',
-                                        border: '2px solid var(--color-orange-200)',
-                                        borderRadius: '4px',
-                                    }, children: "DO NOT ADD SENSITIVE DATA" }), accessPointState.relationElementState && (_jsx(Tooltip, { title: accessPointState.getRelationElementMismatchMessage() ??
-                                        '', arrow: true, placement: "top", disableHoverListener: !accessPointState.hasRelationElementMismatch, children: _jsx("div", { style: {
-                                            border: accessPointState.hasRelationElementMismatch
-                                                ? '2px solid var(--color-red-300)'
-                                                : 'none',
-                                            borderRadius: '4px',
-                                            padding: accessPointState.hasRelationElementMismatch
-                                                ? '0.5rem'
-                                                : '0',
-                                        }, children: _jsx(RelationElementEditor, { relationElementState: accessPointState.relationElementState, isReadOnly: isReadOnly, hideColumnDefinitions: true }) }) }))] })) }) }), _jsxs(ModalFooter, { children: [dataElementPath === undefined && (_jsx(ModalFooterButton, { title: "Delete sample values", onClick: handleDeleteSampleValues, text: "Delete", type: "secondary", disabled: isReadOnly })), _jsx(ModalFooterButton, { title: "Close sample values editor", onClick: closeModal, text: "Close", type: "secondary" })] })] }) }));
-});
 export const LakehouseDataProductAccessPointEditor = observer((props) => {
     const { accessPointState, aiSuggestionMeta } = props;
     const editorStore = useEditorStore();
@@ -368,19 +272,20 @@ export const LakehouseDataProductAccessPointEditor = observer((props) => {
                                                             maxWidth: '400px',
                                                             whiteSpace: 'normal',
                                                             wordWrap: 'break-word',
-                                                        }, children: "Marking as \"reproducible\" means consumers can consistently retrieve the exact historical data as it existed at any specific Lakehouse batch." }), arrow: true, placement: 'top', children: _jsx("div", { children: "Reproducible" }) })] }), accessPointState.relationElementExistsinDataElementReference() !==
-                                            undefined ? (_jsxs("button", { className: "access-point-editor__sample-values-btn", onClick: () => accessPointState.setShowSampleValuesModal(true), disabled: props.isReadOnly, title: "Edit sample values", style: {
-                                                cursor: props.isReadOnly ? 'not-allowed' : 'pointer',
-                                            }, children: [_jsx(PencilEditIcon, {}), _jsx("span", { children: "Sample Values" })] })) : accessPointState.relationElementState !== undefined ? (_jsxs("button", { className: "access-point-editor__sample-values-btn", onClick: () => accessPointState.setShowSampleValuesModal(true), disabled: props.isReadOnly, title: "Edit sample values", style: {
-                                                border: accessPointState.hasRelationElementMismatch
-                                                    ? '2px solid var(--color-red-300)'
-                                                    : '1px solid var(--color-blue-200)',
-                                                cursor: props.isReadOnly ? 'not-allowed' : 'pointer',
-                                            }, children: [_jsx(PencilEditIcon, {}), _jsx("span", { children: "Sample Values" })] })) : (_jsxs("button", { className: "access-point-editor__sample-values-btn", onClick: () => {
-                                                flowResult(accessPointState.createAndaddRelationElement()).catch(editorStore.applicationStore.alertUnhandledError);
-                                            }, disabled: props.isReadOnly, title: "Add sample values", style: {
-                                                cursor: props.isReadOnly ? 'not-allowed' : 'pointer',
-                                            }, children: [_jsx(PlusIcon, {}), _jsx("span", { children: "Sample Values" })] })), editorStore.applicationStore.config.options
+                                                        }, children: "Marking as \"reproducible\" means consumers can consistently retrieve the exact historical data as it existed at any specific Lakehouse batch." }), arrow: true, placement: 'top', children: _jsx("div", { children: "Reproducible" }) })] }), _jsx(RelationElementSampleValuesEditor, { title: `${accessPointState.accessPoint.title ?? accessPointState.accessPoint.id} Sample Values`, relationElementState: accessPointState.relationElementState, isReadOnly: props.isReadOnly, hideColumnDefinitions: true, hasMismatch: accessPointState.hasRelationElementMismatch, mismatchMessage: accessPointState.getRelationElementMismatchMessage(), readOnlySource: (() => {
+                                                const dataElementPath = accessPointState.relationElementExistsinDataElementReference();
+                                                return dataElementPath !== undefined
+                                                    ? {
+                                                        label: dataElementPath,
+                                                        onNavigate: () => {
+                                                            const dataElement = editorStore.graphManagerState.graph.getNullableElement(dataElementPath);
+                                                            if (dataElement) {
+                                                                editorStore.graphEditorMode.openElement(dataElement);
+                                                            }
+                                                        },
+                                                    }
+                                                    : undefined;
+                                            })(), deleteConfirmMessage: `Are you sure you want to delete sample values for Access Point ${accessPointState.accessPoint.id}?`, onAdd: () => flowResult(accessPointState.createAndaddRelationElement()), onDelete: () => accessPointState.deleteRelationElement() }), editorStore.applicationStore.config.options
                                             .dataProductConfig && (_jsx(AccessPointClassification, { accessPoint: accessPoint, groupState: groupState })), _jsxs("div", { className: clsx('access-point-editor__type'), title: 'Change target environment', children: [_jsx("div", { className: "access-point-editor__type__label", children: accessPoint.targetEnvironment }), _jsx(ControlledDropdownMenu, { className: "access-point-editor__dropdown", content: _jsx(MenuContent, { children: Object.values(LakehouseTargetEnv).map((environment) => (_jsx(MenuContentItem, { className: "btn__dropdown-combo__option", onClick: () => updateAccessPointTargetEnvironment(environment), children: environment }, environment))) }), menuProps: {
                                                         anchorOrigin: {
                                                             vertical: 'bottom',
@@ -425,17 +330,7 @@ export const LakehouseDataProductAccessPointEditor = observer((props) => {
                             } })) : (_jsxs("div", { onClick: handleDescriptionEdit, title: "Click to edit access point description", className: "access-point-editor__description-container", children: [accessPoint.description ? (_jsx(HoverTextArea, { text: accessPoint.description, handleMouseOver: handleMouseOverDesc, handleMouseOut: handleMouseOutDesc })) : (_jsxs("div", { className: "access-point-editor__group-container__description--warning", onMouseOver: handleMouseOverDesc, onMouseOut: handleMouseOutDesc, children: [_jsx(ErrorWarnIcon, {}), AP_EMPTY_DESC_WARNING] })), isHoveringDesc && hoverIcon()] })), aiSuggestionMeta && (_jsx("div", { className: "data-product-editor__ai-suggestion-inline", children: aiSuggestionMeta.description })), _jsx("div", { className: "access-point-editor__content", children: _jsx("div", { className: "access-point-editor__generic-entry", children: _jsx("div", { className: "access-point-editor__entry__container", children: _jsxs("div", { className: "access-point-editor__entry", children: [_jsxs("button", { className: "access-point-editor__query-builder-btn", onClick: editLambdaInQueryBuilder, disabled: props.isReadOnly, title: "Edit lambda with query builder", children: [_jsx(PencilEditIcon, {}), _jsx("span", { children: "Query Builder" })] }), _jsx(InlineLambdaEditor, { className: 'access-point-editor__lambda-editor', disabled: lambdaEditorState.val.state.state
                                                     .isConvertingTransformLambdaObjects, lambdaEditorState: lambdaEditorState, forceBackdrop: Boolean(lambdaEditorState.parserError), onEditorBlur: handleEditorBlur })] }) }) }) }), _jsx(LineageViewer, { lineageState: accessPointState.lineageState })] }), _jsx("button", { className: "access-point-editor__generic-entry__remove-btn", onClick: () => {
                         handleRemoveAccessPoint();
-                    }, tabIndex: -1, title: "Remove", children: _jsx(TimesIcon, {}) }), accessPointState.artifactGenerationContent && (_jsx(AccessPointGenerationViewer, { accessPointState: accessPointState, generationOutput: accessPointState.artifactGenerationContent })), accessPointState.showSampleValuesModal && (_jsx(SampleValuesEditorModal, { accessPointState: accessPointState, isReadOnly: props.isReadOnly }))] }) }));
-});
-const DataProductDeploymentResponseModal = observer((props) => {
-    const { state } = props;
-    const applicationStore = state.editorStore.applicationStore;
-    const closeModal = () => state.setDeployResponse(undefined);
-    return (_jsx(Dialog, { open: Boolean(state.deployResponse), classes: {
-            root: 'editor-modal__root-container',
-            container: 'editor-modal__container',
-            paper: 'editor-modal__content',
-        }, onClose: closeModal, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, className: "editor-modal", children: [_jsx(ModalHeader, { children: _jsx(ModalTitle, { title: "Data Product Deployment Response" }) }), _jsx(ModalBody, { children: _jsx(PanelContent, { children: _jsx(CodeEditor, { inputValue: JSON.stringify(state.deployResponse?.content ?? {}, null, 2), isReadOnly: true, language: CODE_EDITOR_LANGUAGE.JSON }) }) }), _jsx(ModalFooter, { children: _jsx(ModalFooterButton, { onClick: closeModal, text: "Close", type: "secondary" }) })] }) }));
+                    }, tabIndex: -1, title: "Remove", children: _jsx(TimesIcon, {}) }), accessPointState.artifactGenerationContent && (_jsx(AccessPointGenerationViewer, { accessPointState: accessPointState, generationOutput: accessPointState.artifactGenerationContent }))] }) }));
 });
 const AccessPointGroupPublicToggle = observer((props) => {
     const { groupState } = props;
@@ -577,7 +472,7 @@ const AccessPointGroupEditor = observer((props) => {
         if (!aiDocSuggester || !legendAIUrl) {
             return;
         }
-        LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestLaunched(editorStore.applicationStore.telemetryService, productEditorState.product.path);
+        LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestLaunched(editorStore.applicationStore.telemetryService, productEditorState.product.path, editorStore.editorMode.getSourceInfo());
         setIsSuggestingWithAI(true);
         setAISuggestion(undefined);
         try {
@@ -590,7 +485,7 @@ const AccessPointGroupEditor = observer((props) => {
         }
         catch (error) {
             assertErrorThrown(error);
-            LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestFailure(editorStore.applicationStore.telemetryService, productEditorState.product.path, error.message);
+            LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestFailure(editorStore.applicationStore.telemetryService, productEditorState.product.path, error.message, editorStore.editorMode.getSourceInfo());
             if (error instanceof NetworkClientError &&
                 (error.response.status === HttpStatus.UNAUTHORIZED ||
                     error.response.status === HttpStatus.FORBIDDEN)) {
@@ -611,7 +506,7 @@ const AccessPointGroupEditor = observer((props) => {
         if (!aiSuggestion) {
             return;
         }
-        LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestApplied(editorStore.applicationStore.telemetryService, productEditorState.product.path);
+        LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestApplied(editorStore.applicationStore.telemetryService, productEditorState.product.path, editorStore.editorMode.getSourceInfo());
         // Find matching group in the response
         const gIdx = productEditorState.accessPointGroupStates.indexOf(groupState);
         const groupMeta = aiSuggestion.access_point_groups.find((g) => g.name === groupState.value.id) ?? aiSuggestion.access_point_groups[gIdx];
@@ -635,7 +530,7 @@ const AccessPointGroupEditor = observer((props) => {
         setAISuggestion(undefined);
     };
     const discardAISuggestion = () => {
-        LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestDiscarded(editorStore.applicationStore.telemetryService, productEditorState.product.path);
+        LegendStudioTelemetryHelper.logEvent_DataProductLegendAISuggestDiscarded(editorStore.applicationStore.telemetryService, productEditorState.product.path, editorStore.editorMode.getSourceInfo());
         setAISuggestion(undefined);
     };
     // Computed AI suggestion for current group
@@ -792,7 +687,7 @@ const AccessPointGroupTab = observer((props) => {
                                 },
                             }, children: _jsx(PlusIcon, { title: disableAddGroup
                                     ? 'Provide all group names'
-                                    : 'Create new access point group' }) })] }) }), _jsx(PanelContent, { children: selectedGroupState && (_jsx(AccessPointGroupEditor, { groupState: selectedGroupState, isReadOnly: isReadOnly }, selectedGroupState.uuid)) }), dataProductEditorState.deployResponse && (_jsx(DataProductDeploymentResponseModal, { state: dataProductEditorState }))] }));
+                                    : 'Create new access point group' }) })] }) }), _jsx(PanelContent, { children: selectedGroupState && (_jsx(AccessPointGroupEditor, { groupState: selectedGroupState, isReadOnly: isReadOnly }, selectedGroupState.uuid)) })] }));
 });
 const DataProductSidebar = observer((props) => {
     const { dataProductEditorState } = props;