mirror of
https://github.com/farion1231/cc-switch.git
synced 2026-06-16 13:34:04 +08:00
fix(settings): reset scroll on tab switch (#4165)
This commit is contained in:
committed by
GitHub
Unverified
parent
c548e7fcba
commit
12567b3229
@@ -1,4 +1,11 @@
|
|||||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
import {
|
||||||
|
useCallback,
|
||||||
|
useEffect,
|
||||||
|
useLayoutEffect,
|
||||||
|
useMemo,
|
||||||
|
useRef,
|
||||||
|
useState,
|
||||||
|
} from "react";
|
||||||
import { motion } from "framer-motion";
|
import { motion } from "framer-motion";
|
||||||
import {
|
import {
|
||||||
Loader2,
|
Loader2,
|
||||||
@@ -102,6 +109,7 @@ export function SettingsPage({
|
|||||||
|
|
||||||
const [activeTab, setActiveTab] = useState<string>("general");
|
const [activeTab, setActiveTab] = useState<string>("general");
|
||||||
const [showRestartPrompt, setShowRestartPrompt] = useState(false);
|
const [showRestartPrompt, setShowRestartPrompt] = useState(false);
|
||||||
|
const tabScrollContainerRef = useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (open) {
|
if (open) {
|
||||||
@@ -116,6 +124,12 @@ export function SettingsPage({
|
|||||||
}
|
}
|
||||||
}, [requiresRestart]);
|
}, [requiresRestart]);
|
||||||
|
|
||||||
|
useLayoutEffect(() => {
|
||||||
|
if (tabScrollContainerRef.current) {
|
||||||
|
tabScrollContainerRef.current.scrollTop = 0;
|
||||||
|
}
|
||||||
|
}, [activeTab]);
|
||||||
|
|
||||||
const closeAfterSave = useCallback(() => {
|
const closeAfterSave = useCallback(() => {
|
||||||
// 保存成功后关闭:不再重置语言,避免需要“保存两次”才生效
|
// 保存成功后关闭:不再重置语言,避免需要“保存两次”才生效
|
||||||
acknowledgeRestart();
|
acknowledgeRestart();
|
||||||
@@ -226,7 +240,10 @@ export function SettingsPage({
|
|||||||
</TabsList>
|
</TabsList>
|
||||||
|
|
||||||
<div className="flex-1 min-h-0 flex flex-col">
|
<div className="flex-1 min-h-0 flex flex-col">
|
||||||
<div className="flex-1 overflow-y-auto overflow-x-hidden pr-2">
|
<div
|
||||||
|
ref={tabScrollContainerRef}
|
||||||
|
className="flex-1 overflow-y-auto overflow-x-hidden pr-2"
|
||||||
|
>
|
||||||
<TabsContent value="general" className="space-y-6 mt-0">
|
<TabsContent value="general" className="space-y-6 mt-0">
|
||||||
{settings ? (
|
{settings ? (
|
||||||
<motion.div
|
<motion.div
|
||||||
|
|||||||
@@ -344,9 +344,7 @@ describe("SettingsPage Component", () => {
|
|||||||
fireEvent.click(screen.getByText("settings.advanced.data.title"));
|
fireEvent.click(screen.getByText("settings.advanced.data.title"));
|
||||||
|
|
||||||
// 有文件时,点击导入按钮执行 importConfig
|
// 有文件时,点击导入按钮执行 importConfig
|
||||||
fireEvent.click(
|
fireEvent.click(screen.getByRole("button", { name: /settings\.import/ }));
|
||||||
screen.getByRole("button", { name: /settings\.import/ }),
|
|
||||||
);
|
|
||||||
expect(importExportMock.importConfig).toHaveBeenCalled();
|
expect(importExportMock.importConfig).toHaveBeenCalled();
|
||||||
|
|
||||||
fireEvent.click(
|
fireEvent.click(
|
||||||
@@ -359,6 +357,20 @@ describe("SettingsPage Component", () => {
|
|||||||
expect(importExportMock.clearSelection).toHaveBeenCalled();
|
expect(importExportMock.clearSelection).toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("should reset tab content scroll position when switching settings tabs", () => {
|
||||||
|
const { container } = renderSettingsPage();
|
||||||
|
const scrollContainer = container.querySelector(
|
||||||
|
".overflow-y-auto",
|
||||||
|
) as HTMLDivElement | null;
|
||||||
|
|
||||||
|
expect(scrollContainer).not.toBeNull();
|
||||||
|
|
||||||
|
scrollContainer!.scrollTop = 640;
|
||||||
|
fireEvent.click(screen.getByText("settings.tabAdvanced"));
|
||||||
|
|
||||||
|
expect(scrollContainer!.scrollTop).toBe(0);
|
||||||
|
});
|
||||||
|
|
||||||
it("should pass onImportSuccess callback to useImportExport hook", async () => {
|
it("should pass onImportSuccess callback to useImportExport hook", async () => {
|
||||||
const onImportSuccess = vi.fn();
|
const onImportSuccess = vi.fn();
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user