Merge pull request #1446 from wsw2000/feat/switchWindowScrollIntoView

feat: scrolling effect when switching chat windows
This commit is contained in:
Yifei Zhang 2023-05-13 14:50:42 +08:00 committed by GitHub
commit 330504b91e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -16,6 +16,7 @@ import { Link, useNavigate } from "react-router-dom";
import { Path } from "../constant";
import { MaskAvatar } from "./mask";
import { Mask } from "../store/mask";
import { useRef, useEffect } from "react";
export function ChatItem(props: {
onClick?: () => void;
@ -29,6 +30,14 @@ export function ChatItem(props: {
narrow?: boolean;
mask: Mask;
}) {
const draggableRef = useRef<HTMLDivElement | null>(null);
useEffect(() => {
if (props.selected && draggableRef.current) {
draggableRef.current?.scrollIntoView({
block: "center",
});
}
}, [props.selected]);
return (
<Draggable draggableId={`${props.id}`} index={props.index}>
{(provided) => (
@ -37,7 +46,10 @@ export function ChatItem(props: {
props.selected && styles["chat-item-selected"]
}`}
onClick={props.onClick}
ref={provided.innerRef}
ref={(ele) => {
draggableRef.current = ele;
provided.innerRef(ele);
}}
{...provided.draggableProps}
{...provided.dragHandleProps}
title={`${props.title}\n${Locale.ChatItem.ChatItemCount(