diff --git a/src/pages/Connections.tsx b/src/pages/Connections.tsx
index 8bc27b3..d042d96 100644
--- a/src/pages/Connections.tsx
+++ b/src/pages/Connections.tsx
@@ -10,7 +10,7 @@ import byteSize from 'byte-size'
import { isIPv6 } from 'is-ip'
import { For, createSignal } from 'solid-js'
import { secret, wsEndpointURL } from '~/signals'
-import type { Connection } from '../types'
+import type { Connection } from '~/types'
export const Connections = () => {
const [search, setSearch] = createSignal('')
diff --git a/src/pages/Overview.tsx b/src/pages/Overview.tsx
index a4af9ca..fc229ce 100644
--- a/src/pages/Overview.tsx
+++ b/src/pages/Overview.tsx
@@ -3,7 +3,14 @@ import { createReconnectingWS } from '@solid-primitives/websocket'
import { ApexOptions } from 'apexcharts'
import byteSize from 'byte-size'
import { SolidApexCharts } from 'solid-apexcharts'
-import { createEffect, createMemo, createSignal } from 'solid-js'
+import {
+ JSX,
+ ParentComponent,
+ children,
+ createEffect,
+ createMemo,
+ createSignal,
+} from 'solid-js'
import { secret, wsEndpointURL } from '~/signals'
import type { Connection } from '~/types'
@@ -34,6 +41,15 @@ const defaultChartOptions: ApexOptions = {
},
}
+const TrafficWidget: ParentComponent<{ label: JSX.Element }> = (props) => (
+
+
{props.label}
+
+ {children(() => props.children)()}
+
+
+)
+
export const Overview = () => {
const [traffics, setTraffics] = createSignal<{ down: number; up: number }[]>(
[],
@@ -134,45 +150,30 @@ export const Overview = () => {
return (
-
-
-
Upload
-
- {byteSize(traffic()?.up || 0).toString()}/s
-
-
-
-
Download
-
- {byteSize(traffic()?.down || 0).toString()}/s
-
-
-
-
Upload Total
-
- {byteSize(connection()?.uploadTotal || 0).toString()}
-
-
-
-
Download Total
-
- {byteSize(connection()?.downloadTotal || 0).toString()}
-
-
-
-
- Active Connections
-
-
- {connection()?.connections.length || 0}
-
-
-
-
Memory Usage
-
- {byteSize(memory() || 0).toString()}
-
-
+
+
+ {byteSize(traffic()?.up || 0).toString()}/s
+
+
+
+ {byteSize(traffic()?.down || 0).toString()}/s
+
+
+
+ {byteSize(connection()?.uploadTotal || 0).toString()}
+
+
+
+ {byteSize(connection()?.downloadTotal || 0).toString()}
+
+
+
+ {connection()?.connections.length || 0}
+
+
+
+ {byteSize(memory() || 0).toString()}
+
diff --git a/src/pages/Proxies.tsx b/src/pages/Proxies.tsx
index a979458..1aca8ce 100644
--- a/src/pages/Proxies.tsx
+++ b/src/pages/Proxies.tsx
@@ -1,6 +1,6 @@
import { For, createSignal, onMount } from 'solid-js'
import { useRequest } from '~/signals'
-import { Proxy, ProxyProvider } from '~/types'
+import type { Proxy, ProxyProvider } from '~/types'
export const Proxies = () => {
const request = useRequest()