File-based project save/load, AI chat formatting, text edit fix

Project files (.vtn):
- Save Project: serializes transcript, speakers, audio path to JSON file
- Open Project: loads .vtn file, restores audio/transcript/speakers
- User chooses filename and location via save dialog
- Replaces SQLite-based project persistence (DB commands remain for future use)
- Text edits update in-memory store immediately, persist on explicit save
- Fix Windows path separator in project name extraction

AI chat:
- Markdown rendering in assistant messages (headers, lists, bold, code)
- Better visual distinction with border-left accents
- Styled markdown elements for dark theme

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src-tauri/src/commands/project.rs

@@ -1,10 +1,48 @@
 use serde::{Deserialize, Serialize};
+use std::fs;
 use tauri::State;
 
 use crate::db::models::Project;
 use crate::db::queries;
 use crate::state::AppState;
 
+// ── File-based project types ────────────────────────────────────
+
+#[derive(Serialize, Deserialize)]
+pub struct ProjectFile {
+    pub version: u32,
+    pub name: String,
+    pub audio_file: String,
+    pub created_at: String,
+    pub segments: Vec<ProjectFileSegment>,
+    pub speakers: Vec<ProjectFileSpeaker>,
+}
+
+#[derive(Serialize, Deserialize)]
+pub struct ProjectFileSegment {
+    pub text: String,
+    pub start_ms: i64,
+    pub end_ms: i64,
+    pub speaker: Option<String>,
+    pub is_edited: bool,
+    pub words: Vec<ProjectFileWord>,
+}
+
+#[derive(Serialize, Deserialize)]
+pub struct ProjectFileWord {
+    pub word: String,
+    pub start_ms: i64,
+    pub end_ms: i64,
+    pub confidence: f64,
+}
+
+#[derive(Serialize, Deserialize)]
+pub struct ProjectFileSpeaker {
+    pub label: String,
+    pub display_name: Option<String>,
+    pub color: String,
+}
+
 // ── Input types for save_project_transcript ──────────────────────
 
 #[derive(Deserialize)]
@@ -243,3 +281,17 @@ pub fn load_project_transcript(
         speakers: speaker_outputs,
     }))
 }
+
+// ── File-based project commands ─────────────────────────────────
+
+#[tauri::command]
+pub fn save_project_file(path: String, project: ProjectFile) -> Result<(), String> {
+    let json = serde_json::to_string_pretty(&project).map_err(|e| e.to_string())?;
+    fs::write(&path, json).map_err(|e| format!("Failed to save project: {e}"))
+}
+
+#[tauri::command]
+pub fn load_project_file(path: String) -> Result<ProjectFile, String> {
+    let json = fs::read_to_string(&path).map_err(|e| format!("Failed to read project: {e}"))?;
+    serde_json::from_str(&json).map_err(|e| format!("Failed to parse project: {e}"))
+}

src-tauri/src/lib.rs

@@ -10,8 +10,8 @@ use tauri::Manager;
 use commands::ai::{ai_chat, ai_configure, ai_list_providers};
 use commands::export::export_transcript;
 use commands::project::{
-    create_project, delete_project, get_project, list_projects, load_project_transcript,
+    create_project, delete_project, get_project, list_projects, load_project_file,
-    save_project_transcript, update_segment,
+    load_project_transcript, save_project_file, save_project_transcript, update_segment,
 };
 use commands::settings::{load_settings, save_settings};
 use commands::system::{get_data_dir, llama_list_models, llama_start, llama_status, llama_stop};
