wood/clash-and-dashboard
1
0
Fork 0
mirror of https://github.com/woodchen-ink/clash-and-dashboard.git synced 2025-07-19 14:31:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

Chore: update dependencies

Browse Source
This commit is contained in:
Dreamacro 2022-07-26 10:30:25 +08:00
parent 634b19ab4e
commit ae31d8097a
6 changed files with 907 additions and 934 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
package.json
View File

@ -26,43 +26,44 @@
}, },
"devDependencies": { "devDependencies": {
"@types/lodash-es": "^4.17.6", "@types/lodash-es": "^4.17.6",
"@types/node": "^18.0.0", "@types/node": "^18.6.1",
"@types/react": "^18.0.14", "@types/react": "^18.0.15",
"@types/react-dom": "^18.0.5", "@types/react-dom": "^18.0.6",
"@types/react-virtualized-auto-sizer": "^1.0.1", "@types/react-virtualized-auto-sizer": "^1.0.1",
"@types/react-window": "^1.8.5", "@types/react-window": "^1.8.5",
"@typescript-eslint/eslint-plugin": "^5.30.0", "@typescript-eslint/eslint-plugin": "^5.31.0",
"@typescript-eslint/parser": "^5.30.0", "@typescript-eslint/parser": "^5.31.0",
"@vitejs/plugin-react": "^1.3.2", "@vitejs/plugin-react": "^2.0.0",
"eslint": "^8.18.0", "eslint": "^8.20.0",
"eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-typescript": "^17.0.0", "eslint-config-airbnb-typescript": "^17.0.0",
"eslint-config-standard-with-typescript": "^21.0.1", "eslint-config-standard-with-typescript": "^22.0.0",
"eslint-import-resolver-typescript": "^3.1.1", "eslint-import-resolver-typescript": "^3.3.0",
"eslint-plugin-import": "^2.26.0", "eslint-plugin-import": "^2.26.0",
"eslint-plugin-n": "^15.2.4",
"eslint-plugin-node": "^11.1.0", "eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^6.0.0", "eslint-plugin-promise": "^6.0.0",
"eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-hooks": "^4.6.0",
"sass": "^1.53.0", "sass": "^1.54.0",
"type-fest": "^2.14.0", "type-fest": "^2.17.0",
"typescript": "^4.7.4", "typescript": "^4.7.4",
"vite": "^2.9.13", "vite": "^3.0.3",
"vite-plugin-pwa": "^0.12.0", "vite-plugin-pwa": "^0.12.3",
"vite-plugin-windicss": "^1.8.5", "vite-plugin-windicss": "^1.8.7",
"vite-tsconfig-paths": "^3.5.0", "vite-tsconfig-paths": "^3.5.0",
"windicss": "^3.5.5" "windicss": "^3.5.6"
}, },
"dependencies": { "dependencies": {
"@react-hookz/web": "^14.3.0", "@react-hookz/web": "^15.0.1",
"@tanstack/react-table": "^8.0.6", "@tanstack/react-table": "^8.3.3",
"axios": "^0.27.2", "axios": "^0.27.2",
"classnames": "^2.3.1", "classnames": "^2.3.1",
"dayjs": "^1.11.3", "dayjs": "^1.11.4",
"eventemitter3": "^4.0.7", "eventemitter3": "^4.0.7",
"immer": "^9.0.15", "immer": "^9.0.15",
"jotai": "^1.7.2", "jotai": "^1.7.6",
"lodash-es": "^4.17.21", "lodash-es": "^4.17.21",
"neverthrow": "^4.3.1", "neverthrow": "^4.4.2",
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",

1759
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

32
src/containers/Connections/index.tsx
View File

@ -1,5 +1,5 @@
import { useIntersectionObserver, useSyncedRef, useUnmountEffect } from '@react-hookz/web/esm' import { useIntersectionObserver, useSyncedRef, useUnmountEffect } from '@react-hookz/web/esm'
import { useTableInstance, createTable, getSortedRowModel, getFilteredRowModel, getCoreRowModel } from '@tanstack/react-table' import { useReactTable, getSortedRowModel, getFilteredRowModel, getCoreRowModel, flexRender, createColumnHelper } from '@tanstack/react-table'
import classnames from 'classnames' import classnames from 'classnames'
import { groupBy } from 'lodash-es' import { groupBy } from 'lodash-es'
import { useMemo, useLayoutEffect, useRef, useState, useEffect } from 'react' import { useMemo, useLayoutEffect, useRef, useState, useEffect } from 'react'
@ -45,7 +45,7 @@ function formatSpeed (upload: number, download: number) {
} }
} }
const table = createTable().setRowType<FormatConnection>() const columnHelper = createColumnHelper<FormatConnection>()
export default function Connections () { export default function Connections () {
const { translation, lang } = useI18n() const { translation, lang } = useI18n()
@ -99,13 +99,13 @@ export default function Connections () {
const intersection = useIntersectionObserver(pinRef, { threshold: [1] }) const intersection = useIntersectionObserver(pinRef, { threshold: [1] })
const columns = useMemo( const columns = useMemo(
() => [ () => [
table.createDataColumn(Columns.Host, { minSize: 260, size: 260, header: t(`columns.${Columns.Host}`) }), columnHelper.accessor(Columns.Host, { minSize: 260, size: 260, header: t(`columns.${Columns.Host}`) }),
table.createDataColumn(Columns.Network, { minSize: 80, size: 80, header: t(`columns.${Columns.Network}`) }), columnHelper.accessor(Columns.Network, { minSize: 80, size: 80, header: t(`columns.${Columns.Network}`) }),
table.createDataColumn(Columns.Type, { minSize: 100, size: 100, header: t(`columns.${Columns.Type}`) }), columnHelper.accessor(Columns.Type, { minSize: 100, size: 100, header: t(`columns.${Columns.Type}`) }),
table.createDataColumn(Columns.Chains, { minSize: 200, size: 200, header: t(`columns.${Columns.Chains}`) }), columnHelper.accessor(Columns.Chains, { minSize: 200, size: 200, header: t(`columns.${Columns.Chains}`) }),
table.createDataColumn(Columns.Rule, { minSize: 140, size: 140, header: t(`columns.${Columns.Rule}`) }), columnHelper.accessor(Columns.Rule, { minSize: 140, size: 140, header: t(`columns.${Columns.Rule}`) }),
table.createDataColumn(Columns.Process, { minSize: 100, size: 100, header: t(`columns.${Columns.Process}`), cell: cell => cell.getValue() ? basePath(cell.getValue()!) : '-' }), columnHelper.accessor(Columns.Process, { minSize: 100, size: 100, header: t(`columns.${Columns.Process}`), cell: cell => cell.getValue() ? basePath(cell.getValue()!) : '-' }),
table.createDataColumn( columnHelper.accessor(
row => [row.speed.upload, row.speed.download], row => [row.speed.upload, row.speed.download],
{ {
id: Columns.Speed, id: Columns.Speed,
@ -123,10 +123,10 @@ export default function Connections () {
cell: cell => formatSpeed(cell.getValue()[0], cell.getValue()[1]), cell: cell => formatSpeed(cell.getValue()[0], cell.getValue()[1]),
}, },
), ),
table.createDataColumn(Columns.Upload, { minSize: 100, size: 100, header: t(`columns.${Columns.Upload}`), cell: cell => formatTraffic(cell.getValue()) }), columnHelper.accessor(Columns.Upload, { minSize: 100, size: 100, header: t(`columns.${Columns.Upload}`), cell: cell => formatTraffic(cell.getValue()) }),
table.createDataColumn(Columns.Download, { minSize: 100, size: 100, header: t(`columns.${Columns.Download}`), cell: cell => formatTraffic(cell.getValue()) }), columnHelper.accessor(Columns.Download, { minSize: 100, size: 100, header: t(`columns.${Columns.Download}`), cell: cell => formatTraffic(cell.getValue()) }),
table.createDataColumn(Columns.SourceIP, { minSize: 140, size: 140, header: t(`columns.${Columns.SourceIP}`), filterFn: 'equals' }), columnHelper.accessor(Columns.SourceIP, { minSize: 140, size: 140, header: t(`columns.${Columns.SourceIP}`), filterFn: 'equals' }),
table.createDataColumn( columnHelper.accessor(
Columns.Time, Columns.Time,
{ {
minSize: 120, minSize: 120,
@ -161,7 +161,7 @@ export default function Connections () {
readerRef.current?.destory() readerRef.current?.destory()
}) })
const instance = useTableInstance(table, { const instance = useReactTable({
data, data,
columns, columns,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
@ -223,7 +223,7 @@ export default function Connections () {
ref={column.id === Columns.Host ? pinRef : undefined} ref={column.id === Columns.Host ? pinRef : undefined}
key={id}> key={id}>
<div onClick={column.getToggleSortingHandler()}> <div onClick={column.getToggleSortingHandler()}>
{header.renderHeader()} { flexRender(header.column.columnDef.header, header.getContext()) }
{ {
column.getIsSorted() !== false column.getIsSorted() !== false
? column.getIsSorted() === 'desc' ? ' ↓' : ' ↑' ? column.getIsSorted() === 'desc' ? ' ↓' : ' ↑'
@ -261,7 +261,7 @@ export default function Connections () {
className={classname} className={classname}
style={{ width: cell.column.getSize() }} style={{ width: cell.column.getSize() }}
key={cell.column.id}> key={cell.column.id}>
{ cell.renderCell() } { flexRender(cell.column.columnDef.cell, cell.getContext()) }
</td> </td>
) )
}) })

4
src/lib/streamer.ts
View File

@ -28,6 +28,10 @@ export class StreamReader<T> {
} }
protected connectWebsocket () { protected connectWebsocket () {
if (!this.url) {
return
}
const url = new URL(this.url) const url = new URL(this.url)
this.connection = new WebSocket(url.toString()) this.connection = new WebSocket(url.toString())

2
src/stores/jotai.ts
View File

@ -169,7 +169,7 @@ export function useProxy () {
.filter(key => !unUsedProxy.has(key)) .filter(key => !unUsedProxy.has(key))
.map(key => ({ ...allProxies.data.proxies[key], name: key })) .map(key => ({ ...allProxies.data.proxies[key], name: key }))
const [proxy, groups] = partition(proxies, proxy => !policyGroup.has(proxy.type)) const [proxy, groups] = partition(proxies, proxy => !policyGroup.has(proxy.type))
set({ proxies: proxy as API.Proxy[], groups: groups as API.Group[], global: global }) set({ proxies: proxy as API.Proxy[], groups: groups as API.Group[], global })
}) })
const markProxySelected = useCallback((name: string, selected: string) => { const markProxySelected = useCallback((name: string, selected: string) => {

3
vite.config.ts
View File

@ -30,6 +30,9 @@ export default defineConfig(
}), }),
splitVendorChunkPlugin(), splitVendorChunkPlugin(),
], ],
server: {
port: 3000,
},
base: './', base: './',
css: { css: {
preprocessorOptions: { preprocessorOptions: {