[Chat] Fix navigation stacking on messages links in split view (#10741)

Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Samuel Newman
2026-06-05 16:38:48 +03:00
committed by GitHub
parent 3cdc0604ca
commit f81bb6f494
3 changed files with 15 additions and 0 deletions
+8
View File
@@ -451,6 +451,12 @@ export function Header({
const {gtMobile} = useBreakpoints() const {gtMobile} = useBreakpoints()
const requireEmailVerification = useRequireEmailVerification() const requireEmailVerification = useRequireEmailVerification()
const leftConvos = useLeftConvos() const leftConvos = useLeftConvos()
const {isWithinSplitView} = useIsWithinSplitView()
// In split view, the left column (and this header) stays mounted while the
// right column shows the selected route. Pushing would stack duplicate routes
// on repeated clicks, so navigate instead to dedupe by route + params.
const action = isWithinSplitView ? 'navigate' : 'push'
const {data: unreadInboxData, hasNextPage: hasMoreRequests} = const {data: unreadInboxData, hasNextPage: hasMoreRequests} =
useListConvosQuery({ useListConvosQuery({
@@ -494,9 +500,11 @@ export function Header({
count={inboxAllConvos.length} count={inboxAllConvos.length}
more={hasMoreRequests} more={hasMoreRequests}
variant="solid" variant="solid"
action={action}
/> />
<Link <Link
to="/messages/settings" to="/messages/settings"
action={action}
label={l`Chat settings`} label={l`Chat settings`}
size="small" size="small"
color="secondary" color="secondary"
@@ -481,6 +481,9 @@ function BaseChatItem({
<Link <Link
to={`/messages/${convo.view.id}`} to={`/messages/${convo.view.id}`}
// In split view, this list stays mounted alongside the open convo,
// so push would stack duplicate routes on repeated clicks.
action={isWithinSplitView ? 'navigate' : 'push'}
label={title} label={title}
accessibilityHint={accessibilityHint} accessibilityHint={accessibilityHint}
accessibilityActions={ accessibilityActions={
@@ -11,10 +11,12 @@ export function InboxRequests({
count, count,
more, more,
variant, variant,
action,
}: { }: {
count: number count: number
more: boolean more: boolean
variant?: 'ghost' | 'solid' variant?: 'ghost' | 'solid'
action?: 'push' | 'navigate'
}) { }) {
const {t: l} = useLingui() const {t: l} = useLingui()
@@ -41,6 +43,7 @@ export function InboxRequests({
<Link <Link
label={label} label={label}
to="/messages/inbox" to="/messages/inbox"
action={action}
size="small" size="small"
variant={unread ? 'solid' : 'ghost'} variant={unread ? 'solid' : 'ghost'}
color={unread ? 'primary_subtle' : 'secondary'} color={unread ? 'primary_subtle' : 'secondary'}
@@ -66,6 +69,7 @@ export function InboxRequests({
<Link <Link
label={label} label={label}
to="/messages/inbox" to="/messages/inbox"
action={action}
color={unread ? 'primary_subtle' : 'secondary'} color={unread ? 'primary_subtle' : 'secondary'}
size="small"> size="small">
<ButtonIcon icon={InboxIcon} /> <ButtonIcon icon={InboxIcon} />