mulmoclaude 0.3.0 → 0.5.0

package/src/plugins/manageSource/index.ts

@@ -5,6 +5,7 @@ import View from "./View.vue";
 import Preview from "./Preview.vue";
 import { apiPost } from "../../utils/api";
 import { API_ROUTES } from "../../config/apiRoutes";
+import { makeUuid } from "../../utils/id";
 
 // Mirrors server/sources/types.ts#Source. Re-declared here so the
 // frontend doesn't have to import a server package.
@@ -46,14 +47,14 @@ const manageSourcePlugin: ToolPlugin<ManageSourceData> = {
     if (!result.ok) {
       return {
         toolName: TOOL_NAME,
-        uuid: crypto.randomUUID(),
+        uuid: makeUuid(),
         message: result.error,
       };
     }
     return {
       ...result.data,
       toolName: TOOL_NAME,
-      uuid: crypto.randomUUID(),
+      uuid: makeUuid(),
     };
   },
   isEnabled: () => true,

package/src/plugins/markdown/Preview.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="p-3 bg-purple-100 rounded overflow-hidden">
+  <div class="p-2 bg-purple-100 rounded overflow-hidden">
     <div class="text-sm text-gray-800 font-medium truncate">
       {{ displayTitle }}
     </div>

package/src/plugins/markdown/View.vue

@@ -1,49 +1,52 @@
 <template>
   <div class="markdown-container">
     <div v-if="loading" class="min-h-full p-8 flex items-center justify-center">
-      <div class="text-gray-500">Loading document...</div>
+      <div class="text-gray-500">{{ t("pluginMarkdown.loading") }}</div>
     </div>
     <div v-else-if="loadError && !markdownContent" class="min-h-full p-8 flex items-center justify-center">
-      <div class="load-error-banner" role="alert">⚠ Failed to load document: {{ loadError }}</div>
+      <div class="load-error-banner" role="alert">{{ t("pluginMarkdown.loadFailed", { error: loadError }) }}</div>
     </div>
     <div v-else-if="!markdownContent" class="min-h-full p-8 flex items-center justify-center">
-      <div class="text-gray-500">No markdown content available</div>
+      <div class="text-gray-500">{{ t("pluginMarkdown.noContent") }}</div>
     </div>
     <template v-else>
+      <div class="flex items-center justify-end gap-2 px-3 py-2 border-b border-gray-100 shrink-0">
+        <button
+          class="h-8 px-2.5 flex items-center gap-1 rounded bg-green-600 hover:bg-green-700 text-white text-sm disabled:opacity-60 disabled:cursor-not-allowed transition-colors"
+          :disabled="pdfDownloading"
+          @click="downloadPdf"
+        >
+          <span class="material-icons text-base">{{ pdfDownloading ? "hourglass_empty" : "download" }}</span>
+          {{ t("pluginMarkdown.pdf") }}
+        </button>
+        <span v-if="pdfError" class="text-xs text-red-500" :title="pdfError">{{ t("pluginMarkdown.pdfFailedShort") }}</span>
+      </div>
       <div v-if="loadError" class="load-error-banner" role="alert">
-        ⚠ Failed to refresh document: {{ loadError }} — showing last successfully loaded content.
+        {{ t("pluginMarkdown.refreshFailed", { error: loadError }) }}
       </div>
       <div class="markdown-content-wrapper">
         <div class="p-4">
-          <div class="header-row">
-            <h1 class="document-title">
-              {{ selectedResult.title || "Document" }}
-            </h1>
-            <div class="button-group">
-              <button class="download-btn download-btn-green" :disabled="pdfDownloading" @click="downloadPdf">
-                <span class="material-icons">{{ pdfDownloading ? "hourglass_empty" : "download" }}</span>
-                PDF
-              </button>
-            </div>
-            <span v-if="pdfError" class="text-xs text-red-500 self-center ml-2" :title="pdfError">⚠ PDF failed</span>
-          </div>
-          <div class="markdown-content prose prose-slate max-w-none" v-html="renderedHtml"></div>
+          <!-- Click delegation: a single listener on the wrapper picks
+               up every interactive checkbox inserted by v-html. We
+               cannot bind @click directly on each `<input>` because
+               v-html bypasses Vue's template compiler. -->
+          <div class="markdown-content prose prose-slate max-w-none" @click="onMarkdownClick" v-html="renderedHtml"></div>
         </div>
       </div>
 
       <div class="bottom-bar-wrapper">
         <details ref="sourceDetails" class="markdown-source" @toggle="onDetailsToggle">
