{items.map((a) => (
-
+ {isTabularFile(a.filename) ? (
+
+ ) : (
+
+ )}
handleOpen(a)}
@@ -210,6 +229,14 @@ export function TaskAttachments({
Add files
)}
+
+ {dataDialogPath && (
+
{ if (!open) setDataDialogPath(null) }}
+ filePath={dataDialogPath}
+ />
+ )}
)
}
diff --git a/src/renderer/src/components/ui/DataFileDialog.tsx b/src/renderer/src/components/ui/DataFileDialog.tsx
new file mode 100644
index 00000000..79691604
--- /dev/null
+++ b/src/renderer/src/components/ui/DataFileDialog.tsx
@@ -0,0 +1,35 @@
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/Dialog'
+import { DataFilePreview } from '@/components/ui/DataFilePreview'
+import { Table2 } from 'lucide-react'
+
+interface DataFileDialogProps {
+ open: boolean
+ onOpenChange: (open: boolean) => void
+ filePath: string
+}
+
+export function DataFileDialog({ open, onOpenChange, filePath }: DataFileDialogProps) {
+ const fileName = filePath.split('/').pop() || filePath.split('\\').pop() || filePath
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/src/renderer/src/components/ui/DataFilePreview.tsx b/src/renderer/src/components/ui/DataFilePreview.tsx
new file mode 100644
index 00000000..1e60d2c1
--- /dev/null
+++ b/src/renderer/src/components/ui/DataFilePreview.tsx
@@ -0,0 +1,241 @@
+import { useState, useEffect, useMemo, useCallback, useRef } from 'react'
+import { Table2, Maximize2, ArrowUpDown, ArrowUp, ArrowDown, AlertTriangle, Loader2 } from 'lucide-react'
+import { fileViewerApi } from '@/lib/ipc-client'
+import type { TabularData } from '@/types/electron'
+
+interface DataFilePreviewProps {
+ filePath: string
+ maxRows?: number
+ compact?: boolean
+ onExpand?: () => void
+}
+
+type SortDir = 'asc' | 'desc' | null
+
+function formatNumber(n: number): string {
+ return n.toLocaleString()
+}
+
+function formatCellValue(value: unknown): string {
+ if (value == null) return ''
+ if (typeof value === 'object') return JSON.stringify(value)
+ return String(value)
+}
+
+export function DataFilePreview({ filePath, maxRows = 100, compact = true, onExpand }: DataFilePreviewProps) {
+ const [data, setData] = useState
(null)
+ const [error, setError] = useState(null)
+ const [loading, setLoading] = useState(true)
+ const [sortCol, setSortCol] = useState(null)
+ const [sortDir, setSortDir] = useState(null)
+ const [filter, setFilter] = useState('')
+ const tableRef = useRef(null)
+
+ useEffect(() => {
+ let cancelled = false
+ setLoading(true)
+ setError(null)
+
+ fileViewerApi.readTabularFile(filePath, maxRows).then((result) => {
+ if (cancelled) return
+ if ('error' in result) {
+ setError(result.error)
+ } else {
+ setData(result)
+ }
+ setLoading(false)
+ }).catch((err) => {
+ if (cancelled) return
+ setError(err instanceof Error ? err.message : String(err))
+ setLoading(false)
+ })
+
+ return () => { cancelled = true }
+ }, [filePath, maxRows])
+
+ const handleSort = useCallback((col: string) => {
+ if (sortCol === col) {
+ setSortDir((prev) => prev === 'asc' ? 'desc' : prev === 'desc' ? null : 'asc')
+ if (sortDir === 'desc') setSortCol(null)
+ } else {
+ setSortCol(col)
+ setSortDir('asc')
+ }
+ }, [sortCol, sortDir])
+
+ const processedRows = useMemo(() => {
+ if (!data) return []
+ let rows = [...data.rows]
+
+ // Filter
+ if (filter) {
+ const lowerFilter = filter.toLowerCase()
+ rows = rows.filter((row) =>
+ data.columns.some((col) => {
+ const val = row[col]
+ return val != null && String(val).toLowerCase().includes(lowerFilter)
+ })
+ )
+ }
+
+ // Sort
+ if (sortCol && sortDir) {
+ rows.sort((a, b) => {
+ const aVal = a[sortCol]
+ const bVal = b[sortCol]
+ if (aVal == null && bVal == null) return 0
+ if (aVal == null) return 1
+ if (bVal == null) return -1
+
+ // Try numeric comparison
+ const aNum = Number(aVal)
+ const bNum = Number(bVal)
+ if (!isNaN(aNum) && !isNaN(bNum)) {
+ return sortDir === 'asc' ? aNum - bNum : bNum - aNum
+ }
+
+ // String comparison
+ const aStr = String(aVal)
+ const bStr = String(bVal)
+ return sortDir === 'asc' ? aStr.localeCompare(bStr) : bStr.localeCompare(aStr)
+ })
+ }
+
+ return rows
+ }, [data, sortCol, sortDir, filter])
+
+ const fileName = filePath.split('/').pop() || filePath.split('\\').pop() || filePath
+
+ if (loading) {
+ return (
+
+
+
+
+
+
+ No data in {fileName}
+
+
+ {/* Header */}
+
+
+
+
{fileName}
+
+ {formatNumber(data.totalRows)} rows {data.columns.length} cols
+
+
+
+ {!compact && (
+
+
+ )}
+
+
+
+ {/* Table */}
+
+
+
+
+ #
+ {data.columns.map((col) => (
+ handleSort(col)}
+ className="px-2.5 py-1.5 text-left font-medium text-muted-foreground cursor-pointer hover:text-foreground transition-colors select-none whitespace-nowrap"
+ >
+
+ {col}
+ {sortCol === col ? (
+ sortDir === 'asc' ?
+
+ ))}
+
+
+
+ {processedRows.map((row, i) => (
+
+ {i + 1}
+ {data.columns.map((col) => (
+
+ {formatCellValue(row[col])}
+
+ ))}
+
+ ))}
+
+
+
+
+ {/* Footer */}
+
+
+ Showing {formatNumber(processedRows.length)}{filter ? ` (filtered)` : ''} of {formatNumber(data.totalRows)} rows
+ {data.truncated && ' (truncated)'}
+
+ {compact && onExpand && (
+
+ View full table
+
+ )}
+
+
({ phase: 'idle' })
+ const [fullscreen, setFullscreen] = useState(false)
+ const [mode, setMode] = useState<'run' | 'edit'>('run')
+
+ const fileName = filePath.split('/').pop() || filePath
+
+ const launch = useCallback(async (launchMode: 'run' | 'edit' = mode) => {
+ setState({ phase: 'checking' })
+ try {
+ // Check if already running
+ const status = await marimoApi.status(filePath)
+ if (status.running && status.url) {
+ setState({ phase: 'running', url: status.url })
+ return
+ }
+
+ // Check if marimo is installed
+ const check = await marimoApi.check()
+ if (!check.installed) {
+ setState({ phase: 'not-installed' })
+ return
+ }
+
+ setState({ phase: 'launching' })
+ const result = await marimoApi.launch(filePath, launchMode)
+ setMode(launchMode)
+ setState({ phase: 'running', url: result.url })
+ } catch (err) {
+ setState({ phase: 'error', message: err instanceof Error ? err.message : String(err) })
+ }
+ }, [filePath, mode])
+
+ const stop = useCallback(async () => {
+ await marimoApi.stop(filePath)
+ setState({ phase: 'idle' })
+ setFullscreen(false)
+ }, [filePath])
+
+ // Check on mount if already running
+ useEffect(() => {
+ marimoApi.status(filePath).then((status) => {
+ if (status.running && status.url) {
+ setState({ phase: 'running', url: status.url })
+ }
+ }).catch(() => { /* ignore */ })
+ }, [filePath])
+
+ // Idle state — show launch button
+ if (state.phase === 'idle') {
+ return (
+
+
+
+
{fileName}
+
marimo notebook
+
+
launch('run')}
+ className="h-7 px-3 text-xs gap-1.5"
+ >
+
+
launch('edit')}
+ className="h-7 px-2 text-xs"
+ title="Open in edit mode"
+ >
+
+
+
+
+
+
+
+ {fileName}
+
+ marimo is not installed. Run: pip install marimo
+
+
+
+
+
+
+ {state.phase === 'checking' ? 'Checking marimo...' : `Starting marimo ${mode} server...`}
+
+
+
+
+
+
+ {state.message}
+
+
launch()} className="h-7 px-2 text-xs shrink-0">
+ Retry
+
+
+
+ {/* Toolbar */}
+
+
+
{fileName}
+
+
+
+ {mode === 'run' && (
+ { stop().then(() => launch('edit')) }}
+ className="h-6 px-2 text-[10px]"
+ title="Switch to edit mode"
+ >
+
+ )}
+ window.electronAPI.shell.openExternal(state.url)}
+ className="h-6 px-2 text-[10px]"
+ title="Open in browser"
+ >
+
+ {!fullscreen && (
+ setFullscreen(true)}
+ className="h-6 px-2 text-[10px]"
+ title="Fullscreen"
+ >
+
+ )}
+
+
+
+
+
+ {/* iframe */}
+
+
+ {!fullscreen && iframeContent}
+ {fullscreen && (
+
+ {fileName}
+
+
+ setFullscreen(false)}
+ className="ml-auto h-6 px-2 text-[10px]"
+ >
+
+
+ )}
+
+
+ {iframeContent}
+
+
+
+ )
+}
diff --git a/src/renderer/src/lib/ipc-client.ts b/src/renderer/src/lib/ipc-client.ts
index 63091dae..15bc4e94 100644
--- a/src/renderer/src/lib/ipc-client.ts
+++ b/src/renderer/src/lib/ipc-client.ts
@@ -1,5 +1,5 @@
import type { WorkfloTask, CreateTaskDTO, UpdateTaskDTO, FileAttachment, Agent, CreateAgentDTO, UpdateAgentDTO, McpServer, CreateMcpServerDTO, UpdateMcpServerDTO, Skill, CreateSkillDTO, UpdateSkillDTO, Secret, CreateSecretDTO, UpdateSecretDTO, TaskSource, CreateTaskSourceDTO, UpdateTaskSourceDTO, SyncResult, PluginMeta, ConfigFieldSchema, ConfigFieldOption, PluginAction, ActionResult, SourceUser, ReassignResult, MarketplaceSource, InstalledPlugin, DiscoverablePlugin, MarketplaceCatalog, PluginResources } from '@/types'
-import type { AgentOutputEvent, AgentOutputBatchEvent, AgentStatusEvent, AgentApprovalRequest, GhCliStatus, GitHubRepo, GitHubCollaborator, WorktreeProgressEvent, McpTestResult, SkillSyncResult, DepsStatus } from '@/types/electron'
+import type { AgentOutputEvent, AgentOutputBatchEvent, AgentStatusEvent, AgentApprovalRequest, GhCliStatus, GitHubRepo, GitHubCollaborator, WorktreeProgressEvent, McpTestResult, SkillSyncResult, DepsStatus, TabularDataResult, FileInfo, MarimoCheckResult, MarimoLaunchResult, MarimoStatusResult } from '@/types/electron'
export const taskApi = {
getAll: (): Promise => {
@@ -180,6 +180,42 @@ export const attachmentApi = {
download: (taskId: string, attachmentId: string): Promise => {
return window.electronAPI.attachments.download(taskId, attachmentId)
+ },
+
+ resolvePath: (taskId: string, attachmentId: string): Promise => {
+ return window.electronAPI.attachments.resolvePath(taskId, attachmentId)
+ }
+}
+
+export const fileViewerApi = {
+ getFileInfo: (filePath: string): Promise => {
+ return window.electronAPI.fileViewer.getFileInfo(filePath)
+ },
+
+ readTabularFile: (filePath: string, limit?: number): Promise => {
+ return window.electronAPI.fileViewer.readTabularFile(filePath, limit)
+ }
+}
+
+export const marimoApi = {
+ check: (): Promise => {
+ return window.electronAPI.marimo.check()
+ },
+
+ isNotebook: (filePath: string): Promise => {
+ return window.electronAPI.marimo.isNotebook(filePath)
+ },
+
+ launch: (filePath: string, mode?: 'run' | 'edit'): Promise => {
+ return window.electronAPI.marimo.launch(filePath, mode)
+ },
+
+ stop: (filePath: string): Promise => {
+ return window.electronAPI.marimo.stop(filePath)
+ },
+
+ status: (filePath: string): Promise => {
+ return window.electronAPI.marimo.status(filePath)
}
}
diff --git a/src/renderer/src/types/electron.d.ts b/src/renderer/src/types/electron.d.ts
index 17de4417..8ace9dae 100644
--- a/src/renderer/src/types/electron.d.ts
+++ b/src/renderer/src/types/electron.d.ts
@@ -133,6 +133,45 @@ export interface DepsStatus {
codexBinary: boolean
}
+export interface TabularData {
+ columns: string[]
+ rows: Record[]
+ totalRows: number
+ truncated: boolean
+ filePath: string
+}
+
+export interface TabularDataError {
+ error: string
+}
+
+export type TabularDataResult = TabularData | TabularDataError
+
+export interface FileInfo {
+ exists: boolean
+ size: number
+ extension: string
+ isTabular: boolean
+}
+
+export interface MarimoCheckResult {
+ installed: boolean
+ path: string | null
+ version: string | null
+}
+
+export interface MarimoLaunchResult {
+ url: string
+ port: number
+ pid: number
+}
+
+export interface MarimoStatusResult {
+ running: boolean
+ url: string | null
+ port: number | null
+}
+
interface ElectronAPI {
db: {
getTasks: () => Promise
@@ -185,6 +224,7 @@ interface ElectronAPI {
remove: (taskId: string, attachmentId: string) => Promise
open: (taskId: string, attachmentId: string) => Promise
download: (taskId: string, attachmentId: string) => Promise
+ resolvePath: (taskId: string, attachmentId: string) => Promise
}
shell: {
openPath: (filePath: string) => Promise
@@ -192,6 +232,17 @@ interface ElectronAPI {
readTextFile: (filePath: string) => Promise<{ content: string; size: number } | null>
openExternal: (url: string) => Promise
}
+ fileViewer: {
+ getFileInfo: (filePath: string) => Promise
+ readTabularFile: (filePath: string, limit?: number) => Promise
+ }
+ marimo: {
+ check: () => Promise
+ isNotebook: (filePath: string) => Promise
+ launch: (filePath: string, mode?: 'run' | 'edit') => Promise
+ stop: (filePath: string) => Promise
+ status: (filePath: string) => Promise
+ }
oauth: {
startFlow: (provider: string, config: Record) => Promise
exchangeCode: (provider: string, code: string, state: string, sourceId: string) => Promise