feat(canvas): add welcome greeting to channel home template#2875
feat(canvas): add welcome greeting to channel home template#2875raquelmsmith wants to merge 1 commit into
Conversation
Seed the channel home canvas with an intro header above the Canvases / Inbox / Tasks cards: a "Welcome to #channel-name." heading, a line explaining the space (Canvases for dashboards/apps, Tasks for agents), and a hint that the page is itself an editable canvas. The channel name is resolved at runtime from the channel id so renames stay correct. Generated-By: PostHog Code Task-Id: de6d1634-3f96-4c84-9916-a9ff49e4aa83
|
React Doctor found no issues in the changed files. 🎉 Reviewed by React Doctor for commit |
|
Reviews (1): Last reviewed commit: "feat(canvas): add welcome greeting to ch..." | Re-trigger Greptile |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| void resolveChannelPath().then((path) => { | ||
| if (alive && path) setName(lastSegment(path)); | ||
| }); |
There was a problem hiding this comment.
useChannelName uses void promise.then(...) without a .catch(), so if ph.query throws (e.g., the system table isn't yet available), a silent unhandled promise rejection fires. useChannelRows — the existing peer hook that calls the same resolveChannelPath — wraps the entire async block in a try/catch. The missing guard is inconsistent and can emit noise or trigger unhandledrejection listeners in the sandbox.
| void resolveChannelPath().then((path) => { | |
| if (alive && path) setName(lastSegment(path)); | |
| }); | |
| void resolveChannelPath().then((path) => { | |
| if (alive && path) setName(lastSegment(path)); | |
| }).catch(() => { | |
| // ph.query unavailable; name stays empty, showing the fallback. | |
| }); |
| function useChannelName(): string { | ||
| const [name, setName] = useState(""); | ||
| useEffect(() => { | ||
| let alive = true; | ||
| void resolveChannelPath().then((path) => { | ||
| if (alive && path) setName(lastSegment(path)); | ||
| }); | ||
| return () => { | ||
| alive = false; | ||
| }; | ||
| }, []); | ||
| return name; | ||
| } |
There was a problem hiding this comment.
useChannelName issues its own resolveChannelPath() call independently of useChannelRows, so on page load the canvas fires three separate SELECT path FROM system.file_system WHERE id = ... queries: one from useChannelName, one from CanvasesSection, and one from TasksSection. Since useChannelRows already resolves the path and holds it in a pathRef, a shared singleton resolver (e.g., a module-level let resolvedPath: Promise<string> | null) would collapse these into a single round-trip.
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
1 participant
Problem
A project-bluebird channel's home page (a freeform canvas) jumped straight into the Canvases / Inbox / Tasks cards with no introductory copy, so a new channel didn't explain what the space is for or that the page itself is editable.
Why: Give new channels a friendlier, self-explanatory landing that tells people what Canvases and Tasks are for and hints that the home page is itself an editable canvas.
Changes
Added a welcome header to the seeded channel home template (
buildHomeCanvasCodeinpackages/core/src/canvas/dashboardsService.ts), rendered above the existing cards:resolveChannelPath+lastSegment), so renames stay correct; falls back to "Welcome to your channel." before it resolves.Colors use the existing theme CSS variables, so it follows light/dark.
Note: existing channels are not retroactively updated — the template only seeds new channels and re-applies on "Reset to default".
How did you test this?
pnpm --filter @posthog/core test dashboardsService→ 9/9 pass.biome lint/biome checkon the changed file → clean.Automatic notifications
Created with PostHog Code