Public-Mirror/metacubexd
1
0
Fork 0
mirror of https://github.com/MetaCubeX/metacubexd.git synced 2024-09-20 14:02:46 +08:00
Code Issues Projects Releases Wiki Activity

refactor(proxy): move states into useProxies, rename properties

Browse Source
This commit is contained in:
kunish 2023-09-24 17:56:24 +08:00
parent 2274d7b5c6
commit 8f8a54af0a
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
4 changed files with 88 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/ProxyCardGroups.tsx
View File

@ -1,20 +0,0 @@
import { For } from 'solid-js'
import { ProxyNodeCard } from '~/components'
export const ProxyCardGroups = (props: {
proxyNames: string[]
now?: string
onClick?: (name: string) => void
}) => {
return (
<For each={props.proxyNames}>
{(proxy) => (
<ProxyNodeCard
proxyName={proxy}
isSelected={props.now === proxy}
onClick={props.onClick && (() => props.onClick?.(proxy))}
/>
)}
</For>
)
}

1
src/components/index.ts
View File

@ -9,7 +9,6 @@ export * from './LogoText'
export * from './LogsSettingsModal' export * from './LogsSettingsModal'
export * from './Modal' export * from './Modal'
export * from './ProxiesSettingsModal' export * from './ProxiesSettingsModal'
export * from './ProxyCardGroups'
export * from './ProxyNodeCard' export * from './ProxyNodeCard'
export * from './ProxyNodePreview' export * from './ProxyNodePreview'
export * from './ProxyPreviewBar' export * from './ProxyPreviewBar'

74
src/pages/Proxies.tsx
View File