-          <summary>Edit Markdown Source</summary>
+          <summary>{{ t("pluginMarkdown.editSource") }}</summary>
           <textarea v-model="editableMarkdown" class="markdown-editor" spellcheck="false"></textarea>
           <div class="editor-actions">
             <button class="apply-btn" :disabled="!hasChanges || saving" @click="applyMarkdown">
-              {{ saving ? "Saving..." : "Apply Changes" }}
+              {{ saving ? t("pluginMarkdown.saving") : t("pluginMarkdown.applyChanges") }}
             </button>
-            <button class="cancel-btn" @click="cancelEdit">Cancel</button>
+            <button class="cancel-btn" @click="cancelEdit">{{ t("pluginMarkdown.cancel") }}</button>
           </div>
-          <p v-if="saveError" class="save-error" role="alert">⚠ {{ saveError }}</p>
+          <p v-if="saveError" class="save-error" role="alert">{{ t("pluginMarkdown.saveError", { error: saveError }) }}</p>
         </details>
-        <button v-show="!editing" class="copy-btn" :title="copied ? 'Copied!' : 'Copy'" @click="copyText">
+        <button v-show="!editing" class="copy-btn" :title="copied ? t('pluginMarkdown.copiedLabel') : t('pluginMarkdown.copyLabel')" @click="copyText">
           <span class="material-icons">{{ copied ? "check" : "content_copy" }}</span>
         </button>
       </div>
@@ -53,15 +56,20 @@
 
 <script setup lang="ts">
 import { computed, ref, watch, nextTick } from "vue";
+import { useI18n } from "vue-i18n";
 import { marked } from "marked";
+
+const { t } = useI18n();
 import type { ToolResult } from "gui-chat-protocol";
 import { isFilePath, type MarkdownToolData } from "./definition";
 import { rewriteMarkdownImageRefs } from "../../utils/image/rewriteMarkdownImageRefs";
+import { findTaskLines, makeTasksInteractive, toggleTaskAt } from "../../utils/markdown/taskList";
 import { usePdfDownload } from "../../composables/usePdfDownload";
 import { apiGet, apiPut } from "../../utils/api";
 import { API_ROUTES } from "../../config/apiRoutes";
 import { useClipboardCopy } from "../../composables/useClipboardCopy";
