New HelpIcon component + a DocsNavProvider context (webapp/src/lib/docsNav.tsx) let any component request "open Docs to section X", bumping a nonce each time so a repeat click re-triggers even if Docs is already open to that section. NavMenu forwards that request into DocsPanel as a `target` prop, which expands the right accordion section, scrolls it into view, and flashes it (a brief accent-tinted background/border, settling back after 1.2s) — verified visually with a live server + Playwright. Opening Docs via the plain NavMenu button explicitly clears any pending target, so that path is unchanged: no forced section, no flash. Added a "?" icon to FilterBar, LogTimeline, LogPreview, Metrics, Dashboards, and NavMenu's own Settings/Presets panels, plus new Docs sections for Timeline, Log preview, Settings, and Presets (previously undocumented). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XFUNZwCvz3kcod3352ZR2o
22 lines
774 B
TypeScript
22 lines
774 B
TypeScript
import { useDocsNav } from '../lib/docsNav'
|
|
|
|
/**
|
|
* A small "?" affordance that opens the Docs panel scrolled to (and
|
|
* flashing) a specific section (ticket 021), instead of the user having to
|
|
* find it themselves in the Docs accordion.
|
|
*/
|
|
export function HelpIcon({ sectionId, label }: { sectionId: string; label?: string }) {
|
|
const { openSection } = useDocsNav()
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={() => openSection(sectionId)}
|
|
title="Open docs"
|
|
aria-label={label ?? 'Open docs for this section'}
|
|
className="flex h-4 w-4 shrink-0 items-center justify-center rounded-full border border-border-soft text-[10px] leading-none text-text-faint hover:border-border-strong hover:text-text-secondary"
|
|
>
|
|
?
|
|
</button>
|
|
)
|
|
}
|