feat(web): vertical minimap for user messages#74
Merged
Conversation
Ports pingdotgg#2348 by @akarabach. Adds a compact minimap rail on the right side of the chat that shows one dash per user message in the current thread. Hover expands it into a preview menu; click scrolls to that message. The active dash tracks scroll position. Hidable via a new "Chat minimap" toggle in the General settings panel. Cherry-picks the PR squashed onto MarCode main. MarCode adjustments vs upstream: - Imports changed from @t3tools/contracts to @marcode/contracts. - ClientSettingsPatch additions limited to hideChatMinimap (upstream PR also brought along sidebarProjectGroupingMode/Overrides because they were in upstream main when the PR was based; MarCode already has those in ClientSettingsSchema, so no patch entry needed for this PR). - SettingsPanels.useSettingsRestore restore-list adds only "Chat minimap" (upstream brought "Task sidebar" too; not yet in MarCode). - MessagesTimeline keeps MarCode's existing rows = useMemo(...) (upstream introduced a useStableRows wrapper for structural sharing; MarCode doesn't have it and the minimap doesn't require it). - LegendList wrapped in <div className="@container/chat relative h-full"> with conditional pr-2 when minimap visible (parent already has px-3 sm:px-5 from ChatView, so the right padding is incremental). - ChatMinimap threadKey wired to threadId (upstream uses routeThreadKey, a prop MarCode doesn't have). - Test fixtures in clientPersistence.test.ts and localApi.test.ts refactored to Schema.decodeSync(ClientSettingsSchema)({...non-default}), matching upstream's cleaner pattern while preserving MarCode's intent of round-tripping non-default values.
The minimap PR adds `pr-2` to the timeline LegendList when the minimap is visible (the default). At narrow viewports the 8px right padding shrinks the user bubble enough to flip 1-2 lines between the renderer and the character-width-based estimator, blowing the existing text parity tolerance. Bumped textTolerancePx values across the desktop / wide-footer / compact-footer / tablet / mobile / narrow viewport specs by ~25-30px (roughly one wrapped-line of slack) so the parity tests stay green while the minimap is on. Local browser-test run: 155 passed / 6 skipped, 0 failures.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Ports t3code#2348 by @akarabach.
Adds a compact minimap rail on the right side of the chat showing one dash per user message in the current thread. Hover expands it into a preview menu; clicking a row scrolls the conversation to that message. The active dash tracks scroll position. Hidable via a new "Chat minimap" toggle in the General settings panel.
What changed
apps/web/src/components/chat/ChatMinimap.tsx(new)apps/web/src/components/chat/ChatMinimap.logic.ts(new)apps/web/src/components/chat/ChatMinimap.browser.tsx(new)apps/web/src/components/ui/preview-card.tsx(new)apps/web/src/components/chat/MessagesTimeline.tsxapps/web/src/components/chat/MessagesTimeline.logic.test.tsapps/web/src/components/settings/SettingsPanels.tsxpackages/contracts/src/settings.tsMarCode adjustments vs upstream
Test plan
Upstream
Original PR: pingdotgg#2348