@@ -41,6 +41,8 @@ pub fn run() {
             save_project_transcript,
             load_project_transcript,
             update_segment,
+            save_project_file,
+            load_project_file,
             transcribe_file,
             run_pipeline,
             download_diarize_model,

src/routes/+page.svelte

@@ -19,14 +19,12 @@
   let showSettings = $state(false);
 
   // Project management state
-  let currentProjectId = $state<string | null>(null);
+  let currentProjectPath = $state<string | null>(null);
   let currentProjectName = $state('');
-  let savedProjects = $state<Array<{id: string, name: string, created_at: string}>>([]);
+  let audioFilePath = $state('');
-  let showProjectMenu = $state(false);
 
   onMount(() => {
     loadSettings();
-    loadProjects();
 
     // Global keyboard shortcuts
     function handleKeyDown(e: KeyboardEvent) {
@@ -45,7 +43,6 @@
         showSettings = true;
       } else if (e.key === 'Escape') {
         showExportMenu = false;
-        showProjectMenu = false;
         showSettings = false;
       }
     }
@@ -58,11 +55,6 @@
           showExportMenu = false;
         }
       }
-      if (showProjectMenu) {
-        if (!target.closest('.project-dropdown')) {
-          showProjectMenu = false;
-        }
-      }
     }
 
     document.addEventListener('keydown', handleKeyDown);
@@ -83,57 +75,91 @@
   // Speaker color palette for auto-assignment
   const speakerColors = ['#e94560', '#4ecdc4', '#ffe66d', '#a8e6cf', '#ff8b94', '#c7ceea', '#ffd93d', '#6bcb77'];
 
