mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Improve scroll behavior of left pane

Browse source
This commit is contained in:
trevor-signal 2024-11-06 14:23:57 -05:00 committed by GitHub
parent 474f994118
commit e4046d3bd0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 43 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
ts/components/LeftPane.tsx
View file

@ -536,26 +536,6 @@ export function LeftPane({
[showConversation]
);
const previousSelectedConversationId = usePrevious(
selectedConversationId,
selectedConversationId
);
const isScrollable = helper.isScrollable();
let rowIndexToScrollTo: undefined | number;
let scrollBehavior: ScrollBehavior;
if (isScrollable) {
rowIndexToScrollTo =
previousSelectedConversationId === selectedConversationId
? undefined
: helper.getRowIndexToScrollTo(selectedConversationId);
scrollBehavior = ScrollBehavior.Default;
} else {
rowIndexToScrollTo = 0;
scrollBehavior = ScrollBehavior.Hard;
}
// We ensure that the listKey differs between some modes (e.g. inbox/archived), ensuring
// that AutoSizer properly detects the new size of its slot in the flexbox. The
// archive explainer text at the top of the archive view causes problems otherwise.
@ -565,6 +545,8 @@ export function LeftPane({
const measureRef = useRef<HTMLDivElement>(null);
const measureSize = useSizeObserver(measureRef);
const previousMeasureSize = usePrevious(null, measureSize);
const widthBreakpoint = getNavSidebarWidthBreakpoint(
measureSize?.width ?? preferredWidthFromStorage
);
@ -574,6 +556,47 @@ export function LeftPane({
containerWidthBreakpoint: widthBreakpoint,
};
// Control scroll position
const previousSelectedConversationId = usePrevious(
selectedConversationId,
selectedConversationId
);
const isScrollable = helper.isScrollable();
let rowIndexToScrollTo: undefined | number;
let scrollBehavior: ScrollBehavior;
const hasChangedModes =
previousModeSpecificProps?.mode !== modeSpecificProps.mode;
const hasSwitchedToInbox =
hasChangedModes && modeSpecificProps.mode === LeftPaneMode.Inbox;
const hasChangedConversations =
previousSelectedConversationId !== selectedConversationId;
const hasJustMounted = previousMeasureSize == null;
if (isScrollable) {
const rowIndexForSelectedConversation = helper.getRowIndexToScrollTo(
selectedConversationId
);
if (hasSwitchedToInbox) {
rowIndexToScrollTo = rowIndexForSelectedConversation;
} else if (
modeSpecificProps.mode === LeftPaneMode.Inbox &&
(hasChangedConversations || hasJustMounted)
) {
rowIndexToScrollTo = rowIndexForSelectedConversation;
} else if (hasChangedModes) {
rowIndexToScrollTo = 0;
}
scrollBehavior = ScrollBehavior.Default;
} else {
rowIndexToScrollTo = 0;
scrollBehavior = ScrollBehavior.Hard;
}
// Yellow dialogs
let maybeYellowDialog: JSX.Element | undefined;