mirror of
https://gh.catmak.name/https://github.com/mihomo-party-org/mihomo-party
synced 2025-12-27 05:00:30 +08:00
fix: profiles cannot click
This commit is contained in:
pompurin404
parent
9acab62d1f
commit
a69d24b29c
@ -80,11 +80,13 @@ const App: React.FC = () => {
|
||||
const location = useLocation()
|
||||
const page = useRoutes(routes)
|
||||
const setTitlebar = (): void => {
|
||||
if (!useWindowFrame && platform !== 'darwin') {
|
||||
if (!useWindowFrame) {
|
||||
const options = { height: 48 } as TitleBarOverlayOptions
|
||||
try {
|
||||
options.color = window.getComputedStyle(document.documentElement).backgroundColor
|
||||
options.symbolColor = window.getComputedStyle(document.documentElement).color
|
||||
if (platform !== 'darwin') {
|
||||
options.color = window.getComputedStyle(document.documentElement).backgroundColor
|
||||
options.symbolColor = window.getComputedStyle(document.documentElement).color
|
||||
}
|
||||
setTitleBarOverlay(options)
|
||||
} catch (e) {
|
||||
// ignore
|
||||
|
||||
@ -30,7 +30,7 @@ interface Props {
|
||||
updateProfileItem: (item: IProfileItem) => Promise<void>
|
||||
removeProfileItem: (id: string) => Promise<void>
|
||||
mutateProfileConfig: () => void
|
||||
onClick: () => Promise<void>
|
||||
onPress: () => Promise<void>
|
||||
}
|
||||
|
||||
interface MenuItem {
|
||||
@ -48,7 +48,7 @@ const ProfileItem: React.FC<Props> = (props) => {
|
||||
removeProfileItem,
|
||||
mutateProfileConfig,
|
||||
updateProfileItem,
|
||||
onClick,
|
||||
onPress,
|
||||
isCurrent
|
||||
} = props
|
||||
const extra = info?.extra
|
||||
@ -175,149 +175,146 @@ const ProfileItem: React.FC<Props> = (props) => {
|
||||
)}
|
||||
<Card
|
||||
fullWidth
|
||||
isPressable
|
||||
onPress={() => {
|
||||
if (disableSelect) return
|
||||
setSelecting(true)
|
||||
onPress().finally(() => {
|
||||
setSelecting(false)
|
||||
})
|
||||
}}
|
||||
className={`${isCurrent ? 'bg-primary' : ''} ${selecting ? 'blur-sm' : ''}`}
|
||||
>
|
||||
<div
|
||||
className="w-full h-full cursor-pointer"
|
||||
onClick={() => {
|
||||
if (disableSelect) return
|
||||
setSelecting(true)
|
||||
onClick().finally(() => {
|
||||
setSelecting(false)
|
||||
})
|
||||
}}
|
||||
>
|
||||
<div ref={setNodeRef} {...attributes} {...listeners} className="w-full h-full">
|
||||
<CardBody className="pb-1">
|
||||
<div className="flex justify-between h-[32px]">
|
||||
<h3
|
||||
title={info?.name}
|
||||
className={`text-ellipsis whitespace-nowrap overflow-hidden text-md font-bold leading-[32px] ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
{info?.name}
|
||||
</h3>
|
||||
<div className="flex">
|
||||
{info.type === 'remote' && (
|
||||
<Tooltip placement="left" content={dayjs(info.updated).fromNow()}>
|
||||
<Button
|
||||
isIconOnly
|
||||
size="sm"
|
||||
variant="light"
|
||||
<div ref={setNodeRef} {...attributes} {...listeners} className="w-full h-full">
|
||||
<CardBody className="pb-1">
|
||||
<div className="flex justify-between h-[32px]">
|
||||
<h3
|
||||
title={info?.name}
|
||||
className={`text-ellipsis whitespace-nowrap overflow-hidden text-md font-bold leading-[32px] ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
{info?.name}
|
||||
</h3>
|
||||
<div className="flex">
|
||||
{info.type === 'remote' && (
|
||||
<Tooltip placement="left" content={dayjs(info.updated).fromNow()}>
|
||||
<Button
|
||||
isIconOnly
|
||||
size="sm"
|
||||
variant="light"
|
||||
color="default"
|
||||
disabled={updating}
|
||||
onPress={async () => {
|
||||
setUpdating(true)
|
||||
await addProfileItem(info)
|
||||
setUpdating(false)
|
||||
}}
|
||||
>
|
||||
<IoMdRefresh
|
||||
color="default"
|
||||
disabled={updating}
|
||||
onPress={async () => {
|
||||
setUpdating(true)
|
||||
await addProfileItem(info)
|
||||
setUpdating(false)
|
||||
}}
|
||||
>
|
||||
<IoMdRefresh
|
||||
color="default"
|
||||
className={`${isCurrent ? 'text-primary-foreground' : 'text-foreground'} text-[24px] ${updating ? 'animate-spin' : ''}`}
|
||||
/>
|
||||
</Button>
|
||||
</Tooltip>
|
||||
)}
|
||||
className={`${isCurrent ? 'text-primary-foreground' : 'text-foreground'} text-[24px] ${updating ? 'animate-spin' : ''}`}
|
||||
/>
|
||||
</Button>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
<Dropdown>
|
||||
<DropdownTrigger>
|
||||
<Button isIconOnly size="sm" variant="light" color="default">
|
||||
<IoMdMore
|
||||
color="default"
|
||||
className={`text-[24px] ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
/>
|
||||
</Button>
|
||||
</DropdownTrigger>
|
||||
<DropdownMenu onAction={onMenuAction}>
|
||||
{menuItems.map((item) => (
|
||||
<DropdownItem
|
||||
showDivider={item.showDivider}
|
||||
key={item.key}
|
||||
color={item.color}
|
||||
className={item.className}
|
||||
>
|
||||
{item.label}
|
||||
</DropdownItem>
|
||||
))}
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
</div>
|
||||
<Dropdown>
|
||||
<DropdownTrigger>
|
||||
<Button isIconOnly size="sm" variant="light" color="default">
|
||||
<IoMdMore
|
||||
color="default"
|
||||
className={`text-[24px] ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
/>
|
||||
</Button>
|
||||
</DropdownTrigger>
|
||||
<DropdownMenu onAction={onMenuAction}>
|
||||
{menuItems.map((item) => (
|
||||
<DropdownItem
|
||||
showDivider={item.showDivider}
|
||||
key={item.key}
|
||||
color={item.color}
|
||||
className={item.className}
|
||||
>
|
||||
{item.label}
|
||||
</DropdownItem>
|
||||
))}
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
</div>
|
||||
{info.type === 'remote' && extra && (
|
||||
<div
|
||||
className={`mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
<small>{`${calcTraffic(usage)}/${calcTraffic(total)}`}</small>
|
||||
{profileDisplayDate === 'expire' ? (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="light"
|
||||
className={`h-[20px] p-1 m-0 ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
onPress={async () => {
|
||||
await patchAppConfig({ profileDisplayDate: 'update' })
|
||||
}}
|
||||
>
|
||||
{extra.expire ? dayjs.unix(extra.expire).format('YYYY-MM-DD') : '长期有效'}
|
||||
</Button>
|
||||
) : (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="light"
|
||||
className={`h-[20px] p-1 m-0 ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
onPress={async () => {
|
||||
await patchAppConfig({ profileDisplayDate: 'expire' })
|
||||
}}
|
||||
>
|
||||
{dayjs(info.updated).fromNow()}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</CardBody>
|
||||
<CardFooter className="pt-0">
|
||||
{info.type === 'remote' && !extra && (
|
||||
<div
|
||||
className={`w-full mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
<Chip
|
||||
</div>
|
||||
{info.type === 'remote' && extra && (
|
||||
<div
|
||||
className={`mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
<small>{`${calcTraffic(usage)}/${calcTraffic(total)}`}</small>
|
||||
{profileDisplayDate === 'expire' ? (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="bordered"
|
||||
className={`${isCurrent ? 'text-primary-foreground border-primary-foreground' : 'border-primary text-primary'}`}
|
||||
variant="light"
|
||||
className={`h-[20px] p-1 m-0 ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
onPress={async () => {
|
||||
await patchAppConfig({ profileDisplayDate: 'update' })
|
||||
}}
|
||||
>
|
||||
{extra.expire ? dayjs.unix(extra.expire).format('YYYY-MM-DD') : '长期有效'}
|
||||
</Button>
|
||||
) : (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="light"
|
||||
className={`h-[20px] p-1 m-0 ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
onPress={async () => {
|
||||
await patchAppConfig({ profileDisplayDate: 'expire' })
|
||||
}}
|
||||
>
|
||||
{dayjs(info.updated).fromNow()}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</CardBody>
|
||||
<CardFooter className="pt-0">
|
||||
{info.type === 'remote' && !extra && (
|
||||
<div
|
||||
className={`w-full mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
<Chip
|
||||
size="sm"
|
||||
variant="bordered"
|
||||
className={`${isCurrent ? 'text-primary-foreground border-primary-foreground' : 'border-primary text-primary'}`}
|
||||
>
|
||||
{t('profiles.remote')}
|
||||
</Chip>
|
||||
<small>{dayjs(info.updated).fromNow()}</small>
|
||||
</div>
|
||||
)}
|
||||
{info.type === 'local' && (
|
||||
<div
|
||||
className={`mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
</Chip>
|
||||
<small>{dayjs(info.updated).fromNow()}</small>
|
||||
</div>
|
||||
)}
|
||||
{info.type === 'local' && (
|
||||
<div
|
||||
className={`mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
|
||||
>
|
||||
<Chip
|
||||
size="sm"
|
||||
variant="bordered"
|
||||
className={`${isCurrent ? 'text-primary-foreground border-primary-foreground' : 'border-primary text-primary'}`}
|
||||
>
|
||||
<Chip
|
||||
size="sm"
|
||||
variant="bordered"
|
||||
className={`${isCurrent ? 'text-primary-foreground border-primary-foreground' : 'border-primary text-primary'}`}
|
||||
>
|
||||
{t('profiles.local')}
|
||||
</Chip>
|
||||
</div>
|
||||
)}
|
||||
{extra && (
|
||||
<Progress
|
||||
className="w-full"
|
||||
</Chip>
|
||||
</div>
|
||||
)}
|
||||
{extra && (
|
||||
<Progress
|
||||
className="w-full"
|
||||
aria-label={t('profiles.trafficUsage')}
|
||||
classNames={{
|
||||
indicator: isCurrent ? 'bg-primary-foreground' : 'bg-foreground'
|
||||
}}
|
||||
value={calcPercent(extra?.upload, extra?.download, extra?.total)}
|
||||
/>
|
||||
)}
|
||||
</CardFooter>
|
||||
</div>
|
||||
classNames={{
|
||||
indicator: isCurrent ? 'bg-primary-foreground' : 'bg-foreground'
|
||||
}}
|
||||
value={calcPercent(extra?.upload, extra?.download, extra?.total)}
|
||||
/>
|
||||
)}
|
||||
</CardFooter>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default ProfileItem
|
||||
export default ProfileItem
|
||||
@ -51,6 +51,8 @@ const ProxyItem: React.FC<Props> = (props) => {
|
||||
|
||||
return (
|
||||
<Card
|
||||
onPress={() => onSelect(group.name, proxy.name)}
|
||||
isPressable
|
||||
fullWidth
|
||||
shadow="sm"
|
||||
className={`${
|
||||
@ -62,100 +64,95 @@ const ProxyItem: React.FC<Props> = (props) => {
|
||||
}`}
|
||||
radius="sm"
|
||||
>
|
||||
<div
|
||||
onClick={() => onSelect(group.name, proxy.name)}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<CardBody className="p-1">
|
||||
{proxyDisplayMode === 'full' ? (
|
||||
<div className="flex flex-col gap-1">
|
||||
<div className="flex justify-between items-center pl-1">
|
||||
<div className="text-ellipsis overflow-hidden whitespace-nowrap" title={proxy.name}>
|
||||
{proxy.name}
|
||||
</div>
|
||||
{fixed && (
|
||||
<Button
|
||||
isIconOnly
|
||||
title={t('proxies.unpin')}
|
||||
color="danger"
|
||||
onPress={async () => {
|
||||
await mihomoUnfixedProxy(group.name)
|
||||
mutateProxies()
|
||||
}}
|
||||
variant="light"
|
||||
className="h-[20px] p-0 text-sm"
|
||||
>
|
||||
<FaMapPin className="text-md le" />
|
||||
</Button>
|
||||
)}
|
||||
<CardBody className="p-1">
|
||||
{proxyDisplayMode === 'full' ? (
|
||||
<div className="flex flex-col gap-1">
|
||||
<div className="flex justify-between items-center pl-1">
|
||||
<div className="text-ellipsis overflow-hidden whitespace-nowrap" title={proxy.name}>
|
||||
{proxy.name}
|
||||
</div>
|
||||
<div className="flex justify-between items-center pl-1">
|
||||
<div className="flex gap-1 items-center">
|
||||
<div className="text-foreground-400 text-xs bg-default-100 px-1 rounded-md">
|
||||
{proxy.type}
|
||||
</div>
|
||||
{['tfo', 'udp', 'xudp', 'mptcp', 'smux'].map(protocol =>
|
||||
proxy[protocol as keyof IMihomoProxy] && (
|
||||
<div key={protocol} className="text-foreground-400 text-xs bg-default-100 px-1 rounded-md">
|
||||
{protocol}
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
{fixed && (
|
||||
<Button
|
||||
isIconOnly
|
||||
title={proxy.type}
|
||||
isLoading={loading}
|
||||
color={delayColor(delay)}
|
||||
onPress={onDelay}
|
||||
variant="light"
|
||||
className="h-full text-sm ml-auto -mt-0.5"
|
||||
>
|
||||
{delayText(delay)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex justify-between items-center pl-1 p-1">
|
||||
<div className="text-ellipsis overflow-hidden whitespace-nowrap">
|
||||
<div className="flag-emoji inline" title={proxy.name}>
|
||||
{proxy.name}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end">
|
||||
{fixed && (
|
||||
<Button
|
||||
isIconOnly
|
||||
title={t('proxies.unpin')}
|
||||
color="danger"
|
||||
onPress={async () => {
|
||||
await mihomoUnfixedProxy(group.name)
|
||||
mutateProxies()
|
||||
}}
|
||||
variant="light"
|
||||
className="h-[20px] p-0 text-sm"
|
||||
>
|
||||
<FaMapPin className="text-md le" />
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
isIconOnly
|
||||
title={proxy.type}
|
||||
isLoading={loading}
|
||||
color={delayColor(delay)}
|
||||
onPress={onDelay}
|
||||
color="danger"
|
||||
onPress={async () => {
|
||||
await mihomoUnfixedProxy(group.name)
|
||||
mutateProxies()
|
||||
}}
|
||||
variant="light"
|
||||
className="h-full p-0 text-sm"
|
||||
className="h-[20px] p-0 text-sm"
|
||||
>
|
||||
{delayText(delay)}
|
||||
<FaMapPin className="text-md le" />
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</CardBody>
|
||||
</div>
|
||||
<div className="flex justify-between items-center pl-1">
|
||||
<div className="flex gap-1 items-center">
|
||||
<div className="text-foreground-400 text-xs bg-default-100 px-1 rounded-md">
|
||||
{proxy.type}
|
||||
</div>
|
||||
{['tfo', 'udp', 'xudp', 'mptcp', 'smux'].map(protocol =>
|
||||
proxy[protocol as keyof IMihomoProxy] && (
|
||||
<div key={protocol} className="text-foreground-400 text-xs bg-default-100 px-1 rounded-md">
|
||||
{protocol}
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
<Button
|
||||
isIconOnly
|
||||
title={proxy.type}
|
||||
isLoading={loading}
|
||||
color={delayColor(delay)}
|
||||
onPress={onDelay}
|
||||
variant="light"
|
||||
className="h-full text-sm ml-auto -mt-0.5"
|
||||
>
|
||||
{delayText(delay)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex justify-between items-center pl-1 p-1">
|
||||
<div className="text-ellipsis overflow-hidden whitespace-nowrap">
|
||||
<div className="flag-emoji inline" title={proxy.name}>
|
||||
{proxy.name}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end">
|
||||
{fixed && (
|
||||
<Button
|
||||
isIconOnly
|
||||
title={t('proxies.unpin')}
|
||||
color="danger"
|
||||
onPress={async () => {
|
||||
await mihomoUnfixedProxy(group.name)
|
||||
mutateProxies()
|
||||
}}
|
||||
variant="light"
|
||||
className="h-[20px] p-0 text-sm"
|
||||
>
|
||||
<FaMapPin className="text-md le" />
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
isIconOnly
|
||||
title={proxy.type}
|
||||
isLoading={loading}
|
||||
color={delayColor(delay)}
|
||||
onPress={onDelay}
|
||||
variant="light"
|
||||
className="h-full p-0 text-sm"
|
||||
>
|
||||
{delayText(delay)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</CardBody>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
|
||||
export default ProxyItem
|
||||
export default ProxyItem
|
||||
@ -395,7 +395,7 @@ const Profiles: React.FC = () => {
|
||||
mutateProfileConfig={mutateProfileConfig}
|
||||
updateProfileItem={updateProfileItem}
|
||||
info={item}
|
||||
onClick={async () => {
|
||||
onPress={async () => {
|
||||
await changeCurrentProfile(item.id)
|
||||
}}
|
||||
/>
|
||||
|
||||
@ -329,121 +329,118 @@ const Proxies: React.FC = () => {
|
||||
className={`w-full pt-2 ${index === groupCounts.length - 1 && !isOpen[index] ? 'pb-2' : ''} px-2`}
|
||||
>
|
||||
<Card
|
||||
isPressable
|
||||
fullWidth
|
||||
onPress={() => {
|
||||
setIsOpen((prev) => {
|
||||
const newOpen = [...prev]
|
||||
newOpen[index] = !prev[index]
|
||||
return newOpen
|
||||
})
|
||||
}}
|
||||
>
|
||||
<div
|
||||
onClick={(): void => {
|
||||
setIsOpen((prev) => {
|
||||
const newOpen = [...prev]
|
||||
newOpen[index] = !prev[index]
|
||||
return newOpen
|
||||
})
|
||||
}}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<CardBody className="w-full">
|
||||
<div className="flex justify-between">
|
||||
<div className="flex text-ellipsis overflow-hidden whitespace-nowrap">
|
||||
{groups[index].icon ? (
|
||||
<Avatar
|
||||
className="bg-transparent mr-2"
|
||||
size="sm"
|
||||
radius="sm"
|
||||
src={
|
||||
groups[index].icon.startsWith('<svg')
|
||||
? `data:image/svg+xml;utf8,${groups[index].icon}`
|
||||
: localStorage.getItem(groups[index].icon) || groups[index].icon
|
||||
}
|
||||
/>
|
||||
) : null}
|
||||
<div className="text-ellipsis overflow-hidden whitespace-nowrap">
|
||||
<div
|
||||
title={groups[index].name}
|
||||
className="inline flag-emoji h-[32px] text-md leading-[32px]"
|
||||
>
|
||||
{groups[index].name}
|
||||
</div>
|
||||
{proxyDisplayMode === 'full' && (
|
||||
<div
|
||||
title={groups[index].type}
|
||||
className="inline ml-2 text-sm text-foreground-500"
|
||||
>
|
||||
{groups[index].type}
|
||||
</div>
|
||||
)}
|
||||
{proxyDisplayMode === 'full' && (
|
||||
<div className="inline flag-emoji ml-2 text-sm text-foreground-500">
|
||||
{groups[index].now}
|
||||
</div>
|
||||
)}
|
||||
<CardBody className="w-full">
|
||||
<div className="flex justify-between">
|
||||
<div className="flex text-ellipsis overflow-hidden whitespace-nowrap">
|
||||
{groups[index].icon ? (
|
||||
<Avatar
|
||||
className="bg-transparent mr-2"
|
||||
size="sm"
|
||||
radius="sm"
|
||||
src={
|
||||
groups[index].icon.startsWith('<svg')
|
||||
? `data:image/svg+xml;utf8,${groups[index].icon}`
|
||||
: localStorage.getItem(groups[index].icon) || groups[index].icon
|
||||
}
|
||||
/>
|
||||
) : null}
|
||||
<div className="text-ellipsis overflow-hidden whitespace-nowrap">
|
||||
<div
|
||||
title={groups[index].name}
|
||||
className="inline flag-emoji h-[32px] text-md leading-[32px]"
|
||||
>
|
||||
{groups[index].name}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex">
|
||||
{proxyDisplayMode === 'full' && (
|
||||
<Chip size="sm" className="my-1 mr-2">
|
||||
{groups[index].all.length}
|
||||
</Chip>
|
||||
<div
|
||||
title={groups[index].type}
|
||||
className="inline ml-2 text-sm text-foreground-500"
|
||||
>
|
||||
{groups[index].type}
|
||||
</div>
|
||||
)}
|
||||
{proxyDisplayMode === 'full' && (
|
||||
<div className="inline flag-emoji ml-2 text-sm text-foreground-500">
|
||||
{groups[index].now}
|
||||
</div>
|
||||
)}
|
||||
<CollapseInput
|
||||
title={t('proxies.search.placeholder')}
|
||||
value={searchValue[index]}
|
||||
onValueChange={(v) => {
|
||||
setSearchValue((prev) => {
|
||||
const newSearchValue = [...prev]
|
||||
newSearchValue[index] = v
|
||||
return newSearchValue
|
||||
})
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
title={t('proxies.locate')}
|
||||
variant="light"
|
||||
size="sm"
|
||||
isIconOnly
|
||||
onPress={() => {
|
||||
if (!isOpen[index]) {
|
||||
setIsOpen((prev) => {
|
||||
const newOpen = [...prev]
|
||||
newOpen[index] = true
|
||||
return newOpen
|
||||
})
|
||||
}
|
||||
let i = 0
|
||||
for (let j = 0; j < index; j++) {
|
||||
i += groupCounts[j]
|
||||
}
|
||||
i += Math.floor(
|
||||
allProxies[index].findIndex(
|
||||
(proxy) => proxy.name === groups[index].now
|
||||
) / cols
|
||||
)
|
||||
virtuosoRef.current?.scrollToIndex({
|
||||
index: Math.floor(i),
|
||||
align: 'start'
|
||||
})
|
||||
}}
|
||||
>
|
||||
<FaLocationCrosshairs className="text-lg text-foreground-500" />
|
||||
</Button>
|
||||
<Button
|
||||
title={t('proxies.delay.test')}
|
||||
variant="light"
|
||||
isLoading={delaying[index]}
|
||||
size="sm"
|
||||
isIconOnly
|
||||
onPress={() => {
|
||||
onGroupDelay(index)
|
||||
}}
|
||||
>
|
||||
<MdOutlineSpeed className="text-lg text-foreground-500" />
|
||||
</Button>
|
||||
<IoIosArrowBack
|
||||
className={`transition duration-200 ml-2 h-[32px] text-lg text-foreground-500 ${isOpen[index] ? '-rotate-90' : ''}`}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CardBody>
|
||||
</div>
|
||||
<div className="flex">
|
||||
{proxyDisplayMode === 'full' && (
|
||||
<Chip size="sm" className="my-1 mr-2">
|
||||
{groups[index].all.length}
|
||||
</Chip>
|
||||
)}
|
||||
<CollapseInput
|
||||
title={t('proxies.search.placeholder')}
|
||||
value={searchValue[index]}
|
||||
onValueChange={(v) => {
|
||||
setSearchValue((prev) => {
|
||||
const newSearchValue = [...prev]
|
||||
newSearchValue[index] = v
|
||||
return newSearchValue
|
||||
})
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
title={t('proxies.locate')}
|
||||
variant="light"
|
||||
size="sm"
|
||||
isIconOnly
|
||||
onPress={() => {
|
||||
if (!isOpen[index]) {
|
||||
setIsOpen((prev) => {
|
||||
const newOpen = [...prev]
|
||||
newOpen[index] = true
|
||||
return newOpen
|
||||
})
|
||||
}
|
||||
let i = 0
|
||||
for (let j = 0; j < index; j++) {
|
||||
i += groupCounts[j]
|
||||
}
|
||||
i += Math.floor(
|
||||
allProxies[index].findIndex(
|
||||
(proxy) => proxy.name === groups[index].now
|
||||
) / cols
|
||||
)
|
||||
virtuosoRef.current?.scrollToIndex({
|
||||
index: Math.floor(i),
|
||||
align: 'start'
|
||||
})
|
||||
}}
|
||||
>
|
||||
<FaLocationCrosshairs className="text-lg text-foreground-500" />
|
||||
</Button>
|
||||
<Button
|
||||
title={t('proxies.delay.test')}
|
||||
variant="light"
|
||||
isLoading={delaying[index]}
|
||||
size="sm"
|
||||
isIconOnly
|
||||
onPress={() => {
|
||||
onGroupDelay(index)
|
||||
}}
|
||||
>
|
||||
<MdOutlineSpeed className="text-lg text-foreground-500" />
|
||||
</Button>
|
||||
<IoIosArrowBack
|
||||
className={`transition duration-200 ml-2 h-[32px] text-lg text-foreground-500 ${isOpen[index] ? '-rotate-90' : ''}`}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CardBody>
|
||||
</Card>
|
||||
</div>
|
||||
) : (
|
||||
@ -494,4 +491,4 @@ const Proxies: React.FC = () => {
|
||||
)
|
||||
}
|
||||
|
||||
export default Proxies
|
||||
export default Proxies
|
||||
Loading…
x
Reference in New Issue
Block a user