• Mohamed Aziz Mejri's avatar
    Automatically read logs as tool-call (#2012) · 66421906
    Mohamed Aziz Mejri 提交于
    <!-- This is an auto-generated description by cubic. -->
    ---
    ## Summary by cubic
    Add a central log store and a new read_logs tool so the agent can fetch
    recent client, server, build-time, and network logs on demand, with a
    dyad-read-logs UI tag that shows progress and results in chat. This
    improves debugging by giving the agent a filtered snapshot of logs at
    the time of the call.
    
    - **New Features**
      - Central in-memory log store (per app, capped at 1000 entries).
    - PreviewIframe and runtime forward client, network, build-time, and
    server logs to the store via IPC; Supabase logs included.
    - New read_logs agent tool with filters: type, level, searchTerm, limit;
    returns a formatted snapshot and emits dyad-read-logs with results.
    - Added dyad-read-logs custom tag and DyadLogs component for collapsible
    output with pending/aborted indicators and result counts.
    - New IPC channels (add-log, clear-logs) whitelisted in preload, handled
    in main, and exposed via IpcClient.addLog and clearLogs.
      - E2E test for local agent validates filtered log reads.
    
    - **Bug Fixes**
    - Fixed missing forwarding of network-error logs from PreviewIframe to
    the central store.
    - Clear logs on app restart and deletion to prevent stale data and
    memory growth.
    
    <sup>Written for commit ab52f494158cea54f5e996349097abb597b1fd92.
    Summary will update on new commits.</sup>
    
    <!-- End of auto-generated description by cubic. -->
    
    <!-- greptile_comment -->
    
    <h3>Greptile Summary</h3>
    
    
    - Implements centralized log store and `read_logs` agent tool enabling
    AI to fetch console logs on demand for debugging with comprehensive
    filtering options (time window, log type, level, source name, search
    terms)
    - Integrates log collection from client console, network events, and
    server stdout/stderr through IPC channels, forwarding logs to main
    process store with 1000-entry circular buffer per app
    - Adds `dyad-read-logs` UI component for collapsible log display in chat
    with proper state management and visual indicators for
    pending/aborted/completed states
    
    <h3>Important Files Changed</h3>
    
    
    | Filename | Overview |
    |----------|----------|
    | `src/components/preview_panel/PreviewIframe.tsx` | Forwards client
    console and network events to central log store; network-error events
    missing `IpcClient.addLog()` call |
    | `src/pro/main/ipc/handlers/local_agent/tools/read_logs.ts` | New
    read_logs tool with comprehensive filtering, smart stack trace
    truncation, and direct log store access |
    | `src/ipc/handlers/app_handlers.ts` | Added server stdout/stderr to log
    store and registered add-log IPC handler; entry parameter uses `any`
    type instead of `ConsoleEntry` |
    | `src/lib/log_store.ts` | New central in-memory log store with circular
    buffer; duplicate `ConsoleEntry` type definition exists |
    
    <h3>Confidence score: 4/5</h3>
    
    
    - This PR requires attention before merging due to incomplete log
    forwarding that could impact debugging effectiveness
    - Score reduced due to missing network-error log forwarding in
    `PreviewIframe.tsx` lines 414-428, type safety issue in
    `app_handlers.ts` using `any` instead of proper typing, and duplicate
    type definitions that need consolidation
    - Pay close attention to
    `src/components/preview_panel/PreviewIframe.tsx` network-error handler
    and `src/ipc/handlers/app_handlers.ts` type definitions
    
    <h3>Sequence Diagram</h3>
    
    ```mermaid
    sequenceDiagram
        participant User as User
        participant IFrame as PreviewIframe<br/>(Client)
        participant IPC as IpcClient
        participant Main as app_handlers<br/>(Main Process)
        participant LogStore as LogStore
        participant Agent as read_logs tool
        participant UI as DyadReadLogs<br/>(Chat Component)
    
        Note over User,UI: Log Collection Flow
        
        User->>IFrame: "Triggers network/console event"
        IFrame->>IFrame: "Handles event (console-log, network-request, etc.)"
        IFrame->>IPC: "addLog(logEntry)"
        IPC->>Main: 'invoke("add-log", entry)'
        Main->>LogStore: "addLog(entry)"
        LogStore->>LogStore: "Store in Map<appId, ConsoleEntry[]>"
        
        Note over User,UI: Server Log Collection
        Main->>Main: "Process stdout/stderr from app"
        Main->>LogStore: "addLog(serverLogEntry)"
        
        Note over User,UI: Agent Tool Flow
        User->>Agent: "Agent executes read_logs tool"
        Agent->>LogStore: "getLogs(appId)"
        LogStore-->>Agent: "ConsoleEntry[]"
        Agent->>Agent: "Filter by time/type/level/search"
        Agent->>Agent: "Format logs for AI consumption"
        Agent-->>UI: '<dyad-read-logs> XML tag'
        UI->>UI: "Render collapsible log viewer"
    ```
    
    <!-- greptile_other_comments_section -->
    
    **Context used:**
    
    - Context from `dashboard` - .cursor/rules/ipc.mdc
    ([source](https://app.greptile.com/review/custom-context?memory=92de190d-1eac-4167-a0e4-35db6533fe3d))
    - Context from `dashboard` - AGENTS.md
    ([source](https://app.greptile.com/review/custom-context?memory=32c86e9e-6a00-48f2-ac32-69590e8d298c))
    
    <!-- /greptile_comment -->
    
    <!-- CURSOR_SUMMARY -->
    ---
    
    > [!NOTE]
    > Adds an in-memory, per-app log store and wires all major sources into
    it, enabling the agent to fetch filtered log snapshots and render them
    in chat.
    > 
    > - New central store `lib/log_store.ts` with
    `addLog`/`getLogs`/`clearLogs` and `ConsoleEntry` moved to
    `ipc/ipc_types.ts`
    > - IPC: preload whitelists `add-log` and `clear-logs`; main handlers in
    `app_handlers.ts`; renderer API via `IpcClient.addLog`/`clearLogs`
    > - Log producers now forward to store:
    > - `PreviewIframe.tsx`: client console, network request/response/error,
    runtime errors; also keeps UI atom in sync
    > - `useRunApp.ts`: build-time and client-error logs; restart clears
    logs via IPC
    >   - `app_handlers.ts`: server stdout/stderr appended to store
    >   - `useSupabase.ts`: edge function logs appended to store
    > - New agent tool `read_logs` (`pro/main/.../tools/read_logs.ts`) with
    filters (`type`, `level`, `searchTerm`, `limit`), formats results, and
    emits `<dyad-read-logs>` with counts
    > - Chat UI: `DyadLogs` component and parser updates to render
    collapsible results (`dyad-read-logs`)
    > - E2E: fixture and spec validate filtered log reads in local-agent
    mode
    > 
    > <sup>Written by [Cursor
    Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
    d77e209c269ad2de80e2c57ed0c8824a288244a2. This will update automatically
    on new commits. Configure
    [here](https://cursor.com/dashboard?tab=bugbot).</sup>
    <!-- /CURSOR_SUMMARY -->
    66421906
DyadMarkdownParser.tsx 15.8 KB