-import { toSafeFilename } from "../../utils/files/filename";
+import { buildPdfFilename } from "../../utils/files/filename";
+import { useAppApi } from "../../composables/useAppApi";
 
 const props = defineProps<{
   selectedResult: ToolResult<MarkdownToolData>;
@@ -71,6 +79,8 @@ const emit = defineEmits<{
   updateResult: [result: ToolResult<MarkdownToolData>];
 }>();
 
+const appApi = useAppApi();
+
 const loading = ref(false);
 const saving = ref(false);
 // Human-readable message shown next to the Save button when a PUT
@@ -133,7 +143,12 @@ const renderedHtml = computed(() => {
   const raw = props.selectedResult.data?.markdown;
   const basePath = typeof raw === "string" && isFilePath(raw) ? raw.slice(0, raw.lastIndexOf("/")) : "";
   const withImages = rewriteMarkdownImageRefs(markdownContent.value, basePath);
-  return marked(withImages) as string;
+  // Strip the `disabled=""` attribute marked puts on GFM task
+  // checkboxes and tag them so `onMarkdownClick` can find them
+  // (#775). Inline content (no file backing) gets the same
+  // treatment so non-file-backed sessions still feel responsive,
+  // even though clicks there only update local state.
+  return makeTasksInteractive(marked(withImages) as string);
 });
 
 // Watch for scroll requests from viewState
@@ -178,9 +193,14 @@ const { pdfDownloading, pdfError, downloadPdf: rawDownloadPdf } = usePdfDownload
 async function downloadPdf() {
   if (!markdownContent.value) return;
   const prefix = props.selectedResult.data?.filenamePrefix;
-  const rawName = prefix || props.selectedResult.title || "document";
-  const title = toSafeFilename(rawName, "document");
-  await rawDownloadPdf(markdownContent.value, `${title}.pdf`);
+  const rawName = prefix || props.selectedResult.title || "";
+  const uuid = props.selectedResult.uuid;
+  const filename = buildPdfFilename({
+    name: rawName,
+    fallback: "document",
+    timestampMs: uuid ? appApi.getResultTimestamp(uuid) : undefined,
+  });
+  await rawDownloadPdf(markdownContent.value, filename);
 }
 
 async function applyMarkdown() {
@@ -189,16 +209,21 @@ async function applyMarkdown() {
 
   saveError.value = null;
 
-  // If file-based, save to server
+  // If file-based, save to server. The `raw` value is the
+  // workspace-relative path returned by the server, so we send it
+  // verbatim — the route accepts any depth under `artifacts/documents/`
+  // (e.g. the YYYY/MM partitions added in #764).
   if (isFilePath(raw)) {
     saving.value = true;
-    const filename = raw.replace(/^(artifacts\/documents|markdowns)\//, "");
-    const result = await apiPut<unknown>(API_ROUTES.plugins.updateMarkdown.replace(":filename", filename), {
+    const result = await apiPut<unknown>(API_ROUTES.plugins.updateMarkdown, {
+      relativePath: raw,
       markdown: editableMarkdown.value,
     });
     saving.value = false;
     if (!result.ok) {
-      saveError.value = `Save failed: ${result.error}`;
+      // Store the raw error; the template formats it via t() so locale
+      // switches re-render without double-translating.
+      saveError.value = result.error;
       return;
     }
   }
@@ -221,6 +246,114 @@ async function applyMarkdown() {
   if (sourceDetails.value) sourceDetails.value.open = false;
 }
 
+// ── Inline task-list checkbox toggle (#775) ──────────────────────
+//
+// Click delegation handler bound to the rendered viewer. When the
+// user clicks a GFM task checkbox we:
+//   1. compute the new source via `toggleTaskAt`
+//   2. update local state optimistically (v-html re-renders to match)
+//   3. for file-backed docs, queue a PUT through the existing
+//      `/api/markdowns/update` route
+//
+// Skipped while the source editor is open — the textarea has its own
+// edit/apply flow and a checkbox click would race with whatever the
+// user is typing.
+
+let taskPersistChain: Promise<unknown> = Promise.resolve();
+
+async function persistTaskMarkdown(relativePath: string, markdown: string): Promise<void> {
+  // Bail if the user navigated to a different result while this PUT
+  // was queued — the snapshot belongs to a document that's no longer
+  // on screen, and persisting it would clobber unrelated state.
+  if (props.selectedResult.data?.markdown !== relativePath) return;
+
+  const result = await apiPut<unknown>(API_ROUTES.plugins.updateMarkdown, {
+    relativePath,
+    markdown,
+  });
+
+  // The user may have switched results during the round-trip. Skip
+  // every state mutation past this point — the watcher on
+  // `selectedResult.data?.markdown` already loads the new document,
+  // and writing `saveError` / triggering a refetch here would touch
+  // unrelated state (or refetch the *new* doc, masking edits the
+  // user just made there).
+  if (props.selectedResult.data?.markdown !== relativePath) return;
+
+  if (!result.ok) {
+    saveError.value = result.error;
+    // Refetch synchronously inside the chain so subsequent queued
+    // clicks observe the canonical (server-side) markdown before
+    // computing their own toggle. Detaching this with `void` could
+    // let the refetch land after a newer click already wrote.
+    await fetchMarkdownContent();
+    return;
+  }
+  // Clear any stale error from a prior failed click.
+  saveError.value = null;
+}
+
+function onMarkdownClick(event: MouseEvent): void {
+  const target = event.target;
+  if (!(target instanceof HTMLInputElement)) return;
+  if (target.type !== "checkbox") return;
+  if (!target.classList.contains("md-task")) return;
+  if (editing.value) {
+    // Edit panel open — let the textarea own the source. Reverting
+    // here keeps the visual in sync with the still-untouched markdown.
+    target.checked = !target.checked;
+    return;
+  }
+
+  const root = event.currentTarget as HTMLElement;
+  const taskInputs = root.querySelectorAll<HTMLInputElement>("input.md-task");
+  const taskIndex = Array.from(taskInputs).indexOf(target);
+  if (taskIndex < 0) return;
+
+  // Cross-check: if the source-side walker sees a different number
+  // of tasks than `marked` rendered into the DOM, the index map
+  // can't be trusted. The most common cause is a `- [ ]`-shaped line
+  // inside a 4-space indented code block (the source walker treats
+  // it as a task; marked treats it as code) — toggling source by
+  // index would corrupt the file. Refuse all clicks when this
+  // happens.
+  const sourceTasks = findTaskLines(markdownContent.value);
+  if (sourceTasks.length !== taskInputs.length) {
+    target.checked = !target.checked;
+    saveError.value = t("pluginMarkdown.taskCountMismatch");
+    return;
+  }
+
+  const updated = toggleTaskAt(markdownContent.value, taskIndex);
+  if (updated === null) {
+    // Source/DOM drift — refuse to write something we can't trace.
+    target.checked = !target.checked;
+    return;
+  }
+
+  // Optimistic local update — v-html will re-render and the
+  // textarea (if anyone opens it next) sees the same content.
+  markdownContent.value = updated;
+  editableMarkdown.value = updated;
+
+  const raw = props.selectedResult.data?.markdown;
+  if (typeof raw === "string" && isFilePath(raw)) {
+    // Serialize PUTs so quick successive clicks don't race each
+    // other on the wire — the chain captures `updated` per click.
+    taskPersistChain = taskPersistChain.then(() => persistTaskMarkdown(raw, updated));
+  } else {
+    // Inline content — emit so the parent stores the edit.
+    emit("updateResult", {
+      ...props.selectedResult,
+      data: {
+        ...props.selectedResult.data,
+        markdown: updated,
+        pdfPath: undefined,
+      },
+    });
+  }
+}
+
 // Watch for external changes to selectedResult (when user clicks different result)
 watch(
   () => props.selectedResult.data?.markdown,
@@ -245,48 +378,6 @@ watch(
   min-height: 0;
 }
 
-.header-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 1em;
-}
-
-.document-title {
-  font-size: 2em;
-  margin: 0;
-}
-
-.button-group {
-  display: flex;
-  gap: 0.5em;
-}
-
-.download-btn {
-  padding: 0.5em 1em;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 0.9em;
-  display: flex;
-  align-items: center;
-  gap: 0.5em;
-}
-
-.download-btn-green {
-  background-color: #4caf50;
-}
-
-.download-btn .material-icons {
-  font-size: 1.2em;
-}
-
-.download-btn:disabled {
-  opacity: 0.6;
-  cursor: not-allowed;
-}
-
 .markdown-content :deep(h1) {
   font-size: 2rem;
   font-weight: bold;

package/src/plugins/markdown/definition.ts

@@ -9,12 +9,14 @@ export interface MarkdownToolData {
 }
 
 /** True when the `markdown` field is a workspace-relative file path
- *  rather than inline content. Covers both the post-#284 canonical
- *  path (`artifacts/documents/*.md`) and the legacy `markdowns/*.md`
- *  prefix for sessions whose jsonl hasn't been migrated yet. */
+ *  rather than inline content. Accepts only the canonical
+ *  `artifacts/documents/*.md` prefix now that server-side
+ *  `isMarkdownPath` agrees. Any legacy `markdowns/*.md` references
+ *  in old session JSONL must be migrated via
+ *  `scripts/migrate-legacy-artifact-paths.ts` (#773). */
 export function isFilePath(value: string): boolean {
   if (!value.endsWith(".md")) return false;
-  return value.startsWith("artifacts/documents/") || value.startsWith("markdowns/");
+  return value.startsWith("artifacts/documents/");
 }
 
 const toolDefinition: ToolDefinition = {

package/src/plugins/markdown/index.ts

@@ -6,6 +6,7 @@ import View from "./View.vue";
 import Preview from "./Preview.vue";
 import { apiPost } from "../../utils/api";
 import { API_ROUTES } from "../../config/apiRoutes";
+import { makeUuid } from "../../utils/id";
 
 const markdownPlugin: ToolPlugin<MarkdownToolData> = {
   toolDefinition,
@@ -15,14 +16,14 @@ const markdownPlugin: ToolPlugin<MarkdownToolData> = {
     if (!result.ok) {
       return {
         toolName: TOOL_NAME,
-        uuid: crypto.randomUUID(),
+        uuid: makeUuid(),
         message: result.error,
       };
     }
     return {
       ...result.data,
       toolName: TOOL_NAME,
-      uuid: crypto.randomUUID(),
+      uuid: makeUuid(),
     };
   },
 

package/src/plugins/presentForm/Preview.vue

@@ -0,0 +1,99 @@
+<template>
+  <div class="w-full h-full flex flex-col items-center justify-center p-4 bg-gradient-to-br from-blue-50 to-indigo-50 rounded-lg border-2 border-gray-200">
+    <div class="text-center">
+      <!-- Form Icon -->
+      <svg class="w-12 h-12 mx-auto mb-3 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+        />
+      </svg>
+
+      <!-- Form Title or Default -->
+      <h3 class="text-gray-900 font-bold text-lg mb-1 line-clamp-2">
+        {{ formData?.title || t("pluginPresentForm.fallbackTitle") }}
+      </h3>
+
+      <!-- Field Count -->
+      <p class="text-gray-600 text-sm mb-2">{{ t("pluginPresentForm.fieldCount", { count: fieldCount }, fieldCount) }}</p>
+
+      <!-- Completion Status -->
+      <div v-if="!isSubmitted" class="flex items-center justify-center gap-2">
+        <div class="w-32 h-2 bg-gray-200 rounded-full overflow-hidden">
+          <div class="h-full bg-blue-600 transition-all duration-300" :style="{ width: `${completionPercentage}%` }" />
+        </div>
+        <span class="text-xs text-gray-500">{{ `${completionPercentage}%` }}</span>
+      </div>
+
+      <!-- Submitted Badge -->
+      <div v-else class="inline-flex items-center gap-1 px-3 py-1 bg-green-100 text-green-700 rounded-full text-xs font-semibold">
+        <svg class="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
+          <path
+            fill-rule="evenodd"
+            d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
+            clip-rule="evenodd"
+          />
+        </svg>
+        {{ t("pluginPresentForm.submitted") }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from "vue";
+import { useI18n } from "vue-i18n";
+import type { ToolResult } from "gui-chat-protocol";
+import type { FormData } from "./types";
+
+const { t } = useI18n();
+
+interface FormViewState {
+  userResponses: Record<string, unknown>;
+  touched: string[];
+  submitted?: boolean;
+}
+
+const props = defineProps<{
+  result: ToolResult;
+}>();
+
+const formData = computed<FormData | null>(() => {
+  if (props.result?.toolName === "presentForm") {
+    return props.result.jsonData as FormData;
+  }
+  return null;
+});
+
+const viewState = computed<FormViewState | null>(() => {
+  return (props.result?.viewState as unknown as FormViewState) || null;
+});
+
+const fieldCount = computed(() => {
+  return formData.value?.fields.length || 0;
+});
+
+const isSubmitted = computed(() => {
+  return viewState.value?.submitted || false;
+});
+
+const completionPercentage = computed(() => {
+  if (!formData.value || isSubmitted.value) return 100;
+
+  const requiredFields = formData.value.fields.filter((field) => field.required);
+  if (requiredFields.length === 0) return 0;
+
+  const responses = viewState.value?.userResponses || {};
+  const filledRequired = requiredFields.filter((field) => {
+    const value = responses[field.id];
+    if (value === null || value === undefined) return false;
+    if (typeof value === "string") return value.trim() !== "";
+    if (Array.isArray(value)) return value.length > 0;
+    return true;
+  }).length;
+
+  return Math.round((filledRequired / requiredFields.length) * 100);
+});
+</script>