@ -9,7 +9,7 @@ import {
Button, Button,
Collapse, Collapse,
ProxiesSettingsModal, ProxiesSettingsModal,
ProxyCardGroups, ProxyNodeCard,
ProxyNodePreview, ProxyNodePreview,
RenderInTwoColumns, RenderInTwoColumns,
SubscriptionInfo, SubscriptionInfo,
@ -17,7 +17,6 @@ import {
import { import {
filterProxiesByAvailability, filterProxiesByAvailability,
sortProxiesByOrderingType, sortProxiesByOrderingType,
useStringBooleanMap,
} from '~/helpers' } from '~/helpers'
import { useI18n } from '~/i18n' import { useI18n } from '~/i18n'
import { import {
@ -41,48 +40,46 @@ export default () => {
fetchProxies, fetchProxies,
proxies, proxies,
selectProxyInGroup, selectProxyInGroup,
proxyGroupLatencyTest,
latencyMap, latencyMap,
proxyProviders, proxyProviders,
updateProviderByProviderName, updateProviderByProviderName,
updateAllProvider, updateAllProvider,
healthCheckByProviderName, proxyGroupLatencyTest,
proxyProviderLatencyTest,
collapsedMap, collapsedMap,
setCollapsedMap, setCollapsedMap,
latencyTestingMap, latencyTestingMap,
setLatencyTestingMap, healthCheckingMap,
isAllProviderUpdating,
updatingMap,
} = useProxies() } = useProxies()
onMount(fetchProxies) onMount(fetchProxies)
const onLatencyTestClick = async (e: MouseEvent, name: string) => { const onProxyGroupLatencyTestClick = async (
e: MouseEvent,
groupName: string,
) => {
e.stopPropagation() e.stopPropagation()
void setLatencyTestingMap(name, () => proxyGroupLatencyTest(name)) void proxyGroupLatencyTest(groupName)
} }
const { map: healthCheckingMap, setWithCallback: setHealthCheckingMap } = const onProxyProviderLatencyTestClick = (
useStringBooleanMap() e: MouseEvent,
const { map: updatingMap, setWithCallback: setUpdatingMap } = providerName: string,
useStringBooleanMap() ) => {
const [isAllProviderUpdating, setIsAllProviderUpdating] = createSignal(false)
const onHealthCheckClick = (e: MouseEvent, name: string) => {
e.stopPropagation() e.stopPropagation()
void setHealthCheckingMap(name, () => healthCheckByProviderName(name)) void proxyProviderLatencyTest(providerName)
} }
const onUpdateProviderClick = (e: MouseEvent, name: string) => { const onUpdateProxyProviderClick = (e: MouseEvent, providerName: string) => {
e.stopPropagation() e.stopPropagation()
void setUpdatingMap(name, () => updateProviderByProviderName(name)) void updateProviderByProviderName(providerName)
} }
const onUpdateAllProviderClick = async (e: MouseEvent) => { const onUpdateAllProviderClick = async (e: MouseEvent) => {
e.stopPropagation() e.stopPropagation()
setIsAllProviderUpdating(true) void updateAllProvider()
try {
await updateAllProvider()
} catch {}
setIsAllProviderUpdating(false)
} }
const [activeTab, setActiveTab] = createSignal(ActiveTab.proxies) const [activeTab, setActiveTab] = createSignal(ActiveTab.proxies)
@ -163,7 +160,7 @@ export default () => {
const title = ( const title = (
<> <>
<div class="mr-8 flex items-center justify-between"> <div class="flex items-center justify-between pr-8">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<span>{proxyGroup.name}</span> <span>{proxyGroup.name}</span>
<div class="badge badge-sm"> <div class="badge badge-sm">
@ -174,7 +171,9 @@ export default () => {
<Button <Button
class="btn-circle btn-sm" class="btn-circle btn-sm"
disabled={latencyTestingMap()[proxyGroup.name]} disabled={latencyTestingMap()[proxyGroup.name]}
onClick={(e) => onLatencyTestClick(e, proxyGroup.name)} onClick={(e) =>
onProxyGroupLatencyTestClick(e, proxyGroup.name)
}
icon={ icon={
<IconBrandSpeedtest <IconBrandSpeedtest
class={twMerge( class={twMerge(
@ -206,13 +205,17 @@ export default () => {
title={title} title={title}
onCollapse={(val) => setCollapsedMap(proxyGroup.name, val)} onCollapse={(val) => setCollapsedMap(proxyGroup.name, val)}
> >
<ProxyCardGroups <For each={sortedProxyNames()}>
proxyNames={sortedProxyNames()} {(proxyName) => (
now={proxyGroup.now} <ProxyNodeCard
onClick={(name) => proxyName={proxyName}
void selectProxyInGroup(proxyGroup, name) isSelected={proxyGroup.now === proxyName}
onClick={() =>
void selectProxyInGroup(proxyGroup, proxyName)
} }
/> />
)}
</For>
</Collapse> </Collapse>
) )
}} }}
@ -234,7 +237,7 @@ export default () => {
const title = ( const title = (
<> <>
<div class="mr-8 flex items-center justify-between"> <div class="flex items-center justify-between pr-8">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<span>{proxyProvider.name}</span> <span>{proxyProvider.name}</span>
<div class="badge badge-sm"> <div class="badge badge-sm">
@ -247,7 +250,7 @@ export default () => {
class="btn btn-circle btn-sm" class="btn btn-circle btn-sm"
disabled={updatingMap()[proxyProvider.name]} disabled={updatingMap()[proxyProvider.name]}
onClick={(e) => onClick={(e) =>
onUpdateProviderClick(e, proxyProvider.name) onUpdateProxyProviderClick(e, proxyProvider.name)
} }
icon={ icon={
<IconReload <IconReload
@ -263,7 +266,10 @@ export default () => {
class="btn btn-circle btn-sm" class="btn btn-circle btn-sm"
disabled={healthCheckingMap()[proxyProvider.name]} disabled={healthCheckingMap()[proxyProvider.name]}
onClick={(e) => onClick={(e) =>
onHealthCheckClick(e, proxyProvider.name) onProxyProviderLatencyTestClick(
e,
proxyProvider.name,
)
} }
icon={ icon={
<IconBrandSpeedtest <IconBrandSpeedtest
@ -300,7 +306,9 @@ export default () => {
setCollapsedMap(proxyProvider.name, val) setCollapsedMap(proxyProvider.name, val)
} }
> >
<ProxyCardGroups proxyNames={sortedProxyNames()} /> <For each={sortedProxyNames()}>
{(proxyName) => <ProxyNodeCard proxyName={proxyName} />}
</For>
</Collapse> </Collapse>
) )
}} }}

42
src/signals/proxies.ts
View File

@ -5,7 +5,6 @@ import {
fetchProxyProvidersAPI, fetchProxyProvidersAPI,
proxyGroupLatencyTestAPI, proxyGroupLatencyTestAPI,
proxyLatencyTestAPI, proxyLatencyTestAPI,
proxyProviderHealthCheck,
selectProxyInGroupAPI, selectProxyInGroupAPI,
updateProxyProviderAPI, updateProxyProviderAPI,
} from '~/apis' } from '~/apis'
@ -31,6 +30,11 @@ type ProxyInfo = {
const { map: collapsedMap, set: setCollapsedMap } = useStringBooleanMap() const { map: collapsedMap, set: setCollapsedMap } = useStringBooleanMap()
const { map: latencyTestingMap, setWithCallback: setLatencyTestingMap } = const { map: latencyTestingMap, setWithCallback: setLatencyTestingMap } =
useStringBooleanMap() useStringBooleanMap()
const { map: healthCheckingMap, setWithCallback: setHealthCheckingMap } =
useStringBooleanMap()
const { map: updatingMap, setWithCallback: setUpdatingMap } =
useStringBooleanMap()
const [isAllProviderUpdating, setIsAllProviderUpdating] = createSignal(false)
// these signals should be global state // these signals should be global state
const [proxies, setProxies] = createSignal<Proxy[]>([]) const [proxies, setProxies] = createSignal<Proxy[]>([])
@ -132,8 +136,9 @@ export const useProxies = () => {
})) }))
} }
const proxyGroupLatencyTest = async (proxyGroupName: string) => { const proxyGroupLatencyTest = async (proxyGroupName: string) =>
const data = await proxyGroupLatencyTestAPI( setLatencyTestingMap(proxyGroupName, async () => {
const newLatencyMap = await proxyGroupLatencyTestAPI(
proxyGroupName, proxyGroupName,
urlForLatencyTest(), urlForLatencyTest(),
latencyTestTimeoutDuration(), latencyTestTimeoutDuration(),
@ -141,36 +146,47 @@ export const useProxies = () => {
setLatencyMap((latencyMap) => ({ setLatencyMap((latencyMap) => ({
...latencyMap, ...latencyMap,
...data, ...newLatencyMap,
})) }))
await fetchProxies() await fetchProxies()
} })
const updateProviderByProviderName = async (providerName: string) => { const updateProviderByProviderName = async (providerName: string) =>
setUpdatingMap(providerName, async () => {
try { try {
await updateProxyProviderAPI(providerName) await updateProxyProviderAPI(providerName)
} catch {} } catch {}
await fetchProxies() await fetchProxies()
} })
const updateAllProvider = async () => { const updateAllProvider = async () => {
setIsAllProviderUpdating(true)
try {
await Promise.allSettled( await Promise.allSettled(
proxyProviders().map((provider) => updateProxyProviderAPI(provider.name)), proxyProviders().map((provider) =>
updateProxyProviderAPI(provider.name),
),
) )
await fetchProxies() await fetchProxies()
} finally {
setIsAllProviderUpdating(false)
}
} }
const healthCheckByProviderName = async (providerName: string) => { const proxyProviderLatencyTest = (providerName: string) =>
await proxyProviderHealthCheck(providerName) setHealthCheckingMap(providerName, async () => {
await proxyProviderLatencyTest(providerName)
await fetchProxies() await fetchProxies()
} })
return { return {
collapsedMap, collapsedMap,
setCollapsedMap, setCollapsedMap,
latencyTestingMap, latencyTestingMap,
setLatencyTestingMap, healthCheckingMap,
updatingMap,
isAllProviderUpdating,
proxies, proxies,
proxyProviders, proxyProviders,
proxyLatencyTest, proxyLatencyTest,
@ -181,6 +197,6 @@ export const useProxies = () => {
selectProxyInGroup, selectProxyInGroup,
updateProviderByProviderName, updateProviderByProviderName,
updateAllProvider, updateAllProvider,
healthCheckByProviderName, proxyProviderLatencyTest,
} }
} }