@solidxai/core-ui 0.1.9-beta.9 → 0.1.10

package/dist/components/core/module/ModuleMetadataExplorer.js

@@ -0,0 +1,666 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ChevronDown, ChevronRight, DatabaseZap, FileSearch, Save, Search, Settings, Wand2 } from "lucide-react";
+import React, { useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
+import { useDispatch } from "react-redux";
+import { useGetModuleMetadataExplorerDocumentQuery, useGetModuleMetadataExplorerManifestQuery, useSeedModuleMetadataMutation, useUpdateModuleMetadataExplorerSectionMutation, useValidateModuleMetadataExplorerSectionMutation, } from "../../../redux/api/moduleApi";
+import { showToast } from "../../../redux/features/toastSlice";
+import { SolidButton, SolidDialog, SolidDialogBody, SolidDialogFooter, SolidDialogHeader, SolidDialogSeparator, SolidDialogTitle, SolidDropdownMenu, SolidDropdownMenuContent, SolidDropdownMenuItem, SolidDropdownMenuTrigger, SolidInput, SolidMessage, SolidTag, } from "../../shad-cn-ui";
+import "jsoneditor/dist/jsoneditor.css";
+import "./ModuleMetadataExplorer.css";
+function extractApiErrorMessage(error) {
+    var _a, _b, _c;
+    var message = (_c = (_b = (_a = error === null || error === void 0 ? void 0 : error.data) === null || _a === void 0 ? void 0 : _a.message) !== null && _b !== void 0 ? _b : error === null || error === void 0 ? void 0 : error.message) !== null && _c !== void 0 ? _c : "Something went wrong";
+    return Array.isArray(message) ? message.join(", ") : String(message);
+}
+function serializeJson(value) {
+    try {
+        return JSON.stringify(value);
+    }
+    catch (_error) {
+        return "";
+    }
+}
+function deepCloneJson(value) {
+    return JSON.parse(JSON.stringify(value));
+}
+function humanizeKey(value) {
+    return value
+        .replace(/([a-z0-9])([A-Z])/g, "$1 $2")
+        .replace(/[_-]+/g, " ")
+        .replace(/\s+/g, " ")
+        .trim()
+        .replace(/^./, function (char) { return char.toUpperCase(); });
+}
+function tokenizePath(path) {
+    var tokens = [];
+    var regex = /([^[.\]]+)|\[(\d+)\]/g;
+    var match;
+    while ((match = regex.exec(path)) !== null) {
+        if (match[1] !== undefined) {
+            tokens.push(match[1]);
+        }
+        else if (match[2] !== undefined) {
+            tokens.push(Number(match[2]));
+        }
+    }
+    return tokens;
+}
+function getValueAtJsonPath(source, path) {
+    if (!path)
+        return source;
+    return tokenizePath(path).reduce(function (current, token) {
+        if (current === undefined || current === null)
+            return undefined;
+        return current[token];
+    }, source);
+}
+function setValueAtJsonPath(target, path, value) {
+    var tokens = tokenizePath(path);
+    if (!tokens.length)
+        return;
+    var current = target;
+    for (var index = 0; index < tokens.length - 1; index += 1) {
+        current = current[tokens[index]];
+    }
+    current[tokens[tokens.length - 1]] = value;
+}
+function appendPath(basePath, key) {
+    return basePath ? "".concat(basePath, ".").concat(key) : key;
+}
+function getArrayItemLabel(item, index, parentKey) {
+    var labelCandidates = [
+        "singularName",
+        "name",
+        "displayName",
+        "pluralName",
+        "label",
+        "key",
+        "title",
+        "id",
+    ];
+    for (var _i = 0, labelCandidates_1 = labelCandidates; _i < labelCandidates_1.length; _i++) {
+        var candidate = labelCandidates_1[_i];
+        var nextValue = item === null || item === void 0 ? void 0 : item[candidate];
+        if (nextValue !== undefined && nextValue !== null && "".concat(nextValue).trim()) {
+            return "".concat(nextValue);
+        }
+    }
+    return "".concat(humanizeKey(parentKey || "Item"), " ").concat(index + 1);
+}
+function buildTreeNode(value, options) {
+    var label = options.label, path = options.path, parentPath = options.parentPath, sectionKey = options.sectionKey, sectionTitle = options.sectionTitle, hintKey = options.hintKey;
+    var children = [];
+    if (Array.isArray(value)) {
+        children = value
+            .filter(function (item) { return item !== null && typeof item === "object"; })
+            .map(function (item, index) { return buildTreeNode(item, {
+            label: getArrayItemLabel(item, index, hintKey),
+            path: "".concat(path, "[").concat(index, "]"),
+            parentPath: path,
+            sectionKey: sectionKey,
+            sectionTitle: sectionTitle,
+            hintKey: hintKey,
+        }); });
+    }
+    else if (value && typeof value === "object") {
+        children = Object.entries(value)
+            .filter(function (_a) {
+            var nextValue = _a[1];
+            return nextValue !== null && typeof nextValue === "object";
+        })
+            .map(function (_a) {
+            var key = _a[0], nextValue = _a[1];
+            return buildTreeNode(nextValue, {
+                label: humanizeKey(key),
+                path: appendPath(path, key),
+                parentPath: path,
+                sectionKey: sectionKey,
+                sectionTitle: sectionTitle,
+                hintKey: key,
+            });
+        });
+    }
+    return {
+        id: path,
+        label: label,
+        path: path,
+        parentPath: parentPath,
+        sectionKey: sectionKey,
+        sectionTitle: sectionTitle,
+        children: children,
+    };
+}
+function buildTreeFromDocument(sections, documentValue) {
+    var nodes = sections
+        .map(function (section) {
+        var sectionValue = getValueAtJsonPath(documentValue, section.jsonPath);
+        if (sectionValue === undefined)
+            return null;
+        return buildTreeNode(sectionValue, {
+            label: section.title,
+            path: section.jsonPath,
+            parentPath: null,
+            sectionKey: section.key,
+            sectionTitle: section.title,
+            hintKey: section.key,
+        });
+    })
+        .filter(Boolean);
+    var nodeMap = new Map();
+    var visit = function (nextNodes) {
+        nextNodes.forEach(function (node) {
+            nodeMap.set(node.path, node);
+            if (node.children.length)
+                visit(node.children);
+        });
+    };
+    visit(nodes);
+    return { nodes: nodes, nodeMap: nodeMap };
+}
+function filterTreeNodes(nodes, query) {
+    var needle = query.trim().toLowerCase();
+    if (!needle)
+        return nodes;
+    var visit = function (node) {
+        var filteredChildren = node.children
+            .map(visit)
+            .filter(Boolean);
+        var matches = node.label.toLowerCase().includes(needle) || node.path.toLowerCase().includes(needle);
+        if (matches || filteredChildren.length) {
+            return __assign(__assign({}, node), { children: filteredChildren });
+        }
+        return null;
+    };
+    return nodes.map(visit).filter(Boolean);
+}
+function getAncestorPaths(nodeMap, path) {
+    var paths = [];
+    var current = nodeMap.get(path);
+    while (current === null || current === void 0 ? void 0 : current.parentPath) {
+        paths.push(current.parentPath);
+        current = nodeMap.get(current.parentPath);
+    }
+    return paths;
+}
+function getSectionForPath(sections, path) {
+    var _a;
+    return (_a = sections
+        .filter(function (section) { return path === section.jsonPath || path.startsWith("".concat(section.jsonPath, ".")) || path.startsWith("".concat(section.jsonPath, "[")); })
+        .sort(function (left, right) { return right.jsonPath.length - left.jsonPath.length; })[0]) !== null && _a !== void 0 ? _a : null;
+}
+function filterIssuesForPath(issues, path) {
+    return issues.filter(function (issue) {
+        if (!issue.path)
+            return false;
+        return issue.path === path || issue.path.startsWith("".concat(path, ".")) || issue.path.startsWith("".concat(path, "["));
+    });
+}
+var JsonEditorSurface = React.forwardRef(function JsonEditorSurface(_a, ref) {
+    var value = _a.value, resetToken = _a.resetToken, _b = _a.readOnly, readOnly = _b === void 0 ? false : _b, onValueChange = _a.onValueChange, onErrorChange = _a.onErrorChange;
+    var containerRef = useRef(null);
+    var editorRef = useRef(null);
+    // Keep a ref to the latest value so the async init can seed the editor correctly
+    var latestValueRef = useRef(value);
+    // Sync latest value into ref so async editor init can use it
+    useEffect(function () { latestValueRef.current = value; }, [value]);
+    var emitState = function () {
+        var editor = editorRef.current;
+        if (!editor)
+            return;
+        try {
+            var nextValue = editor.get();
+            onValueChange(nextValue);
+            onErrorChange(null);
+        }
+        catch (error) {
+            onErrorChange((error === null || error === void 0 ? void 0 : error.message) ? String(error.message) : "The JSON is currently invalid.");
+        }
+    };
+    useImperativeHandle(ref, function () { return ({
+        format: function () {
+            var _a, _b;
+            try {
+                (_b = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.format) === null || _b === void 0 ? void 0 : _b.call(_a);
+            }
+            catch (_error) {
+                // jsoneditor already surfaces parse states through onErrorChange
+            }
+            emitState();
+        },
+    }); }, []);
+    useEffect(function () {
+        if (!containerRef.current || editorRef.current)
+            return;
+        var destroyed = false;
+        // @ts-ignore
+        void import("jsoneditor").then(function (jsonEditorModule) {
+            var _a, _b, _c;
+            if (destroyed || !containerRef.current || editorRef.current) {
+                return;
+            }
+            var JSONEditor = (_a = jsonEditorModule === null || jsonEditorModule === void 0 ? void 0 : jsonEditorModule.default) !== null && _a !== void 0 ? _a : jsonEditorModule;
+            editorRef.current = new JSONEditor(containerRef.current, {
+                mode: "code",
+                modes: ["code"],
+                mainMenuBar: true,
+                navigationBar: true,
+                statusBar: true,
+                search: true,
+                enableSort: false,
+                enableTransform: false,
+                onChange: function () { return emitState(); },
+            });
+            // Seed editor with current value (which may already be set before async init resolved)
+            try {
+                editorRef.current.set(latestValueRef.current);
+            }
+            catch (_e) { }
+            emitState();
+            if ((_c = (_b = editorRef.current) === null || _b === void 0 ? void 0 : _b.aceEditor) === null || _c === void 0 ? void 0 : _c.setReadOnly) {
+                editorRef.current.aceEditor.setReadOnly(readOnly);
+            }
+        });
+        return function () {
+            var _a, _b;
+            destroyed = true;
+            (_b = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.destroy) === null || _b === void 0 ? void 0 : _b.call(_a);
+            editorRef.current = null;
+        };
+    }, []);
+    useEffect(function () {
+        if (!editorRef.current)
+            return;
+        editorRef.current.set(value);
+        emitState();
+    }, [resetToken, value]);
+    useEffect(function () {
+        var _a, _b;
+        if (!((_b = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.aceEditor) === null || _b === void 0 ? void 0 : _b.setReadOnly))
+            return;
+        editorRef.current.aceEditor.setReadOnly(readOnly);
+    }, [readOnly]);
+    return _jsx("div", { ref: containerRef, className: "solid-module-explorer-editor-host solid-module-explorer-jsoneditor ".concat(readOnly ? "is-readonly" : "") });
+});
+function MetadataTree(_a) {
+    var nodes = _a.nodes, activePath = _a.activePath, expandedPaths = _a.expandedPaths, onToggle = _a.onToggle, onSelect = _a.onSelect, _b = _a.depth, depth = _b === void 0 ? 0 : _b;
+    return (_jsx(_Fragment, { children: nodes.map(function (node) {
+            var isExpanded = expandedPaths.has(node.path);
+            var hasChildren = node.children.length > 0;
+            var isActive = activePath === node.path;
+            return (_jsxs("div", { className: "solid-module-explorer-tree-node", children: [_jsxs("div", { className: "solid-module-explorer-tree-row ".concat(isActive ? "is-active" : ""), style: { paddingLeft: "".concat(depth * 0.9, "rem") }, children: [_jsx("button", { type: "button", className: "solid-module-explorer-tree-toggle", onClick: function () { return hasChildren && onToggle(node.path); }, "aria-label": hasChildren ? (isExpanded ? "Collapse node" : "Expand node") : "Leaf node", disabled: !hasChildren, children: hasChildren ? (isExpanded ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })) : _jsx("span", { className: "solid-module-explorer-tree-dot" }) }), _jsx("button", { type: "button", className: "solid-module-explorer-tree-label", onClick: function () { return onSelect(node.path); }, title: node.path, children: node.label })] }), hasChildren && isExpanded && (_jsx(MetadataTree, { nodes: node.children, activePath: activePath, expandedPaths: expandedPaths, onToggle: onToggle, onSelect: onSelect, depth: depth + 1 }))] }, node.id));
+        }) }));
+}
+export function ModuleMetadataExplorer(_a) {
+    var _this = this;
+    var _b, _c, _d, _f, _g, _h, _j, _k, _l;
+    var moduleName = _a.moduleName, moduleId = _a.moduleId, modelSingularName = _a.modelSingularName, scopedArrayPath = _a.scopedArrayPath, scopedItemValue = _a.scopedItemValue, scopedItemField = _a.scopedItemField, _m = _a.readOnly, readOnly = _m === void 0 ? false : _m, _o = _a.allowSeed, allowSeed = _o === void 0 ? true : _o;
+    var dispatch = useDispatch();
+    var editorRef = useRef(null);
+    var explorerRef = useRef(null);
+    var isResizingRef = useRef(false);
+    var _p = useState(""), activePath = _p[0], setActivePath = _p[1];
+    var _q = useState(new Set()), expandedPaths = _q[0], setExpandedPaths = _q[1];
+    var _r = useState(""), treeFilter = _r[0], setTreeFilter = _r[1];
+    var _s = useState(280), sidebarWidth = _s[0], setSidebarWidth = _s[1];
+    var _t = useState({}), editorValue = _t[0], setEditorValue = _t[1];
+    var _u = useState({}), savedValue = _u[0], setSavedValue = _u[1];
+    var _v = useState(null), editorError = _v[0], setEditorError = _v[1];
+    var _w = useState("initial"), editorResetToken = _w[0], setEditorResetToken = _w[1];
+    var _x = useState(null), validationIssues = _x[0], setValidationIssues = _x[1];
+    var _y = useState(""), localActionSummary = _y[0], setLocalActionSummary = _y[1];
+    var _z = useState(false), isContextDialogOpen = _z[0], setIsContextDialogOpen = _z[1];
+    var _0 = useState(false), isSeedDialogOpen = _0[0], setIsSeedDialogOpen = _0[1];
+    var _1 = useGetModuleMetadataExplorerManifestQuery(moduleName, {
+        skip: !moduleName,
+    }), manifestData = _1.data, manifestError = _1.error, refetchManifest = _1.refetch;
+    var _2 = useGetModuleMetadataExplorerDocumentQuery(moduleName, {
+        skip: !moduleName,
+    }), documentData = _2.data, isDocumentLoading = _2.isLoading, documentError = _2.error, refetchDocument = _2.refetch;
+    var _3 = useUpdateModuleMetadataExplorerSectionMutation(), updateSection = _3[0], isSavingSection = _3[1].isLoading;
+    var _4 = useValidateModuleMetadataExplorerSectionMutation(), validateSection = _4[0], isValidatingSection = _4[1].isLoading;
+    var _5 = useSeedModuleMetadataMutation(), seedModuleMetadata = _5[0], isSeedingModule = _5[1].isLoading;
+    var isReadOnlyExplorer = readOnly || (moduleName === null || moduleName === void 0 ? void 0 : moduleName.toLowerCase()) === "solid-core";
+    var sections = ((_b = manifestData === null || manifestData === void 0 ? void 0 : manifestData.sections) !== null && _b !== void 0 ? _b : []);
+    var fullDocument = (_c = documentData === null || documentData === void 0 ? void 0 : documentData.value) !== null && _c !== void 0 ? _c : {};
+    var loadError = !manifestData || !documentData ? (manifestError !== null && manifestError !== void 0 ? manifestError : documentError) : null;
+    var _6 = useMemo(function () { return buildTreeFromDocument(sections, fullDocument); }, [sections, fullDocument]), treeNodes = _6.nodes, nodeMap = _6.nodeMap;
+    var scopedRootPath = useMemo(function () {
+        // Scope to a specific model definition
+        if (modelSingularName) {
+            var models = getValueAtJsonPath(fullDocument, "moduleMetadata.models");
+            if (!Array.isArray(models))
+                return "";
+            var modelIndex = models.findIndex(function (model) { return (model === null || model === void 0 ? void 0 : model.singularName) === modelSingularName; });
+            return modelIndex >= 0 ? "moduleMetadata.models[".concat(modelIndex, "]") : "";
+        }
+        // Scope to a specific item in a root-level array (e.g. views, actions, menus)
+        if (scopedArrayPath && scopedItemValue) {
+            var arr = getValueAtJsonPath(fullDocument, scopedArrayPath);
+            if (!Array.isArray(arr))
+                return "";
+            var matchField_1 = scopedItemField !== null && scopedItemField !== void 0 ? scopedItemField : "name";
+            var itemIndex = arr.findIndex(function (item) { return (item === null || item === void 0 ? void 0 : item[matchField_1]) === scopedItemValue; });
+            return itemIndex >= 0 ? "".concat(scopedArrayPath, "[").concat(itemIndex, "]") : "";
+        }
+        return "";
+    }, [fullDocument, modelSingularName, scopedArrayPath, scopedItemValue, scopedItemField]);
+    var scopedTreeNodes = useMemo(function () {
+        if (!scopedRootPath)
+            return treeNodes;
+        var scopedNode = nodeMap.get(scopedRootPath);
+        return scopedNode ? [scopedNode] : [];
+    }, [nodeMap, scopedRootPath, treeNodes]);
+    var filteredTreeNodes = useMemo(function () { return filterTreeNodes(scopedTreeNodes, treeFilter); }, [scopedTreeNodes, treeFilter]);
+    var visibleExpandedPaths = useMemo(function () {
+        if (!treeFilter.trim())
+            return expandedPaths;
+        var nextExpanded = new Set();
+        var visit = function (nodesToVisit) {
+            nodesToVisit.forEach(function (node) {
+                if (node.children.length) {
+                    nextExpanded.add(node.path);
+                    visit(node.children);
+                }
+            });
+        };
+        visit(filteredTreeNodes);
+        return nextExpanded;
+    }, [expandedPaths, filteredTreeNodes, treeFilter]);
+    var activeNode = activePath ? (_d = nodeMap.get(activePath)) !== null && _d !== void 0 ? _d : null : null;
+    var activeSection = activePath ? getSectionForPath(sections, activePath) : null;
+    var activeValidationIssues = filterIssuesForPath(validationIssues !== null && validationIssues !== void 0 ? validationIssues : [], activePath);
+    var savedSerialized = serializeJson(savedValue);
+    var editorSerialized = serializeJson(editorValue);
+    var isDirty = editorError ? true : savedSerialized !== editorSerialized;
+    var hasMutableChanges = !isReadOnlyExplorer && isDirty;
+    var canSave = !isReadOnlyExplorer && isDirty && !editorError;
+    var hasValidationFailure = Boolean(editorError) || activeValidationIssues.length > 0;
+    var validationSummary = editorError
+        ? editorError
+        : activeValidationIssues.length
+            ? "".concat(activeValidationIssues.length, " validation issue").concat(activeValidationIssues.length === 1 ? "" : "s", ": ").concat((_g = (_f = activeValidationIssues[0]) === null || _f === void 0 ? void 0 : _f.message) !== null && _g !== void 0 ? _g : "Review this JSON before saving.")
+            : "";
+    useEffect(function () {
+        var _a, _b;
+        setValidationIssues((_b = (_a = documentData === null || documentData === void 0 ? void 0 : documentData.validation) === null || _a === void 0 ? void 0 : _a.issues) !== null && _b !== void 0 ? _b : []);
+    }, [documentData === null || documentData === void 0 ? void 0 : documentData.lastModifiedAt]);
+    useEffect(function () {
+        var handlePointerMove = function (event) {
+            if (!isResizingRef.current || !explorerRef.current)
+                return;
+            var bounds = explorerRef.current.getBoundingClientRect();
+            var nextWidth = Math.min(Math.max(event.clientX - bounds.left, 220), 520);
+            setSidebarWidth(nextWidth);
+        };
+        var handlePointerUp = function () {
+            isResizingRef.current = false;
+            document.body.style.cursor = "";
+            document.body.style.userSelect = "";
+        };
+        window.addEventListener("pointermove", handlePointerMove);
+        window.addEventListener("pointerup", handlePointerUp);
+        return function () {
+            window.removeEventListener("pointermove", handlePointerMove);
+            window.removeEventListener("pointerup", handlePointerUp);
+        };
+    }, []);
+    useEffect(function () {
+        if (!scopedTreeNodes.length)
+            return;
+        var isPathInsideScope = !scopedRootPath ||
+            activePath === scopedRootPath ||
+            activePath.startsWith("".concat(scopedRootPath, ".")) ||
+            activePath.startsWith("".concat(scopedRootPath, "["));
+        if (!activePath || !nodeMap.has(activePath) || !isPathInsideScope) {
+            var defaultPath = scopedTreeNodes[0].path;
+            setActivePath(defaultPath);
+            setExpandedPaths(new Set([defaultPath]));
+        }
+    }, [activePath, nodeMap, scopedRootPath, scopedTreeNodes]);
+    useEffect(function () {
+        var _a;
+        if (!activePath)
+            return;
+        var nextValue = getValueAtJsonPath(fullDocument, activePath);
+        if (nextValue === undefined)
+            return;
+        setSavedValue(nextValue);
+        setEditorValue(nextValue);
+        setEditorError(null);
+        setEditorResetToken("".concat(activePath, ":").concat((_a = documentData === null || documentData === void 0 ? void 0 : documentData.lastModifiedAt) !== null && _a !== void 0 ? _a : ""));
+    }, [activePath, documentData === null || documentData === void 0 ? void 0 : documentData.lastModifiedAt, fullDocument]);
+    var showErrorToast = function (error) {
+        dispatch(showToast({
+            severity: "error",
+            summary: "Metadata Explorer",
+            detail: extractApiErrorMessage(error),
+            life: 4000,
+        }));
+    };
+    var toggleExpandedPath = function (path) {
+        setExpandedPaths(function (current) {
+            var next = new Set(current);
+            if (next.has(path)) {
+                next.delete(path);
+            }
+            else {
+                next.add(path);
+            }
+            return next;
+        });
+    };
+    var selectPath = function (path) {
+        if (path === activePath)
+            return;
+        if (!isReadOnlyExplorer && isDirty) {
+            var shouldProceed = window.confirm("You have unsaved metadata changes. Switch nodes and discard them?");
+            if (!shouldProceed)
+                return;
+        }
+        var ancestorPaths = getAncestorPaths(nodeMap, path);
+        setExpandedPaths(function (current) {
+            var next = new Set(current);
+            ancestorPaths.forEach(function (ancestorPath) { return next.add(ancestorPath); });
+            return next;
+        });
+        setActivePath(path);
+    };
+    var handleSidebarResizeStart = function () {
+        isResizingRef.current = true;
+        document.body.style.cursor = "col-resize";
+        document.body.style.userSelect = "none";
+    };
+    var handleCollapseAll = function () {
+        setExpandedPaths(new Set());
+    };
+    var handleFormat = function () {
+        var _a;
+        (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.format();
+    };
+    var buildPatchedDocument = function () {
+        var nextDocument = deepCloneJson(fullDocument);
+        setValueAtJsonPath(nextDocument, activePath, editorValue);
+        return nextDocument;
+    };
+    var buildPatchedSectionValue = function () {
+        if (!activeSection)
+            return undefined;
+        return getValueAtJsonPath(buildPatchedDocument(), activeSection.jsonPath);
+    };
+    var handleValidate = function () { return __awaiter(_this, void 0, void 0, function () {
+        var response, error_1;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    if (!moduleName || !activePath || !activeSection)
+                        return [2 /*return*/];
+                    if (editorError) {
+                        setLocalActionSummary("Validation blocked because the JSON is currently invalid.");
+                        dispatch(showToast({
+                            severity: "error",
+                            summary: "Metadata Explorer",
+                            detail: "Fix the invalid JSON before validating.",
+                            life: 3500,
+                        }));
+                        return [2 /*return*/];
+                    }
+                    _b.label = 1;
+                case 1:
+                    _b.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, validateSection({
+                            moduleName: moduleName,
+                            sectionKey: activeSection.key,
+                            value: buildPatchedSectionValue(),
+                        }).unwrap()];
+                case 2:
+                    response = _b.sent();
+                    setValidationIssues((_a = response === null || response === void 0 ? void 0 : response.issues) !== null && _a !== void 0 ? _a : []);
+                    setLocalActionSummary((response === null || response === void 0 ? void 0 : response.valid) ? "Validation passed for the current JSON fragment." : "Validation reported issues for the current JSON fragment.");
+                    dispatch(showToast({
+                        severity: (response === null || response === void 0 ? void 0 : response.valid) ? "success" : "warn",
+                        summary: "Metadata Explorer",
+                        detail: (response === null || response === void 0 ? void 0 : response.valid) ? "Validation passed." : "Validation reported issues.",
+                        life: 3000,
+                    }));
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _b.sent();
+                    showErrorToast(error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleSave = function () { return __awaiter(_this, void 0, void 0, function () {
+        var response, error_2;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    if (!moduleName || !activePath || !activeSection)
+                        return [2 /*return*/];
+                    if (editorError) {
+                        dispatch(showToast({
+                            severity: "error",
+                            summary: "Metadata Explorer",
+                            detail: "Fix the invalid JSON before saving.",
+                            life: 3500,
+                        }));
+                        return [2 /*return*/];
+                    }
+                    _c.label = 1;
+                case 1:
+                    _c.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, updateSection({
+                            moduleName: moduleName,
+                            sectionKey: activeSection.key,
+                            value: buildPatchedSectionValue(),
+                        }).unwrap()];
+                case 2:
+                    response = _c.sent();
+                    setValidationIssues((_b = (_a = response === null || response === void 0 ? void 0 : response.validation) === null || _a === void 0 ? void 0 : _a.issues) !== null && _b !== void 0 ? _b : []);
+                    setLocalActionSummary("JSON fragment saved to the metadata file.");
+                    dispatch(showToast({
+                        severity: "success",
+                        summary: "Metadata Explorer",
+                        detail: "Metadata saved successfully.",
+                        life: 3000,
+                    }));
+                    refetchManifest();
+                    refetchDocument();
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_2 = _c.sent();
+                    showErrorToast(error_2);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleSeedModule = function () { return __awaiter(_this, void 0, void 0, function () {
+        var response, error_3;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    if (!moduleId)
+                        return [2 /*return*/];
+                    _c.label = 1;
+                case 1:
+                    _c.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, seedModuleMetadata({ id: moduleId }).unwrap()];
+                case 2:
+                    response = _c.sent();
+                    setIsSeedDialogOpen(false);
+                    setLocalActionSummary((_a = response === null || response === void 0 ? void 0 : response.message) !== null && _a !== void 0 ? _a : "Seeded metadata for module ".concat(moduleName, "."));
+                    dispatch(showToast({
+                        severity: "success",
+                        summary: "Metadata Explorer",
+                        detail: (_b = response === null || response === void 0 ? void 0 : response.message) !== null && _b !== void 0 ? _b : "Module metadata seeded successfully.",
+                        life: 3000,
+                    }));
+                    refetchManifest();
+                    refetchDocument();
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_3 = _c.sent();
+                    showErrorToast(error_3);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    if (!moduleName) {
+        return null;
+    }
+    return (_jsxs("div", { className: "solid-module-explorer", children: [_jsxs("div", { className: "solid-module-explorer-panel", children: [loadError && (_jsx("div", { className: "solid-module-explorer-alert", children: _jsx(SolidMessage, { severity: "error", text: "Unable to load metadata explorer: ".concat(extractApiErrorMessage(loadError)), className: "justify-start" }) })), _jsxs("div", { ref: explorerRef, className: "solid-module-explorer-workspace", style: { gridTemplateColumns: "".concat(sidebarWidth, "px 8px minmax(0, 1fr)") }, children: [_jsx("aside", { className: "solid-module-explorer-sidebar", children: _jsxs("div", { className: "solid-module-explorer-sidebar-section solid-module-explorer-sidebar-sections", children: [_jsxs("div", { className: "solid-module-explorer-sidebar-heading", children: [_jsxs("div", { className: "solid-module-explorer-sidebar-heading-main", children: [_jsx("div", { className: "solid-module-explorer-sidebar-title", children: modelSingularName ? "Explorer" : "Sections" }), _jsx(SolidTag, { tone: "info", children: modelSingularName ? scopedTreeNodes.length : sections.length })] }), _jsx("button", { type: "button", className: "solid-module-explorer-sidebar-action", onClick: handleCollapseAll, children: "Collapse all" })] }), _jsxs("div", { className: "solid-module-explorer-sidebar-search", children: [_jsx(SolidInput, { value: treeFilter, onChange: function (event) { return setTreeFilter(event.target.value); }, placeholder: "Search metadata tree" }), _jsx("div", { className: "solid-module-explorer-sidebar-search-icon", children: _jsx(Search, { size: 14 }) })] }), _jsx("div", { className: "solid-module-explorer-section-list solid-module-explorer-tree-list", children: _jsx(MetadataTree, { nodes: filteredTreeNodes, activePath: activePath, expandedPaths: visibleExpandedPaths, onToggle: toggleExpandedPath, onSelect: selectPath }) })] }) }), _jsx("div", { className: "solid-module-explorer-resizer", role: "separator", "aria-orientation": "vertical", "aria-label": "Resize metadata navigation panel", onPointerDown: handleSidebarResizeStart }), _jsxs("section", { className: "solid-module-explorer-main", children: [_jsxs("div", { className: "solid-module-explorer-main-header", children: [_jsxs("div", { className: "solid-module-explorer-main-title", children: [_jsxs("div", { className: "solid-module-explorer-main-heading-row", children: [_jsx("h4", { children: (_j = (_h = activeNode === null || activeNode === void 0 ? void 0 : activeNode.label) !== null && _h !== void 0 ? _h : activeSection === null || activeSection === void 0 ? void 0 : activeSection.title) !== null && _j !== void 0 ? _j : "Metadata" }), _jsx("p", { children: activePath || "Choose a metadata node from the tree." })] }), hasValidationFailure && (_jsx("div", { className: "solid-module-explorer-inline-validation", title: validationSummary, children: validationSummary })), isReadOnlyExplorer && (_jsx("div", { className: "solid-module-explorer-readonly-note", children: "This metadata is browse-only in the explorer." }))] }), _jsxs("div", { className: "solid-module-explorer-main-actions", children: [_jsxs("div", { className: "solid-module-explorer-main-meta", children: [hasMutableChanges && _jsx(SolidTag, { tone: "warn", children: "Unsaved changes" }), editorError && _jsx(SolidTag, { tone: "danger", children: "Invalid JSON" }), isReadOnlyExplorer && _jsx(SolidTag, { tone: "info", children: "Read only" })] }), !isReadOnlyExplorer && (_jsx(SolidButton, { size: "sm", leftIcon: _jsx(Save, { size: 14 }), onClick: handleSave, loading: isSavingSection, disabled: !canSave, children: "Save Section" })), _jsxs(SolidDropdownMenu, { children: [_jsx(SolidDropdownMenuTrigger, { asChild: true, children: _jsx(SolidButton, { variant: "ghost", size: "sm", className: "solid-icon-button", "aria-label": "Explorer actions", children: _jsx(Settings, { size: 16 }) }) }), _jsxs(SolidDropdownMenuContent, { className: "solid-module-explorer-actions-menu", children: [!isReadOnlyExplorer && (_jsx(SolidDropdownMenuItem, { onSelect: handleFormat, children: _jsxs("div", { className: "solid-module-explorer-actions-item", children: [_jsx(Wand2, { size: 14 }), _jsx("span", { children: "Format" })] }) })), _jsx(SolidDropdownMenuItem, { onSelect: handleValidate, disabled: isValidatingSection, children: _jsxs("div", { className: "solid-module-explorer-actions-item", children: [_jsx(FileSearch, { size: 14 }), _jsx("span", { children: isValidatingSection ? "Validating..." : "Validate" })] }) }), _jsx(SolidDropdownMenuItem, { onSelect: function () { return setIsContextDialogOpen(true); }, children: _jsxs("div", { className: "solid-module-explorer-actions-item", children: [_jsx(Settings, { size: 14 }), _jsx("span", { children: "Context" })] }) }), allowSeed && (_jsx(SolidDropdownMenuItem, { onSelect: function () { return setIsSeedDialogOpen(true); }, disabled: !moduleId || isSeedingModule, children: _jsxs("div", { className: "solid-module-explorer-actions-item", children: [_jsx(DatabaseZap, { size: 14 }), _jsx("span", { children: isSeedingModule ? "Seeding..." : "Seed" })] }) }))] })] })] })] }), _jsx("div", { className: "solid-module-explorer-editor-wrap", children: _jsx("div", { className: "solid-module-explorer-editor-shell", children: isDocumentLoading ? (_jsx("div", { style: { padding: "1rem" }, className: "solid-module-explorer-empty", children: "Loading metadata JSON..." })) : (_jsx(JsonEditorSurface, { ref: editorRef, value: savedValue, resetToken: editorResetToken, readOnly: isReadOnlyExplorer, onValueChange: setEditorValue, onErrorChange: setEditorError })) }) })] })] })] }), _jsx(SolidDialog, { open: isContextDialogOpen, onOpenChange: setIsContextDialogOpen, header: "Context", contentClassName: "solid-module-explorer-context-dialog", children: _jsx(SolidDialogBody, { children: _jsxs("div", { className: "solid-module-explorer-context-dialog-body", children: [_jsxs("div", { className: "solid-module-explorer-context-dialog-header", children: [_jsx("div", { className: "solid-module-explorer-context-dialog-title", children: (_k = activeNode === null || activeNode === void 0 ? void 0 : activeNode.label) !== null && _k !== void 0 ? _k : "Metadata node" }), _jsx("div", { className: "solid-module-explorer-context-dialog-meta", children: (activeNode === null || activeNode === void 0 ? void 0 : activeNode.sectionTitle) && _jsx(SolidTag, { tone: "info", children: activeNode.sectionTitle }) })] }), _jsxs("div", { className: "solid-module-explorer-context-grid", children: [_jsxs("div", { className: "solid-module-explorer-context-row", children: [_jsx("div", { className: "solid-module-explorer-context-label", children: "JSON Path" }), _jsx("div", { className: "solid-module-explorer-context-value", children: activePath || "-" })] }), _jsxs("div", { className: "solid-module-explorer-context-row", children: [_jsx("div", { className: "solid-module-explorer-context-label", children: "File" }), _jsx("div", { className: "solid-module-explorer-context-value", children: (_l = manifestData === null || manifestData === void 0 ? void 0 : manifestData.filePath) !== null && _l !== void 0 ? _l : "-" })] }), localActionSummary && (_jsxs("div", { className: "solid-module-explorer-context-row", children: [_jsx("div", { className: "solid-module-explorer-context-label", children: "Last Action" }), _jsx("div", { className: "solid-module-explorer-context-value", children: localActionSummary })] }))] }), _jsx("div", { className: "solid-module-explorer-context-note", children: "Clicking any branch or leaf in the tree opens that exact JSON fragment on the right." })] }) }) }), _jsxs(SolidDialog, { open: isSeedDialogOpen, onOpenChange: setIsSeedDialogOpen, contentClassName: "solid-module-explorer-seed-dialog", children: [_jsx(SolidDialogHeader, { children: _jsx(SolidDialogTitle, { children: "Seed Module Metadata" }) }), _jsx(SolidDialogSeparator, {}), _jsx(SolidDialogBody, { children: _jsxs("div", { className: "solid-module-explorer-seed-dialog-body", children: [_jsxs("p", { children: ["Re-seed metadata for ", _jsx("strong", { children: moduleName }), " from its JSON file?"] }), _jsx("p", { className: "solid-module-explorer-seed-dialog-note", children: "This only re-runs metadata seeding for the current module and refreshes database metadata from the module JSON." })] }) }), _jsxs(SolidDialogFooter, { children: [_jsx(SolidButton, { variant: "outline", size: "sm", onClick: function () { return setIsSeedDialogOpen(false); }, disabled: isSeedingModule, children: "Cancel" }), _jsx(SolidButton, { size: "sm", onClick: handleSeedModule, loading: isSeedingModule, disabled: !moduleId, children: "Seed" })] })] })] }));
+}
+//# sourceMappingURL=ModuleMetadataExplorer.js.map