# Bolt — Telemetry Explorer

**GitHub repo:** `saravanakumardb/temp_bolt-telemetry-explorer`

## Push Instructions

- Push directly to `main` — do NOT open a PR
- Only modify files in this repo

## Rules

- No `console.log`
- No network calls — mock data / localStorage only
- No hardcoded colors — no hex, no rgb/rgba/hsl, no `bg-[#123456]` Tailwind classes
- Do NOT commit `.env*`, `.next/`, `node_modules/`, `.vercel/`
- pnpm only
- `pnpm run check` must pass (`tsc --noEmit` + `eslint`)
- `pnpm run build` must pass (`next build --webpack`)

## CSS Token Contract

Define in `src/app/globals.css` under `:root` (add `.dark` override):

- `--ux-bg` — page background
- `--ux-surface` — card/panel surface
- `--ux-surface-2` — elevated surface
- `--ux-border` — borders
- `--ux-text` — primary text
- `--ux-text-muted` — secondary text
- `--ux-accent` — primary accent
- `--ux-accent-foreground` — text on accent
- `--ux-danger` — destructive/error
- `--ux-warning` — warning
- `--ux-success` — success
- `--ux-ring` — focus ring
- `--ux-shadow` — shadows

Use only via Tailwind: `bg-[var(--ux-surface)]`, `text-[var(--ux-text)]`, `border-[var(--ux-border)]`

## Component Architecture

- Reusable components → `src/components/`
- Pages in `src/app/**` compose components only
- Components must NOT import from `src/app/**`

## Stack

- Next.js 16 App Router, React 19, TypeScript strict
- TailwindCSS v4, pnpm

## Mission

Build a **Telemetry Explorer** micro-app that loads a local JSON dataset and provides an observability-console-like exploration experience. Inspiration for improving Admin "Client Logs".

## Data Source

Include `src/data/sample-events.json` with ~200 mock events:
`id`, `timestamp`, `productId`, `platform`, `osFamily`, `appVersion`, `eventType`, `module`, `eventName`, `requestId?`, `userId?`, `installId?`, `severity?`, `errorMessage?`, `metadata` (object)

## Pages

- `/` overview + stats
- `/explore` main explorer
- `/clusters` client-side error grouping

## Explorer

- Faceted filters: platform, eventType, module, eventName, severity
- Date range, free-text search, active filter chips + clear all
- Save/load filter presets (localStorage)
- Table/list toggle
- Row click → detail drawer (Overview, Raw JSON, Related by requestId/installId)
- Copy requestId, copy JSON
- Filters reflected in URL query params (shareable)

## Clusters

- Group by `eventName + errorMessage` fingerprint
- Show: count, lastSeen, sample message
- Click cluster → list example events

## Verification

```
pnpm install && pnpm run check && pnpm run build
```