diff --git a/frontend/src/ide/editor/no-code-model/no-code-model.jsx b/frontend/src/ide/editor/no-code-model/no-code-model.jsx
index 220a04a..8f3fa3f 100644
--- a/frontend/src/ide/editor/no-code-model/no-code-model.jsx
+++ b/frontend/src/ide/editor/no-code-model/no-code-model.jsx
@@ -92,6 +92,7 @@ import {
OpenTab,
} from "../../../base/icons/index.js";
import { SpinnerLoader } from "../../../widgets/spinner_loader/index.js";
+import { CopyableCell } from "../../../widgets/copyable-cell/index.js";
import "./no-code-model.css";
import "reactflow/dist/style.css";
import { useNotificationService } from "../../../service/notification-service.js";
@@ -743,6 +744,7 @@ function NoCodeModel({ nodeData }) {
})
.catch((error) => {
notify({ error });
+ setIsLoading(false);
handleModalClose();
})
.finally(() => {
@@ -1362,23 +1364,33 @@ function NoCodeModel({ nodeData }) {
? JSON.stringify(text)
: text;
+ const formattedValue =
+ displayValue === null || displayValue === undefined
+ ? ""
+ : ["Boolean", "boolean"].includes(dataType)
+ ? String(displayValue)
+ : dataType === "Number"
+ ? formatNumber(displayValue)
+ : displayValue;
+
+ const alignClass =
+ dataType === "Number"
+ ? "flex-justify-right"
+ : ["Boolean", "boolean"].includes(dataType)
+ ? "flex-justify-center"
+ : "";
+
return (
-
- {["Boolean", "boolean"].includes(dataType)
- ? String(displayValue)
- : dataType === "Number"
- ? formatNumber(displayValue)
- : displayValue}
-
+ {formattedValue}
+
);
},
};
diff --git a/frontend/src/service/notification-service.js b/frontend/src/service/notification-service.js
index 7997e8a..5266ba7 100644
--- a/frontend/src/service/notification-service.js
+++ b/frontend/src/service/notification-service.js
@@ -60,7 +60,7 @@ function NotificationProvider({ children }) {
if (errorData && typeof errorData.error_message === "string") {
const text = errorData.error_message;
if (errorData.is_markdown) {
- finalMessage = "";
+ finalMessage = "Failed";
const formatted = text.replace(/\n/g, " \n");
finalDescription = formatted;
type = errorData?.severity?.toLowerCase() || "error";
diff --git a/frontend/src/widgets/copyable-cell/copyable-cell.css b/frontend/src/widgets/copyable-cell/copyable-cell.css
new file mode 100644
index 0000000..2175468
--- /dev/null
+++ b/frontend/src/widgets/copyable-cell/copyable-cell.css
@@ -0,0 +1,26 @@
+/* Copyable Cell - hover tooltip with copy for table cells */
+
+.copyable-cell-text {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ cursor: default;
+}
+
+/* Tooltip content layout */
+.copyable-cell-tooltip {
+ display: flex;
+ align-items: flex-start;
+ gap: 8px;
+ font-family: var(--font-family);
+}
+
+.copyable-cell-tooltip-text {
+ flex: 1;
+ min-width: 0;
+ word-break: break-word;
+ white-space: pre-wrap;
+ user-select: text;
+ font-size: 12px;
+ line-height: 1.5;
+}
diff --git a/frontend/src/widgets/copyable-cell/index.js b/frontend/src/widgets/copyable-cell/index.js
new file mode 100644
index 0000000..9f1bfaf
--- /dev/null
+++ b/frontend/src/widgets/copyable-cell/index.js
@@ -0,0 +1,124 @@
+import { memo, useState, useCallback, useRef, useEffect, useMemo } from "react";
+import PropTypes from "prop-types";
+import { Tooltip, theme } from "antd";
+import { CopyOutlined, CheckOutlined } from "@ant-design/icons";
+
+import "./copyable-cell.css";
+
+const { useToken } = theme;
+const MAX_TOOLTIP_LENGTH = 500;
+
+const CopyableCell = memo(function CopyableCell({
+ children,
+ value,
+ className = "",
+}) {
+ const [copied, setCopied] = useState(false);
+ const timeoutRef = useRef(null);
+ const { token } = useToken();
+
+ const textValue = value !== undefined && value !== null ? String(value) : "";
+
+ // Cleanup timeout on unmount
+ useEffect(() => {
+ return () => {
+ if (timeoutRef.current) clearTimeout(timeoutRef.current);
+ };
+ }, []);
+
+ const doCopy = useCallback(
+ async (e) => {
+ e.stopPropagation();
+ if (!textValue) return;
+ try {
+ await navigator?.clipboard?.writeText(textValue);
+ setCopied(true);
+ if (timeoutRef.current) clearTimeout(timeoutRef.current);
+ timeoutRef.current = setTimeout(() => setCopied(false), 2000);
+ } catch {
+ // silently fail – clipboard may not be available
+ }
+ },
+ [textValue]
+ );
+
+ const overlayStyle = useMemo(
+ () => ({
+ border: `1px solid ${token.colorBorder}`,
+ borderRadius: "8px",
+ }),
+ [token.colorBorder]
+ );
+
+ const copiedIconStyle = useMemo(
+ () => ({ color: token.colorSuccess, fontSize: 14, padding: 2 }),
+ [token.colorSuccess]
+ );
+
+ const copyIconStyle = useMemo(
+ () => ({
+ cursor: "pointer",
+ color: token.colorTextSecondary,
+ fontSize: 14,
+ padding: 2,
+ }),
+ [token.colorTextSecondary]
+ );
+
+ if (!textValue) {
+ return {children};
+ }
+
+ const truncatedValue =
+ textValue.length > MAX_TOOLTIP_LENGTH
+ ? textValue.slice(0, MAX_TOOLTIP_LENGTH) + "..."
+ : textValue;
+
+ const tooltipContent = (
+
+
+ {truncatedValue}
+
+ {copied ? (
+
+ ) : (
+
+ )}
+
+ );
+
+ return (
+
+
+
+ {children}
+
+
+
+ );
+});
+
+CopyableCell.propTypes = {
+ children: PropTypes.node,
+ value: PropTypes.oneOfType([
+ PropTypes.string,
+ PropTypes.number,
+ PropTypes.bool,
+ ]),
+ className: PropTypes.string,
+};
+
+export { CopyableCell };