@agent-link/server 0.1.126 → 0.1.127

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-link/server",
-  "version": "0.1.126",
+  "version": "0.1.127",
   "description": "AgentLink relay server",
   "license": "MIT",
   "repository": {

package/web/app.js

@@ -80,6 +80,9 @@ const App = {
     // Working directory history
     const workdirHistory = ref([]);
 
+    // Working directory switching loading state
+    const workdirSwitching = ref(false);
+
     // Authentication state
     const authRequired = ref(false);
     const authPassword = ref('');
@@ -112,6 +115,7 @@ const App = {
     const previewPanelWidth = ref(parseInt(localStorage.getItem('agentlink-preview-panel-width'), 10) || 400);
     const previewFile = ref(null);
     const previewLoading = ref(false);
+    const previewMarkdownRendered = ref(false);
 
     // ── switchConversation: save current → load target ──
     // Defined here and used by sidebar.newConversation, sidebar.resumeSession, workdir_changed
@@ -249,7 +253,7 @@ const App = {
       folderPickerLoading, folderPickerSelected, streaming,
       deleteConfirmOpen, deleteConfirmTitle,
       renamingSessionId, renameText,
-      hostname, workdirHistory,
+      hostname, workdirHistory, workdirSwitching,
       // Multi-session parallel
       currentConversationId, conversationCache, processingConversations,
       switchConversation,
@@ -263,6 +267,7 @@ const App = {
       folderPickerLoading, folderPickerEntries, folderPickerPath,
       authRequired, authPassword, authError, authAttempts, authLocked,
       streaming, sidebar, scrollToBottom,
+      workdirSwitching,
       // Multi-session parallel
       currentConversationId, processingConversations, conversationCache,
       switchConversation,
@@ -287,7 +292,7 @@ const App = {
     // File preview module
     const filePreview = createFilePreview({
       wsSend, previewPanelOpen, previewPanelWidth, previewFile, previewLoading,
-      sidebarView, sidebarOpen, isMobile,
+      previewMarkdownRendered, sidebarView, sidebarOpen, isMobile, renderMarkdown,
     });
     setFilePreview(filePreview);
 
@@ -498,6 +503,7 @@ const App = {
       filteredWorkdirHistory: sidebar.filteredWorkdirHistory,
       switchToWorkdir: sidebar.switchToWorkdir,
       removeFromWorkdirHistory: sidebar.removeFromWorkdirHistory,
+      workdirSwitching,
       // Authentication
       authRequired, authPassword, authError, authAttempts, authLocked,
       submitPassword,
@@ -516,7 +522,7 @@ const App = {
       sidebarView, isMobile, fileBrowser,
       flattenedTree: fileBrowser.flattenedTree,
       // File preview
-      previewPanelOpen, previewPanelWidth, previewFile, previewLoading, filePreview,
+      previewPanelOpen, previewPanelWidth, previewFile, previewLoading, previewMarkdownRendered, filePreview,
       workdirMenuOpen,
       toggleWorkdirMenu() { workdirMenuOpen.value = !workdirMenuOpen.value; },
       workdirMenuBrowse() {
@@ -617,9 +623,17 @@ const App = {
                 <svg viewBox="0 0 24 24" width="14" height="14"><path fill="currentColor" d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>
                 Files
               </button>
-              <span v-if="previewFile" class="file-preview-mobile-size">
-                {{ filePreview.formatFileSize(previewFile.totalSize) }}
-              </span>
+              <div class="preview-header-actions">
+                <button v-if="previewFile?.content && filePreview.isMarkdownFile(previewFile.fileName)"
+                        class="preview-md-toggle" :class="{ active: previewMarkdownRendered }"
+                        @click="previewMarkdownRendered = !previewMarkdownRendered"
+                        :title="previewMarkdownRendered ? 'Show source' : 'Render markdown'">
+                  <svg viewBox="0 0 16 16" width="14" height="14"><path fill="currentColor" d="M14.85 3H1.15C.52 3 0 3.52 0 4.15v7.69C0 12.48.52 13 1.15 13h13.69c.64 0 1.15-.52 1.15-1.15v-7.7C16 3.52 15.48 3 14.85 3zM9 11H7V8L5.5 9.92 4 8v3H2V5h2l1.5 2L7 5h2v6zm2.99.5L9.5 8H11V5h2v3h1.5l-2.51 3.5z"/></svg>
+                </button>
+                <span v-if="previewFile" class="file-preview-mobile-size">
+                  {{ filePreview.formatFileSize(previewFile.totalSize) }}
+                </span>
+              </div>
             </div>
             <div class="file-preview-mobile-filename" :title="previewFile?.filePath">
               {{ previewFile?.fileName || 'Preview' }}
@@ -634,6 +648,9 @@ const App = {
                 <img :src="'data:' + previewFile.mimeType + ';base64,' + previewFile.content"
                      :alt="previewFile.fileName" class="preview-image" />
               </div>
+              <div v-else-if="previewFile?.content && previewMarkdownRendered && filePreview.isMarkdownFile(previewFile.fileName)"
+                   class="preview-markdown-rendered markdown-body" v-html="filePreview.renderedMarkdownHtml(previewFile.content)">
+              </div>
               <div v-else-if="previewFile?.content" class="preview-text-container">
                 <pre class="preview-code"><code v-html="filePreview.highlightCode(previewFile.content, previewFile.fileName)"></code></pre>
                 <div v-if="previewFile.truncated" class="preview-truncated-notice">
@@ -1036,6 +1053,12 @@ const App = {
             <span class="preview-panel-filename" :title="previewFile?.filePath">
               {{ previewFile?.fileName || 'Preview' }}
             </span>
+            <button v-if="previewFile?.content && filePreview.isMarkdownFile(previewFile.fileName)"
+                    class="preview-md-toggle" :class="{ active: previewMarkdownRendered }"
+                    @click="previewMarkdownRendered = !previewMarkdownRendered"
+                    :title="previewMarkdownRendered ? 'Show source' : 'Render markdown'">
+              <svg viewBox="0 0 16 16" width="14" height="14"><path fill="currentColor" d="M14.85 3H1.15C.52 3 0 3.52 0 4.15v7.69C0 12.48.52 13 1.15 13h13.69c.64 0 1.15-.52 1.15-1.15v-7.7C16 3.52 15.48 3 14.85 3zM9 11H7V8L5.5 9.92 4 8v3H2V5h2l1.5 2L7 5h2v6zm2.99.5L9.5 8H11V5h2v3h1.5l-2.51 3.5z"/></svg>
+            </button>
             <span v-if="previewFile" class="preview-panel-size">
               {{ filePreview.formatFileSize(previewFile.totalSize) }}
             </span>
@@ -1051,6 +1074,9 @@ const App = {
               <img :src="'data:' + previewFile.mimeType + ';base64,' + previewFile.content"
                    :alt="previewFile.fileName" class="preview-image" />
             </div>
+            <div v-else-if="previewFile?.content && previewMarkdownRendered && filePreview.isMarkdownFile(previewFile.fileName)"
+                 class="preview-markdown-rendered markdown-body" v-html="filePreview.renderedMarkdownHtml(previewFile.content)">
+            </div>
             <div v-else-if="previewFile?.content" class="preview-text-container">
               <pre class="preview-code"><code v-html="filePreview.highlightCode(previewFile.content, previewFile.fileName)"></code></pre>
               <div v-if="previewFile.truncated" class="preview-truncated-notice">
@@ -1165,6 +1191,14 @@ const App = {
         </div>
       </div>
 
+      <!-- Workdir switching overlay -->
+      <Transition name="fade">
+        <div v-if="workdirSwitching" class="workdir-switching-overlay">
+          <div class="workdir-switching-spinner"></div>
+          <div class="workdir-switching-text">Switching directory...</div>
+        </div>
+      </Transition>
+
       <!-- File context menu -->
       <div
         v-if="fileContextMenu"

package/web/modules/connection.js

@@ -20,6 +20,7 @@ export function createConnection(deps) {
     authRequired, authPassword, authError, authAttempts, authLocked,
     streaming, sidebar,
     scrollToBottom,
+    workdirSwitching,
     // Multi-session parallel
     currentConversationId, processingConversations, conversationCache,
     switchConversation,
@@ -504,6 +505,8 @@ export function createConnection(deps) {
           sidebar.addToWorkdirHistory(msg.agent.workDir);
           const savedDir = localStorage.getItem(`agentlink-workdir-${sessionId.value}`);
           if (savedDir && savedDir !== msg.agent.workDir) {
+            workdirSwitching.value = true;
+            setTimeout(() => { workdirSwitching.value = false; }, 10000);
             wsSend({ type: 'change_workdir', workDir: savedDir });
           }
           sidebar.requestSessionList();
@@ -797,6 +800,7 @@ export function createConnection(deps) {
       } else if (msg.type === 'file_content') {
         if (filePreview) filePreview.handleFileContent(msg);
       } else if (msg.type === 'workdir_changed') {
+        workdirSwitching.value = false;
         workDir.value = msg.workDir;
         localStorage.setItem(`agentlink-workdir-${sessionId.value}`, msg.workDir);
         sidebar.addToWorkdirHistory(msg.workDir);

package/web/modules/filePreview.js

@@ -11,9 +11,11 @@ export function createFilePreview(deps) {
     previewPanelWidth,
     previewFile,
     previewLoading,
+    previewMarkdownRendered,
     sidebarView,
     sidebarOpen,
     isMobile,
+    renderMarkdown,
   } = deps;
 
   // ── Open / Close ──
@@ -52,6 +54,7 @@ export function createFilePreview(deps) {
 
   function handleFileContent(msg) {
     previewLoading.value = false;
+    previewMarkdownRendered.value = false;
     previewFile.value = {
       filePath: msg.filePath,
       fileName: msg.fileName,
@@ -174,6 +177,17 @@ export function createFilePreview(deps) {
     localStorage.setItem('agentlink-preview-panel-width', String(previewPanelWidth.value));
   }
 
+  // ── Markdown preview ──
+
+  function isMarkdownFile(fileName) {
+    const ext = (fileName || '').split('.').pop()?.toLowerCase();
+    return ext === 'md' || ext === 'mdx';
+  }
+
+  function renderedMarkdownHtml(content) {
+    return renderMarkdown(content || '');
+  }
+
   return {
     openPreview,
     closePreview,
@@ -183,5 +197,7 @@ export function createFilePreview(deps) {
     highlightCode,
     formatFileSize,
     onResizeStart,
+    isMarkdownFile,
+    renderedMarkdownHtml,
   };
 }

package/web/modules/sidebar.js

@@ -31,12 +31,20 @@ export function createSidebar(deps) {
     loadingSessions, loadingHistory, workDir, visibleLimit,
     folderPickerOpen, folderPickerPath, folderPickerEntries,
     folderPickerLoading, folderPickerSelected, streaming,
-    hostname, workdirHistory,
+    hostname, workdirHistory, workdirSwitching,
     // Multi-session parallel
     currentConversationId, conversationCache, processingConversations,
     switchConversation,
   } = deps;
 
+  // ── Workdir switching timeout ──
+  let _workdirSwitchTimer = null;
+  function setWorkdirSwitching() {
+    workdirSwitching.value = true;
+    clearTimeout(_workdirSwitchTimer);
+    _workdirSwitchTimer = setTimeout(() => { workdirSwitching.value = false; }, 10000);
+  }
+
   // ── Session management ──
 
   let _sessionListTimer = null;
@@ -278,6 +286,7 @@ export function createSidebar(deps) {
       path = path.replace(/[/\\]$/, '') + sep + folderPickerSelected.value;
     }
     folderPickerOpen.value = false;
+    setWorkdirSwitching();
     wsSend({ type: 'change_workdir', workDir: path });
   }
 
@@ -316,6 +325,7 @@ export function createSidebar(deps) {
   }
 
   function switchToWorkdir(path) {
+    setWorkdirSwitching();
     wsSend({ type: 'change_workdir', workDir: path });
   }
 

package/web/style.css

@@ -1939,6 +1939,42 @@ body {
   color: var(--text-secondary);
 }
 
+/* ── Workdir switching overlay ── */
+.workdir-switching-overlay {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background: rgba(0, 0, 0, 0.45);
+  z-index: 1100;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+  backdrop-filter: blur(2px);
+}
+.workdir-switching-spinner {
+  width: 36px;
+  height: 36px;
+  border: 3px solid rgba(255, 255, 255, 0.2);
+  border-top-color: rgba(255, 255, 255, 0.8);
+  border-radius: 50%;
+  animation: workdir-spin 0.7s linear infinite;
+}
+@keyframes workdir-spin {
+  to { transform: rotate(360deg); }
+}
+.workdir-switching-text {
+  color: rgba(255, 255, 255, 0.9);
+  font-size: 0.9rem;
+  font-weight: 500;
+}
+.fade-enter-active, .fade-leave-active {
+  transition: opacity 0.2s ease;
+}
+.fade-enter-from, .fade-leave-to {
+  opacity: 0;
+}
+
 /* ── Folder Picker Modal ── */
 .folder-picker-overlay {
   position: fixed;
@@ -2618,6 +2654,40 @@ body {
   color: var(--text);
 }
 
+.preview-md-toggle {
+  background: none;
+  border: 1px solid var(--border);
+  border-radius: 4px;
+  cursor: pointer;
+  color: var(--text-secondary);
+  padding: 2px 6px;
+  line-height: 1;
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+.preview-md-toggle:hover {
+  color: var(--text);
+  border-color: var(--text-secondary);
+}
+
+.preview-md-toggle.active {
+  color: var(--accent, #6366f1);
+  border-color: var(--accent, #6366f1);
+  background: color-mix(in srgb, var(--accent, #6366f1) 10%, transparent);
+}
+
+.preview-header-actions {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.preview-markdown-rendered {
+  padding: 1rem;
+}
+
 .preview-panel-body {
   flex: 1;
   overflow: auto;