fix(mnote-web): 即时显示页面内新建思维导图

rust/crates/mnote-web/src/ssr/pages/layout.rs

@@ -1997,6 +1997,120 @@ const SIDEBAR_TREE_JS: &str = r##"
     document.documentElement.setAttribute('data-mnote-last-upload-asset-id', assetId);
   }
 
+  function removeFileTreeAssetRow(assetId) {
+    var normalized = String(assetId || '').trim();
+    if (!normalized) return false;
+    var row = document.querySelector('.tree-row[data-shell-mode="filetree"][data-asset-id="' + cssEscape(normalized) + '"]');
+    var node = row ? row.closest('.tree-node') : null;
+    if (!node || !node.parentElement) return false;
+    node.parentElement.removeChild(node);
+    return true;
+  }
+
+  function applyAssetsChangedToFileTree(detail) {
+    detail = detail || {};
+    var docId = String(detail.docId || detail.documentId || currentDocumentId() || '').trim();
+    var changed = false;
+    var explicitAsset = detail.asset && typeof detail.asset === 'object' ? detail.asset : null;
+    if (explicitAsset) {
+      appendUploadedAssetRow(explicitAsset, docId);
+      changed = true;
+    }
+    var mindmapAssetIds = Array.isArray(detail.mindmapAssetIds) ? detail.mindmapAssetIds : [];
+    if (detail.mindmapDeleted === true) {
+      mindmapAssetIds.forEach(function(assetId) {
+        if (removeFileTreeAssetRow(assetId)) changed = true;
+      });
+    }
+    if (changed) {
+      document.documentElement.setAttribute('data-mnote-assets-local-applied', 'true');
+    }
+  }
+
+  function mindmapAssetFromTarget(documentId, mindmapId) {
+    var docId = String(documentId || currentDocumentId() || '').trim();
+    var assetId = String(mindmapId || '').trim();
+    if (!docId || !assetId) return null;
+    var fileName = 'mindmap-' + assetId + '.json';
+    return {
+      id: assetId,
+      document_id: docId,
+      asset_type: 'mindmap',
+      file_name: fileName,
+      file_url: '/documents/' + encodeURIComponent(docId) + '/' + encodeURIComponent(fileName)
+    };
+  }
+
+  function parseMindmapApiTarget(input) {
+    try {
+      var rawUrl = typeof input === 'string'
+        ? input
+        : input && typeof input.url === 'string'
+          ? input.url
+          : '';
+      if (!rawUrl) return null;
+      var url = new URL(rawUrl, window.location.origin);
+      var match = /^\/api\/mindmap\/([^/]+)\/([^/]+)$/.exec(url.pathname);
+      if (!match) return null;
+      return {
+        documentId: decodeURIComponent(match[1]),
+        mindmapId: decodeURIComponent(match[2])
+      };
+    } catch (_) {
+      return null;
+    }
+  }
+
+  function requestMethod(input, init) {
+    return String(
+      init && init.method
+        ? init.method
+        : input && typeof input.method === 'string'
+          ? input.method
+          : 'GET'
+    ).toUpperCase();
+  }
+
+  function requestBodyHasMindmapCreateOnly(init) {
+    var body = init && typeof init.body === 'string' ? init.body : '';
+    if (!body) return false;
+    try {
+      var payload = JSON.parse(body);
+      return payload && payload.createOnly === true;
+    } catch (_) {
+      return false;
+    }
+  }
+
+  function applyMindmapApiMutationToFileTree(target) {
+    if (!target || !target.documentId || !target.mindmapId) return;
+    var asset = mindmapAssetFromTarget(target.documentId, target.mindmapId);
+    if (!asset) return;
+    appendUploadedAssetRow(asset, target.documentId);
+    document.documentElement.setAttribute('data-mnote-assets-local-applied', 'true');
+    document.documentElement.setAttribute('data-mnote-last-mindmap-asset-id', target.mindmapId);
+  }
+
+  function installMindmapAssetFetchObserver() {
+    if (window.__mnoteMindmapAssetFetchObserverInstalled === true) return;
+    if (typeof window.fetch !== 'function') return;
+    window.__mnoteMindmapAssetFetchObserverInstalled = true;
+    var originalFetch = window.fetch.bind(window);
+    window.fetch = function(input, init) {
+      var target = parseMindmapApiTarget(input);
+      var method = requestMethod(input, init);
+      var createOnly = requestBodyHasMindmapCreateOnly(init || {});
+      return originalFetch(input, init).then(function(response) {
+        if (target && method === 'POST' && response && response.ok) {
+          if (createOnly || target.documentId === currentDocumentId()) {
+            applyMindmapApiMutationToFileTree(target);
+          }
+        }
+        return response;
+      });
+    };
+  }
+
   async function insertUploadedAssetIntoEditor(asset) {
     var editorRoot = document.querySelector('.editor-surface .ProseMirror');
     var editor = editorRoot && editorRoot.editor;
@@ -2090,6 +2204,11 @@ const SIDEBAR_TREE_JS: &str = r##"
     return payload.asset;
   }
 
+  window.addEventListener('wolai:assets-changed', function(event) {
+    applyAssetsChangedToFileTree(event.detail || {});
+  });
+  installMindmapAssetFetchObserver();
+
   async function uploadFilesWithResolvedTarget(files, detail, options) {
     var list = Array.from(files || []).filter(Boolean);
     if (!list.length) return [];
@@ -4614,6 +4733,11 @@ mod tests {
         assert!(SIDEBAR_TREE_JS.contains("applyCreatedDocumentLocally"));
         assert!(SIDEBAR_TREE_JS.contains("data-mnote-tree-local-command-applied', 'create"));
         assert!(SIDEBAR_TREE_JS.contains("data-mnote-tree-local-command-applied', 'remove"));
+        assert!(SIDEBAR_TREE_JS.contains("wolai:assets-changed"));
+        assert!(SIDEBAR_TREE_JS.contains("applyAssetsChangedToFileTree"));
+        assert!(SIDEBAR_TREE_JS.contains("installMindmapAssetFetchObserver"));
+        assert!(SIDEBAR_TREE_JS.contains("parseMindmapApiTarget"));
+        assert!(SIDEBAR_TREE_JS.contains("data-mnote-assets-local-applied"));
         assert!(SIDEBAR_TREE_JS.contains("application/x-mnote-page-tree-node"));
         assert!(SIDEBAR_TREE_JS.contains("dragstart"));
         assert!(SIDEBAR_TREE_JS.contains("drop"));