-  async function loadProjects() {
+  async function saveProject() {
+    const defaultName = currentProjectName || 'Untitled';
+    const outputPath = await save({
+      defaultPath: `${defaultName}.vtn`,
+      filters: [{ name: 'Voice to Notes Project', extensions: ['vtn'] }],
+    });
+    if (!outputPath) return;
+
+    const projectData = {
+      version: 1,
+      name: outputPath.split(/[\\/]/).pop()?.replace('.vtn', '') || defaultName,
+      audio_file: audioFilePath,
+      created_at: new Date().toISOString(),
+      segments: $segments.map(seg => {
+        const speaker = $speakers.find(s => s.id === seg.speaker_id);
+        return {
+          text: seg.text,
+          start_ms: seg.start_ms,
+          end_ms: seg.end_ms,
+          speaker: speaker?.label ?? null,
+          is_edited: seg.is_edited,
+          words: seg.words.map(w => ({
+            word: w.word,
+            start_ms: w.start_ms,
+            end_ms: w.end_ms,
+            confidence: w.confidence ?? 0,
+          })),
+        };
+      }),
+      speakers: $speakers.map(s => ({
+        label: s.label,
+        display_name: s.display_name,
+        color: s.color || '#e94560',
+      })),
+    };
+
     try {
-      const projects = await invoke<Array<{id: string, name: string, created_at: string}>>('list_projects');
+      await invoke('save_project_file', { path: outputPath, project: projectData });
-      savedProjects = projects;
+      currentProjectPath = outputPath;
+      currentProjectName = projectData.name;
     } catch (err) {
-      console.error('Failed to load projects:', err);
+      console.error('Failed to save project:', err);
+      alert(`Failed to save: ${err}`);
     }
   }
 
-  async function loadProject(projectId: string) {
+  async function openProject() {
+    const filePath = await open({
+      filters: [{ name: 'Voice to Notes Project', extensions: ['vtn'] }],
+      multiple: false,
+    });
+    if (!filePath) return;
+
     try {
-      const result = await invoke<{
+      const project = await invoke<{
-        project_id: string;
+        version: number;
         name: string;
-        file_path: string;
+        audio_file: string;
         segments: Array<{
           text: string;
           start_ms: number;
           end_ms: number;
           speaker: string | null;
-          words: Array<{
+          is_edited: boolean;
-            word: string;
+          words: Array<{ word: string; start_ms: number; end_ms: number; confidence: number }>;
-            start_ms: number;
-            end_ms: number;
-            confidence: number;
-          }>;
         }>;
-        speakers: string[];
+        speakers: Array<{ label: string; display_name: string | null; color: string }>;
-      }>('load_project_transcript', { projectId });
+      }>('load_project_file', { path: filePath });
-
-      // Set project info
-      currentProjectId = result.project_id;
-      currentProjectName = result.name;
 
       // Rebuild speakers
-      const newSpeakers: Speaker[] = (result.speakers || []).map((label, idx) => ({
+      const newSpeakers: Speaker[] = project.speakers.map((s, idx) => ({
         id: `speaker-${idx}`,
-        project_id: result.project_id,
+        project_id: '',
-        label,
+        label: s.label,
-        display_name: null,
+        display_name: s.display_name,
-        color: speakerColors[idx % speakerColors.length],
+        color: s.color,
       }));
       speakers.set(newSpeakers);
 
-      // Build speaker label -> id lookup
       const speakerLookup = new Map(newSpeakers.map(s => [s.label, s.id]));
 
       // Rebuild segments
-      const newSegments: Segment[] = result.segments.map((seg, idx) => ({
+      const newSegments: Segment[] = project.segments.map((seg, idx) => ({
         id: `seg-${idx}`,
-        project_id: result.project_id,
+        project_id: '',
         media_file_id: '',
         speaker_id: seg.speaker ? (speakerLookup.get(seg.speaker) ?? null) : null,
         start_ms: seg.start_ms,
@@ -141,7 +167,7 @@
         text: seg.text,
         original_text: null,
         confidence: null,
-        is_edited: false,
+        is_edited: seg.is_edited,
         edited_at: null,
         segment_index: idx,
         words: seg.words.map((w, widx) => ({
@@ -156,44 +182,27 @@
       }));
       segments.set(newSegments);
 
-      // Load audio from saved file path
+      // Load audio
-      if (result.file_path) {
+      audioFilePath = project.audio_file;
-        audioUrl = convertFileSrc(result.file_path);
+      audioUrl = convertFileSrc(project.audio_file);
-        waveformPlayer?.loadAudio(audioUrl);
+      waveformPlayer?.loadAudio(audioUrl);
-      }
 
-      showProjectMenu = false;
+      currentProjectPath = filePath as string;
+      currentProjectName = project.name;
     } catch (err) {
       console.error('Failed to load project:', err);
       alert(`Failed to load project: ${err}`);
     }
   }
 
-  async function deleteProject(projectId: string) {
-    try {
-      await invoke('delete_project', { projectId });
-      await loadProjects();
-      if (currentProjectId === projectId) {
-        currentProjectId = null;
-        currentProjectName = '';
-      }
-    } catch (err) {
-      console.error('Failed to delete project:', err);
-      alert(`Failed to delete project: ${err}`);
-    }
-  }
-
   function handleWordClick(timeMs: number) {
     console.log('[voice-to-notes] Word clicked, seeking to', timeMs, 'ms');
     waveformPlayer?.seekTo(timeMs);
   }
 
-  async function handleTextEdit(segmentId: string, newText: string) {
+  function handleTextEdit(segmentId: string, newText: string) {
-    try {
+    // In-memory store is already updated by TranscriptEditor.
-      await invoke('update_segment', { segmentId, newText });
+    // Changes persist when user saves the project file.
-    } catch (err) {
-      console.error('Failed to save segment edit:', err);
-    }
   }
 
   async function handleFileImport() {
@@ -207,7 +216,8 @@
     });
     if (!filePath) return;
 
-    // Convert file path to asset URL for wavesurfer
+    // Track the original file path and convert to asset URL for wavesurfer
+    audioFilePath = filePath;
     audioUrl = convertFileSrc(filePath);
     waveformPlayer?.loadAudio(audioUrl);
 
@@ -367,27 +377,10 @@
 
       segments.set(newSegments);
 
-      // Auto-save project
+      // Set project name from audio file name (user can save explicitly)
-      try {
+      const fileName = filePath.split(/[\\/]/).pop() || 'Untitled';
-        const fileName = filePath.split(/[\\/]/).pop() || 'Untitled';
+      currentProjectName = fileName.replace(/\.[^.]+$/, '');
-        const projectName = fileName.replace(/\.[^.]+$/, '');
+      currentProjectPath = null;
-        const projectId = await invoke<string>('create_project', { name: projectName });
-        await invoke('save_project_transcript', {
-          projectId,
-          filePath,
-          segments: result.segments,
-          speakers: result.speakers.map((label, idx) => ({
-            label,
-            display_name: null,
-            color: speakerColors[idx % speakerColors.length],
-          })),
-        });
-        currentProjectId = projectId;
-        currentProjectName = projectName;
-        await loadProjects();
-      } catch (saveErr) {
-        console.error('Auto-save failed:', saveErr);
-      }
     } catch (err) {
       console.error('Pipeline failed:', err);
       alert(`Pipeline failed: ${err}`);
@@ -461,33 +454,14 @@
   <div class="app-header">
     <h1>Voice to Notes</h1>
     <div class="header-actions">
-      <div class="project-dropdown">
+      <button class="settings-btn" onclick={openProject} disabled={isTranscribing}>
-        <button class="project-btn" onclick={() => showProjectMenu = !showProjectMenu}>
+        Open Project
-          {currentProjectName ? `Project: ${currentProjectName}` : 'No project'}
+      </button>
+      {#if $segments.length > 0}
+        <button class="settings-btn" onclick={saveProject}>
+          Save Project
         </button>
-        {#if showProjectMenu}
+      {/if}
-          <div class="project-menu">
-            {#if savedProjects.length === 0}
-              <div class="project-empty">No saved projects</div>
-            {:else}
-              {#each savedProjects as project}
-                <div class="project-item">
-                  <button class="project-option" onclick={() => loadProject(project.id)}>
-                    {project.name}
-                  </button>
-                  <button
-                    class="project-delete"
-                    onclick={(e) => { e.stopPropagation(); deleteProject(project.id); }}
-                    title="Delete project"
-                  >
-                    &times;
-                  </button>
-                </div>
-              {/each}
-            {/if}
-          </div>
-        {/if}
-      </div>
       <button class="import-btn" onclick={handleFileImport} disabled={isTranscribing}>
         {#if isTranscribing}
           Processing...
@@ -591,10 +565,14 @@
     cursor: pointer;
     font-size: 0.875rem;
   }
-  .settings-btn:hover {
+  .settings-btn:hover:not(:disabled) {
     background: rgba(255,255,255,0.05);
     border-color: #e94560;
   }
+  .settings-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
   .export-dropdown {
     position: relative;
   }
@@ -637,78 +615,6 @@
   .export-option:hover {
     background: rgba(233, 69, 96, 0.2);
   }
-  .project-dropdown {
-    position: relative;
-  }
-  .project-btn {
-    background: #0f3460;
-    border: 1px solid #4a5568;
-    color: #e0e0e0;
-    padding: 0.5rem 1rem;
-    border-radius: 6px;
-    cursor: pointer;
-    font-size: 0.875rem;
-    font-weight: 500;
-    max-width: 200px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-  .project-btn:hover {
-    background: #1a4a7a;
-  }
-  .project-menu {
-    position: absolute;
-    top: 100%;
-    right: 0;
-    margin-top: 0.25rem;
-    background: #16213e;
-    border: 1px solid #4a5568;
-    border-radius: 6px;
-    overflow: hidden;
-    z-index: 10;
-    min-width: 220px;
-    max-height: 300px;
-    overflow-y: auto;
-  }
-  .project-empty {
-    padding: 0.5rem 1rem;
-    color: #888;
-    font-size: 0.8rem;
-  }
-  .project-item {
-    display: flex;
-    align-items: center;
-  }
-  .project-option {
-    flex: 1;
-    background: none;
-    border: none;
-    color: #e0e0e0;
-    padding: 0.5rem 1rem;
-    text-align: left;
-    cursor: pointer;
-    font-size: 0.8rem;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-  .project-option:hover {
-    background: rgba(233, 69, 96, 0.2);
-  }
-  .project-delete {
-    background: none;
-    border: none;
-    color: #888;
-    padding: 0.5rem 0.75rem;
-    cursor: pointer;
-    font-size: 1rem;
-    line-height: 1;
-    flex-shrink: 0;
-  }
-  .project-delete:hover {
-    color: #e94560;
-  }
   .app-shell {
     display: flex;
     flex-direction: column;