Skip to content

feat: new logs terminal - #3302

Open
ppatel9703 wants to merge 7 commits into
devfrom
app-logs-fe
Open

feat: new logs terminal#3302
ppatel9703 wants to merge 7 commits into
devfrom
app-logs-fe

Conversation

@ppatel9703

@ppatel9703 ppatel9703 commented Jun 9, 2026

Copy link
Copy Markdown
Contributor

Description

Two consumer surfaces for app-owner log visibility, replacing the old single polling-based "Logs" tab entirely: a live-tail Console panel docked in the code workspace next to Terminal, and a searchable Logs page under the app detail nav for historical search. Console talks directly to Monolith's websocket (Monolith#398); Logs talks to a new Semoss reactor (Semoss#2616) via runQuery. The old AppLogsPage/GetAppLogs-polling implementation is deleted — the delivery mechanism changed from client-side polling to server-pushed websocket, so that code no longer has anything to call.

Changes Made

packages/client/src/components/workspace/panels/workspace-console.tsx (new)
Live tail, docked in code-workspace.tsx's bottom border next to Terminal (component id "console").

  • Uses useInsight() (the same app-scoped insight the whole code workspace shares via SetContext) to get an insightId, then opens an InsightWebSocket (@semoss/sdk) directly — not the useWebSocket hook, since that hook only exposes a single lastMessage slot and a burst of history lines arriving faster than React flushes between them can silently overwrite each other.
  • Sends {"action":"watch","type":"app_logs","projectId":appId} once connected, guarded by a per-effect-invocation closure variable rather than a ref — a ref shared across React 18 dev-mode's mount→cleanup→mount cycle let a stale socket's status callback race the real one and silently suppress the watch() call.
  • Parses each line against AppLogManager's pattern (timestamp/level/logger/message) for structured, per-field-colored rendering; falls back to the raw string when a line doesn't match.
  • Client-side text filter and a level ToggleGroup, both over the already-buffered lines.
  • Lines over 500 characters collapse to a single truncated row with a click-to-expand chevron, so one oversized entry doesn't dominate the scrollback.
  • Styling uses real theme tokens (bg-muted/70 dark:bg-background, text-destructive, Tailwind dark: pairs for level colors) so it follows the app's actual light/dark setting, matching the existing terminal-console.tsx precedent — not a fixed-dark look.

packages/client/src/pages/app/app-logs-page.tsx (rewritten)
Searchable historical view under the app detail nav (Files/Logs/SMSS, owner-restricted). Search box + level ToggleGroup + paginated table (Time/Level/Source/Message), calling SearchAppLogs(...) via monolithStore.runQuery — same call pattern the audit log dashboard already uses. No live polling, no offset/nextOffset client-side bookkeeping — the reactor owns pagination via offset/limit/hasMore/totalMatches.

packages/client/src/utility/parse-app-log-line.ts (new)
Shared line-parsing + level-color logic, used by both Console and the Logs page so they render lines identically instead of duplicating the regex/color-mapping twice.

packages/client/src/components/code-workspace/code-workspace.tsx
Adds the "console" tab to the bottom border next to "terminal", plus a cached-layout injection effect (mirrors the existing insight-explorer one) so the tab appears for users whose FlexLayout state predates it, not just fresh layouts.

packages/client/src/components/workspace/panels/index.tsx
Re-exports WorkspaceConsole.

How to Test

  1. Open any app you own → code workspace → Console tab (next to Terminal). Confirm it connects (Live indicator), shows recent history immediately, and new activity streams in within ~2s.
  2. Toggle level filters and use the text filter — confirm they only affect what's displayed, not the connection.
  3. Trigger an oversized log line (e.g. a large file listing) — confirm it renders collapsed with an expand chevron instead of blowing up the scrollback.
  4. Toggle OS/app dark mode — confirm Console's colors follow it (it's using theme tokens, not a fixed dark look).
  5. Go to the app detail page → Logs tab. Search by text and by level, confirm results are correct and paginate via Previous/Next.
  6. As a non-owner (editor/read-only), confirm the Logs tab isn't visible, and Console's watch is rejected with an error if attempted directly.

Notes

  • How the three repos fit together: Console → Monolith's /insightSocket (live push). Logs page → Semoss's SearchAppLogsReactor (on-disk search, no DB). Both ultimately read the same file Semoss's AppLogManager writes.
  • Deliberately two separate surfaces rather than one: Console is ephemeral/live ("what's happening right now," scrollback dropped on unmount); Logs is durable-enough/searchable ("what happened before," bounded by app.log's own rotation).
  • Terminal itself is unchanged in this PR — a redesign of Terminal to match Console's visual treatment was discussed but is out of scope here.

Review Updates

Addressed the following from review:

  • workspace-console.tsx: fixed a level-filter bug — lines that don't match the structured log pattern (parsed as level: "OTHER", e.g. multi-line stack traces) or are TRACE-level had no corresponding toggle button, so they were silently and permanently hidden with no way to display them. Non-toggleable levels (OTHER/TRACE) now always render regardless of the active level filter.
  • Added data-testid to the level-filter ToggleGroupItems in both workspace-console.tsx and app-logs-page.tsx, and to the Previous/Next pagination buttons in app-logs-page.tsx, for consistency with the rest of the file.

@ppatel9703
ppatel9703 requested a review from a team as a code owner June 9, 2026 18:15
@snyk-io

snyk-io Bot commented Jun 24, 2026

Copy link
Copy Markdown

Snyk checks have passed. No issues have been found so far.

Status Scan Engine Critical High Medium Low Total (0)
Open Source Security 0 0 0 0 0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant