fix(web-analytics): remove floating AI button from filter bar - #73335
Conversation
The web analytics filter bar rendered the deprecated MaxTool floating "+" button pinned to the corner of the Filters control, which looked out of place between Filters and Presets and was reported as confusing. Convert the filter_web_analytics tool from the <MaxTool> wrapper component to the useMaxTool hook in WebAnalyticsAIFilters. The hook keeps the tool registered so PostHog AI can still drive web analytics filters, but renders no floating button - matching the scene's other tools (web_analytics_doctor, assess_heatmap, summarize_website_interactions), which already register hook-only. The sandbox-path AI integration (attached filter context and query-tool apply-back) is unchanged. Generated-By: PostHog Code Task-Id: 1683a138-460e-46d2-bc9d-3c0fea0f9bcf
🤖 CI report✅ Bundle size — no changeUncompressed size of every built Total: 64.69 MiB · no change No file changed by more than 1000 B. Posted automatically by build-bundle-size-report · uncompressed bytes from dist-report ✅ Eager graph — within budgetHow much code each root ships on the eager path — downloaded and parsed before the surface is interactive. Measured from the esbuild output chunks (post-tree-shake, static imports only); lazy
🟢 Largest files eagerly shipped from
|
| Size | File |
|---|---|
| 126.8 KiB | ../node_modules/.pnpm/react-dom@18.3.1_react@18.3.1/node_modules/react-dom/cjs/react-dom.production.min.js |
| 24.6 KiB | ../node_modules/.pnpm/buffer@6.0.3/node_modules/buffer/index.js |
| 6.3 KiB | ../node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react.production.min.js |
| 4.5 KiB | ../node_modules/.pnpm/@jspm+core@2.1.0/node_modules/@jspm/core/nodelibs/browser/process.js |
| 3.9 KiB | ../node_modules/.pnpm/scheduler@0.23.2/node_modules/scheduler/cjs/scheduler.production.min.js |
| 1.4 KiB | ../node_modules/.pnpm/base64-js@1.5.1/node_modules/base64-js/index.js |
| 1.3 KiB | src/RootErrorBoundary.tsx |
| 912 B | ../node_modules/.pnpm/ieee754@1.2.1/node_modules/ieee754/index.js |
| 789 B | src/scenes/ChunkLoadErrorBoundary.tsx |
| 762 B | src/index.tsx |
Largest files eagerly shipped from src/scenes/AuthenticatedShell.tsx
| Size | File |
|---|---|
| 281.5 KiB | ../node_modules/.pnpm/posthog-js@1.407.2/node_modules/posthog-js/dist/rrweb.js |
| 267.7 KiB | ../node_modules/.pnpm/@posthog+icons@0.38.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@posthog/icons/dist/posthog-icons.es.js |
| 236.0 KiB | src/taxonomy/core-filter-definitions-by-group.json |
| 226.1 KiB | ../node_modules/.pnpm/posthog-js@1.407.2/node_modules/posthog-js/dist/module.js |
| 167.1 KiB | src/queries/validators.js |
| 154.3 KiB | ../node_modules/.pnpm/re2js@0.4.1/node_modules/re2js/build/index.esm.js |
| 126.8 KiB | ../node_modules/.pnpm/react-dom@18.3.1_react@18.3.1/node_modules/react-dom/cjs/react-dom.production.min.js |
| 105.8 KiB | src/lib/api.ts |
| 94.0 KiB | ../packages/quill/packages/quill/dist/index.js |
| 93.3 KiB | ../node_modules/.pnpm/prosemirror-view@1.40.1/node_modules/prosemirror-view/dist/index.js |
Posted automatically by check-eager-graph · sizes are eager output bytes (shipped, post-tree-shake) from the esbuild metafile · part of #32479
✅ Toolbar bundle — eager 2.18 MiB within budget
What the toolbar ships to customer pages, measured from the esbuild output (minified, post-tree-shake). The eager set is the entry plus everything statically imported from it — fetched before any feature runs; deferred chunks load lazily. The eager guardrail is 5.72 MiB. Each output file must also stay below 10 MB, where CloudFront stops compressing it. The module boundary is enforced separately by check-toolbar-graph.
| Metric | Size | Δ vs base | Budget |
|---|---|---|---|
| Eager (shipped) entry + static imports |
2.18 MiB · 17 files | no change | ████░░░░░░ 38.1% of 5.72 MiB |
| Deferred (lazy) | 2.07 MiB · 33 files | no change | n/a — loads on demand |
Loader dist/toolbar.js |
1.1 KiB | no change | █░░░░░░░░░ 5.8% of 19.5 KiB |
Largest eagerly-shipped chunks
| Size | File |
|---|---|
| 713.9 KiB | dist/toolbar/toolbar-app-II7NJI66.css |
| 545.1 KiB | dist/toolbar/chunk-chunk-IBPHTYXM.js |
| 484.2 KiB | dist/toolbar/chunk-chunk-FBL6YDUC.js |
| 133.6 KiB | dist/toolbar/chunk-chunk-4DGG5QUN.js |
| 131.8 KiB | dist/toolbar/chunk-chunk-T5KY5WYR.js |
| 71.0 KiB | dist/toolbar/toolbar-app-76G36MIS.js |
| 69.0 KiB | dist/toolbar/chunk-chunk-27JL52RE.js |
| 35.6 KiB | dist/toolbar/chunk-chunk-3K5OMUGW.js |
| 20.9 KiB | dist/toolbar/chunk-chunk-KNBSAAO3.js |
| 12.2 KiB | dist/toolbar/chunk-chunk-PIK3PADE.js |
Posted automatically by check-toolbar-size · sizes are toolbar output bytes (shipped, post-tree-shake) from the esbuild metafile
✅ Dist folder size — 🔺 +153 B (+0.0%)
Total size of the built frontend/dist folder (all assets), compared against the base branch.
Total: 1358.72 MiB · 🔺 +153 B (+0.0%)
|
👋 Visual changes detected for this PR. Review and approve in PostHog Visual Review If these changes are unexpected, they may be caused by a flaky test or a broken snapshot on master. Don't approve — rerun the job or wait for a fix. |
🦔 Hogbox preview · ✅ ready▶ Open the preview
commit |
|
Reviews (1): Last reviewed commit: "fix(web-analytics): remove floating AI b..." | Re-trigger Greptile |
There was a problem hiding this comment.
Small, well-contained frontend change (converts a MaxTool wrapper to the equivalent useMaxTool hook to remove a floating button) verified against the hook's actual signature; author owns the code with strong familiarity and no outstanding concerns.
- Author wrote 79% of the modified lines and has 93 merged PRs in these paths (familiarity STRONG).
- 👍 on the PR from chatgpt-codex-connector[bot], greptile-apps[bot], hex-security-app[bot].
Gate mechanics and policy version
| Gate | Result | |
|---|---|---|
| prerequisites | ✓ | all clear |
| deny-list | ✓ | no deny categories matched |
| size | ✓ | 57L, 1F substantive — within ceiling |
| tier | ✓ | T1-agent / T1b-small (57L, 1F, single-area, fix) |
| stamphog 2.0.0b3 | .stamphog/policy.yml @ 3a9bff5 · reviewed head f570e92 |
Problem
The web analytics filter bar rendered a floating AI "+" button (the deprecated MaxTool affordance) pinned to the corner of the Filters control. It sat awkwardly between Filters and Presets and was reported as confusing and unwanted in web analytics.
Origin context (PostHog internal): https://posthog.slack.com/archives/C05LJK1N3CP/p1784832222370559
Changes
I converted the
filter_web_analyticstool from the<MaxTool>wrapper component to theuseMaxToolhook insideWebAnalyticsAIFilters. The hook still registers the tool with PostHog AI, so the assistant can keep driving web analytics filters, but it renders no floating button. This matches the scene's three other tools (web_analytics_doctor,assess_heatmap,summarize_website_interactions), which already register hook-only.The button is removed from both the default and the v2 / condensed filter bars. The sandbox-path AI integration (attached filter context and the
query-web-overview/query-web-statsapply-back) is untouched.How did you test this code?
This environment has no
node_modules, so I (Claude, via PostHog Code) could not run the frontend typecheck, lint, or Storybook locally. The change is type-compatible:useMaxTool's options are the sameToolRegistration-derived shape theMaxToolcomponent already accepted, andIconFilterwas already imported and is still used.No automated tests assert on the button. Two Storybook stories render the filter bar (
WebAnalyticsDashboard.stories.tsx,WebVitals.stories.tsx), so their visual snapshots will shift now that the button is gone. That is the expected result of this removal.Automatic notifications
Docs update
No docs reference this button, so nothing to update.
🤖 Agent context
Autonomy: Human-driven (agent-assisted)
I (Claude, via PostHog Code) made this change at Lucas's direction from a bug report that circled the "+" affordance in the web analytics filter bar.
The purple dashed "+" is the
MaxToolcomponent (IconPlusSmallin aborder-dashed border-aibutton positioned at the corner of whatever it wraps). It is not actually experiment-gated:getToolDefinition('filter_web_analytics')always resolves, so the button rendered unconditionally.Options considered: (1) drop the wrapper entirely, which would also deregister the tool and lose AI filtering; (2) pass
active={false}, which hides the button but leaves dead props; (3) convert to theuseMaxToolhook, keeping the tool available to PostHog AI while dropping the button. I chose (3) because it removes the reported clutter without reducing capability and matches the sibling tools in the same scene. No mandatory skills were triggered (no DRF, migration, generated-API-type, or test changes).Created with PostHog Code