Add Transcript page

caleb531 · caleb531 · commit 2f952b4ff9c7 · 2026-02-24T14:25:04.000-08:00
In a future commit, we'll add a UI for choosing the output format.
diff --git a/desktop-app/src-tauri/capabilities/default.json b/desktop-app/src-tauri/capabilities/default.json
@@ -8,6 +8,14 @@
   "permissions": [
     "core:default",
     "opener:default",
+    {
+      "identifier": "opener:allow-open-path",
+      "allow": [
+        {
+          "path": "$DOWNLOAD/**"
+        }
+      ]
+    },
     {
       "identifier": "shell:allow-execute",
       "allow": [
diff --git a/desktop-app/src-tauri/src/lib.rs b/desktop-app/src-tauri/src/lib.rs
@@ -13,6 +13,8 @@ use {
     },
 };
 
+use std::path::{Path, PathBuf};
+
 #[cfg(target_os = "macos")]
 const CN_ENTITY_TYPE_CONTACTS: i64 = 0;
 #[cfg(target_os = "macos")]
@@ -260,13 +262,59 @@ unsafe fn ns_error_to_string(error: *mut Object) -> String {
     }
 }
 
+#[tauri::command]
+fn resolve_download_output_path(base_name: String) -> Result<String, String> {
+    if base_name.trim().is_empty() {
+        return Err("Output filename cannot be empty.".into());
+    }
+
+    let base_path = Path::new(&base_name);
+    if base_path.is_absolute() || base_path.components().count() > 1 {
+        return Err("Output filename must not include directory segments.".into());
+    }
+
+    let home_dir = std::env::var("HOME")
+        .map(PathBuf::from)
+        .map_err(|_| "Could not resolve HOME directory.".to_string())?;
+    let downloads_dir = home_dir.join("Downloads");
+
+    let stem = base_path
+        .file_stem()
+        .and_then(|value| value.to_str())
+        .filter(|value| !value.trim().is_empty())
+        .ok_or_else(|| "Output filename is invalid.".to_string())?;
+
+    let extension = base_path
+        .extension()
+        .and_then(|value| value.to_str())
+        .filter(|value| !value.trim().is_empty())
+        .unwrap_or("csv");
+
+    let mut index: usize = 0;
+    loop {
+        let candidate_name = if index == 0 {
+            format!("{stem}.{extension}")
+        } else {
+            format!("{stem}-{index}.{extension}")
+        };
+        let candidate_path = downloads_dir.join(candidate_name);
+        if !candidate_path.exists() {
+            return Ok(candidate_path.to_string_lossy().into_owned());
+        }
+        index += 1;
+    }
+}
+
 #[cfg_attr(mobile, tauri::mobile_entry_point)]
 pub fn run() {
     tauri::Builder::default()
         .plugin(tauri_plugin_store::Builder::new().build())
         .plugin(tauri_plugin_opener::init())
         .plugin(tauri_plugin_shell::init())
-        .invoke_handler(tauri::generate_handler![get_contact_names])
+        .invoke_handler(tauri::generate_handler![
+            get_contact_names,
+            resolve_download_output_path
+        ])
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
 }
diff --git a/desktop-app/src/components/Header.svelte b/desktop-app/src/components/Header.svelte
@@ -26,6 +26,7 @@
         <HeaderNavItem href="/attachment-totals">Attachment Totals</HeaderNavItem>
         <HeaderNavItem href="/most-frequent-emojis">Emojis</HeaderNavItem>
         <HeaderNavItem href="/totals-by-day">Totals by Day</HeaderNavItem>
+        <HeaderNavItem href="/transcript">Transcript</HeaderNavItem>
     </HeaderNav>
     <HeaderUtilities>
         <div class="app-header__contact">
diff --git a/desktop-app/src/components/InlineNotification.svelte b/desktop-app/src/components/InlineNotification.svelte
@@ -0,0 +1,32 @@
+<script lang="ts">
+    import {
+        InlineNotification as CarbonInlineNotification,
+        NotificationActionButton
+    } from 'carbon-components-svelte';
+
+    type CarbonInlineNotificationProps = InstanceType<
+        typeof CarbonInlineNotification
+    >['$$prop_def'];
+    type Props = Omit<CarbonInlineNotificationProps, 'lowContrast'> & {
+        actionLabel?: string;
+        onAction?: (event: MouseEvent) => void;
+    };
+
+    let { actionLabel, onAction, ...props }: Props = $props();
+</script>
+
+<CarbonInlineNotification
+    {...props}
+    lowContrast
+    on:close
+    on:click
+    on:mouseover
+    on:mouseenter
+    on:mouseleave
+>
+    {#if actionLabel}
+        <NotificationActionButton slot="actions" onclick={onAction}>
+            {actionLabel}
+        </NotificationActionButton>
+    {/if}
+</CarbonInlineNotification>
diff --git a/desktop-app/src/components/ResultGrid.svelte b/desktop-app/src/components/ResultGrid.svelte
@@ -5,7 +5,6 @@
         Button,
         DatePicker,
         DatePickerInput,
-        InlineNotification,
         Loading,
         TooltipIcon
     } from 'carbon-components-svelte';
@@ -14,6 +13,7 @@
     import '../styles/result-grid.css';
     import type { GridColumn } from '../types';
     import DateCell from './DateCell.svelte';
+    import InlineNotification from './InlineNotification.svelte';
     import NumberCell from './NumberCell.svelte';
 
     interface Props {
diff --git a/desktop-app/src/lib/cli.ts b/desktop-app/src/lib/cli.ts
@@ -4,9 +4,10 @@ import { getSelectedContact } from './contacts.svelte';
 import { runIcaSidecar, type SidecarResult } from './sidecar';
 
 const FORMAT_FLAGS = new Set(['--format', '-f']);
+const OUTPUT_FLAGS = new Set(['--output', '-o']);
 const CONTACT_FLAGS = new Set(['--contact', '-c']);
-const COMBINED_SHORT_FLAGS = new Set(['-c', '-f']);
-const COMBINED_LONG_FLAGS = new Set(['--contact', '--format']);
+const COMBINED_SHORT_FLAGS = new Set(['-c', '-f', '-o']);
+const COMBINED_LONG_FLAGS = new Set(['--contact', '--format', '--output']);
 
 export class MissingContactError extends Error {
     constructor(message = 'No contact selected. Choose a contact before running the analyzer.') {
@@ -30,6 +31,14 @@ export interface IcaCsvResult {
     args: string[];
 }
 
+export interface IcaCommandResult {
+    code: SidecarResult['code'];
+    signal: SidecarResult['signal'];
+    stderr: string;
+    stdout: string;
+    args: string[];
+}
+
 function toCamelCase(header: string, headerIndex: number): string {
     const cleaned = header.replace(/[^0-9A-Za-z]+/g, ' ').trim();
     if (!cleaned) {
@@ -120,6 +129,11 @@ function ensureCsvFormat(args: string[]): string[] {
     return [...withoutFormat, '--format', 'csv'];
 }
 
+function ensureOutputPath(args: string[], outputPath: string): string[] {
+    const withoutOutput = removeOption(args, OUTPUT_FLAGS);
+    return [...withoutOutput, '--output', outputPath];
+}
+
 function parseCsvOutput(
     rawCsv: string,
     finalArgs: string[]
@@ -245,6 +259,33 @@ export async function invokeIcaCsv(args: string | string[]): Promise<IcaCsvResul
     };
 }
 
+export async function invokeIcaCsvToFile(
+    args: string | string[],
+    outputPath: string
+): Promise<IcaCommandResult> {
+    const parsedArgs = parseArgInput(args);
+    const expandedArgs = expandKnownCombinedArgs(parsedArgs);
+    const argsWithContact = await addContactArgument(expandedArgs);
+    const csvArgs = ensureCsvFormat(argsWithContact);
+    const finalArgs = ensureOutputPath(csvArgs, outputPath);
+
+    const result = await runIcaSidecar(finalArgs);
+    const stderr = result.stderr.trim();
+    const stdout = result.stdout.trim();
+
+    if (result.code !== 0) {
+        throw new Error(stderr || stdout || `ICA exited with code ${result.code ?? 'unknown'}.`);
+    }
+
+    return {
+        code: result.code,
+        signal: result.signal,
+        stderr,
+        stdout,
+        args: finalArgs
+    };
+}
+
 export async function runMessageTotals(): Promise<IcaCsvResult> {
     return invokeIcaCsv(['message_totals']);
 }
diff --git a/desktop-app/src/routes/+layout.svelte b/desktop-app/src/routes/+layout.svelte
@@ -1,16 +1,14 @@
 <script lang="ts">
     import { Content, Theme } from 'carbon-components-svelte';
     import 'carbon-components-svelte/css/all.css';
-    import type { ThemeProps } from 'carbon-components-svelte/src/Theme/Theme.svelte';
     import Header from '../components/Header.svelte';
     import '../styles/colors.css';
     import '../styles/layout.css';
     import '../styles/utility-classes.css';
     const { children } = $props();
-    let theme: ThemeProps['theme'] = 'g100';
 </script>
 
-<Theme {theme}>
+<Theme theme="g100">
     <Header />
     <Content>
         <section>
diff --git a/desktop-app/src/routes/call-cli/+page.svelte b/desktop-app/src/routes/call-cli/+page.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-    import { Button, CodeSnippet, InlineNotification, TextInput } from 'carbon-components-svelte';
+    import { Button, CodeSnippet, TextInput } from 'carbon-components-svelte';
+    import InlineNotification from '../../components/InlineNotification.svelte';
     import { invokeIcaCsv, MissingContactError, type IcaCsvHeader } from '../../lib/cli';
 
     let icaArgs = $state('message_totals');
diff --git a/desktop-app/src/routes/set-contact/+page.svelte b/desktop-app/src/routes/set-contact/+page.svelte
@@ -1,8 +1,9 @@
 <script lang="ts">
     import { goto } from '$app/navigation';
-    import { Button, InlineNotification } from 'carbon-components-svelte';
+    import { Button } from 'carbon-components-svelte';
     import { onMount } from 'svelte';
     import ContactPicker from '../../components/ContactPicker.svelte';
+    import InlineNotification from '../../components/InlineNotification.svelte';
     import {
         ensureSelectedContactLoaded,
         selectedContact,
diff --git a/desktop-app/src/routes/transcript/+page.svelte b/desktop-app/src/routes/transcript/+page.svelte
@@ -0,0 +1,118 @@
+<script lang="ts">
+    import { invoke } from '@tauri-apps/api/core';
+    import { revealItemInDir } from '@tauri-apps/plugin-opener';
+    import { Button } from 'carbon-components-svelte';
+    import InlineNotification from '../../components/InlineNotification.svelte';
+    import { invokeIcaCsvToFile, MissingContactError } from '../../lib/cli';
+
+    const baseFilename = 'transcript.csv';
+
+    let isExporting = $state(false);
+    let errorMessage = $state('');
+    let successMessage = $state('');
+    let exportedFilePath = $state('');
+
+    async function exportTranscript(event: Event) {
+        event.preventDefault();
+        isExporting = true;
+        errorMessage = '';
+        successMessage = '';
+
+        try {
+            const outputPath = await invoke<string>('resolve_download_output_path', {
+                baseName: baseFilename
+            });
+            await invokeIcaCsvToFile(['transcript'], outputPath);
+            exportedFilePath = outputPath;
+            successMessage = `Transcript exported to ${outputPath}`;
+        } catch (error) {
+            if (error instanceof MissingContactError) {
+                errorMessage = error.message;
+            } else {
+                errorMessage = error instanceof Error ? error.message : String(error);
+            }
+        } finally {
+            isExporting = false;
+        }
+    }
+
+    async function openDownloads(event: Event) {
+        event.preventDefault();
+        if (!exportedFilePath) {
+            return;
+        }
+        try {
+            await revealItemInDir(exportedFilePath);
+        } catch (error) {
+            errorMessage = error instanceof Error ? error.message : String(error);
+        }
+    }
+</script>
+
+<section class="transcript-export">
+    <div class="transcript-export__content">
+        <header>
+            <h2>Transcript</h2>
+            <p class="transcript-export__description">
+                Export your full conversation transcript to CSV in Downloads. The filename will be
+                incremented when needed (for example, transcript-1.csv).
+            </p>
+        </header>
+
+        <form class="transcript-export__form" onsubmit={exportTranscript}>
+            <Button type="submit" kind="primary" disabled={isExporting}>
+                {isExporting ? 'Exporting…' : 'Export Transcript CSV'}
+            </Button>
+        </form>
+
+        {#if successMessage}
+            <div class="transcript-export__notification">
+                <InlineNotification
+                    kind="success"
+                    title="Export complete"
+                    subtitle={successMessage}
+                    actionLabel="Reveal in Finder"
+                    onAction={openDownloads}
+                />
+            </div>
+        {/if}
+
+        {#if errorMessage}
+            <div class="transcript-export__notification">
+                <InlineNotification kind="error" title="Export failed" subtitle={errorMessage} />
+            </div>
+        {/if}
+    </div>
+</section>
+
+<style>
+    .transcript-export {
+        align-items: center;
+    }
+
+    .transcript-export__content {
+        width: 100%;
+        max-width: 56rem;
+        margin: 0 auto;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+
+    .transcript-export__description {
+        max-width: 44rem;
+        margin: 0 auto;
+    }
+
+    .transcript-export__form {
+        margin-top: 1.5rem;
+    }
+
+    .transcript-export__notification {
+        width: 100%;
+        max-width: 56rem;
+        margin: 0 auto;
+        display: flex;
+        justify-content: center;
+    }
+</style>
