diff --git a/src/components/proxy/proxy-group.tsx b/src/components/proxy/proxy-group.tsx index 6962189..2638660 100644 --- a/src/components/proxy/proxy-group.tsx +++ b/src/components/proxy/proxy-group.tsx @@ -1,5 +1,5 @@ -import { useState } from "react"; -import { Virtuoso } from "react-virtuoso"; +import { useRef, useState } from "react"; +import { Virtuoso, VirtuosoHandle } from "react-virtuoso"; import { Box, Collapse, @@ -16,8 +16,8 @@ import { MyLocationRounded, NetworkCheckRounded, } from "@mui/icons-material"; -import { updateProxy } from "../../services/api"; import { ApiType } from "../../services/types"; +import { updateProxy } from "../../services/api"; import { getProfiles, patchProfile } from "../../services/cmds"; import ProxyItem from "./proxy-item"; @@ -26,6 +26,7 @@ interface Props { } const ProxyGroup = ({ group }: Props) => { + const listRef = useRef(); const [open, setOpen] = useState(false); const [now, setNow] = useState(group.now); @@ -67,6 +68,18 @@ const ProxyGroup = ({ group }: Props) => { } }; + const onLocation = () => { + const index = proxies.findIndex((p) => p.name === now); + + if (index >= 0) { + listRef.current?.scrollToIndex?.({ + index, + align: "center", + behavior: "smooth", + }); + } + }; + return ( <> setOpen(!open)} dense> @@ -88,7 +101,7 @@ const ProxyGroup = ({ group }: Props) => { - + @@ -98,6 +111,7 @@ const ProxyGroup = ({ group }: Props) => { {proxies.length >= 10 ? ( (