Public-Mirror/metacubexd
1
0
Fork 0
mirror of https://github.com/MetaCubeX/metacubexd.git synced 2024-11-23 21:35:36 +08:00
Code Issues Projects Releases Wiki Activity

refactor: replace buttons with custom button component

Browse Source
This commit is contained in:
kunish 2023-09-03 02:31:06 +08:00
parent 0d46d1df19
commit 071a607124
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
7 changed files with 45 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/ConnectionsModal.tsx
View File

@ -14,6 +14,7 @@ import {
useDragDropContext,
} from '@thisbeyond/solid-dnd'
import { For, Show, createSignal } from 'solid-js'
import { Button } from '~/components/Button'
import {
AccessorKey,
initColumnOrder,
@ -109,15 +110,15 @@ export default (props: {
</DragOverlay>
</DragDropProvider>
<button
class="btn btn-neutral btn-sm ml-auto mt-4 block"
<Button
class="btn-neutral btn-sm ml-auto mt-4 block"
onClick={() => {
props.onOrderChange(initColumnOrder)
props.onVisibleChange(initColumnVisibility)
}}
>
{t('reset')}
</button>
</Button>
</div>
<label class="modal-backdrop" for="connection-modal" />

13
src/components/Header.tsx
View File

@ -15,6 +15,7 @@ import {
} from '@tabler/icons-solidjs'
import { For, ParentComponent, Show, createMemo, createSignal } from 'solid-js'
import { twMerge } from 'tailwind-merge'
import { Button } from '~/components/Button'
import { LANG, ROUTE } from '~/config/enum'
import { themes } from '~/constants'
import { setCurTheme, setSelectedEndpoint } from '~/signals'
@ -181,8 +182,8 @@ export const Header = () => {
<div class="navbar-end">
<div class="flex items-center gap-2">
<button
class="btn btn-circle btn-sm"
<Button
class="btn-circle btn-sm"
onClick={() => {
const curLocale = locale()
@ -190,16 +191,16 @@ export const Header = () => {
}}
>
<IconLanguage />
</button>
</Button>
<ThemeSwitcher />
<button
class="btn btn-circle btn-secondary btn-sm"
<Button
class="btn-circle btn-secondary btn-sm"
onClick={onSwitchEndpointClick}
>
<IconArrowsExchange />
</button>
</Button>
</div>
</div>
</ul>

13
src/pages/Connections.tsx
View File

@ -20,6 +20,7 @@ import byteSize from 'byte-size'
import { isIPv6 } from 'is-ip'
import { For, createEffect, createSignal } from 'solid-js'
import { twMerge } from 'tailwind-merge'
import { Button } from '~/components/Button'
import ConnectionsModal from '~/components/ConnectionsModal'
import {
AccessorKey,
@ -111,22 +112,22 @@ export default () => {
accessorKey: AccessorKey.Close,
header: () => (
<div class="flex h-full items-center">
<button
class="btn btn-circle btn-xs"
<Button
class="btn-circle btn-xs"
onClick={() => request.delete('connections')}
>
<IconCircleX size="18" />
</button>
</Button>
</div>
),
cell: ({ row }) => (
<div class="flex h-full items-center">
<button
class="btn btn-circle btn-xs"
<Button
class="btn-circle btn-xs"
onClick={() => onCloseConnection(row.id)}
>
<IconCircleX size="18" />
</button>
</Button>
</div>
),
},

7
src/pages/Proxies.tsx
View File

@ -1,6 +1,7 @@
import { useI18n } from '@solid-primitives/i18n'
import { IconBrandSpeedtest } from '@tabler/icons-solidjs'
import { Show, createSignal } from 'solid-js'
import { Button } from '~/components/Button'
import Collapse from '~/components/Collpase'
import ForTwoColumns from '~/components/ForTwoColumns'
import ProxyCardGroups from '~/components/ProxyCardGroups'
@ -42,12 +43,12 @@ export default () => {
<>
<div class="mr-10 flex items-center justify-between">
<span>{proxy.name}</span>
<button
class="btn btn-circle btn-sm"
<Button
class="btn-circle btn-sm"
onClick={(e) => onSpeedTestClick(e, proxy.name)}
>
<IconBrandSpeedtest />
</button>
</Button>
</div>
<div class="text-sm text-slate-500">
{proxy.type} :: {proxy.now}

17
src/pages/ProxyProvider.tsx
View File

@ -1,6 +1,7 @@
import { useI18n } from '@solid-primitives/i18n'
import { IconBrandSpeedtest, IconReload } from '@tabler/icons-solidjs'
import { Show, createSignal } from 'solid-js'
import { Button } from '~/components/Button'
import Collapse from '~/components/Collpase'
import ForTwoColumns from '~/components/ForTwoColumns'
import ProxyCardGroups from '~/components/ProxyCardGroups'
@ -53,12 +54,13 @@ export default () => {
<div class="flex flex-col gap-2">
<h1 class="flex h-8 items-center pb-2 text-lg font-semibold">
{t('proxyProviders')}
<button
class="btn btn-circle btn-ghost btn-sm ml-2"
<Button
class="btn-circle btn-ghost btn-sm ml-2"
onClick={(e) => onUpdateAllProviderClick(e)}
>
<IconReload />
</button>
</Button>
</h1>
<ForTwoColumns
subChild={proxyProviders().map((proxyProvider) => {
@ -67,20 +69,21 @@ export default () => {
<div class="mr-8 flex items-center justify-between">
<span>{proxyProvider.name}</span>
<div>
<button
<Button
class="btn btn-circle btn-sm mr-2"
onClick={(e) =>
onUpdateProviderClick(e, proxyProvider.name)
}
>
<IconReload />
</button>
<button
</Button>
<Button
class="btn btn-circle btn-sm"
onClick={(e) => onHealthCheckClick(e, proxyProvider.name)}
>
<IconBrandSpeedtest />
</button>
</Button>
</div>
</div>
<SubscriptionInfo

13
src/pages/Rules.tsx
View File

@ -2,6 +2,7 @@ import { useI18n } from '@solid-primitives/i18n'
import { IconReload } from '@tabler/icons-solidjs'
import InfiniteScroll from 'solid-infinite-scroll'
import { For, Show, createMemo, createSignal, onMount } from 'solid-js'
import { Button } from '~/components/Button'
import { useRules } from '~/signals/rules'
import { formatTimeFromNow, getBtnElFromClickEvent } from '~/utils/proxies'
@ -67,12 +68,12 @@ export default () => {
<div class="flex-1">
<h1 class="flex h-11 items-center pb-4 text-lg font-semibold">
{t('ruleProviders')}
<button
class="btn btn-circle btn-ghost btn-sm ml-2"
<Button
class="btn-circle btn-ghost btn-sm ml-2"
onClick={(e) => onUpdateAllProviderClick(e)}
>
<IconReload />
</button>
</Button>
</h1>
<For each={rulesProviders()}>
@ -83,14 +84,14 @@ export default () => {
{rulesProvider.name} ({rulesProvider.ruleCount})
</span>
<div>
<button
class="btn btn-circle btn-sm mr-2"
<Button
class="btn-circle btn-sm mr-2"
onClick={(e) =>
onUpdateProviderClick(e, rulesProvider.name)
}
>
<IconReload />
</button>
</Button>
</div>
</div>
<div class="text-xs text-slate-500">

11
src/pages/Setup.tsx
View File

@ -7,6 +7,7 @@ import ky from 'ky'
import { For, onMount } from 'solid-js'
import { v4 as uuid } from 'uuid'
import { z } from 'zod'
import { Button } from '~/components/Button'
import { endpointList, setEndpointList, setSelectedEndpoint } from '~/signals'
const schema = z.object({
@ -122,9 +123,9 @@ export default () => {
placeholder="secret"
/>
<button type="submit" class="btn btn-primary join-item uppercase">
<Button type="submit" class="btn-primary join-item uppercase">
{t('add')}
</button>
</Button>
</div>
</form>
@ -137,15 +138,15 @@ export default () => {
>
{url}
<button
class="btn btn-circle btn-ghost btn-xs text-white"
<Button
class="btn-circle btn-ghost btn-xs text-white"
onClick={(e) => {
e.stopPropagation()
onRemove(id)
}}
>
<IconX />
</button>
</Button>
</div>
)}
</For>