fankes/beszel
2
0
Fork 0
mirror of https://github.com/fankes/beszel.git synced 2025-10-19 17:59:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

replace icon and remove unneeded usememo in system.tsx

Browse Source
This commit is contained in:
Henry Dollman
2024-09-27 13:06:31 -04:00
parent cc32b50d82
commit fe5732d75a
2 changed files with 17 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
beszel/site/src/components/routes/system.tsx
View File

@@ -4,15 +4,7 @@ import { Suspense, lazy, useCallback, useEffect, useMemo, useRef, useState } fro
import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '../ui/card'
import { useStore } from '@nanostores/react'
import Spinner from '../spinner'
import {
ClockArrowUp,
CpuIcon,
GlobeIcon,
LayoutGridIcon,
MonitorIcon,
StretchHorizontalIcon,
XIcon,
} from 'lucide-react'
import { ClockArrowUp, CpuIcon, GlobeIcon, LayoutGridIcon, MonitorIcon, XIcon } from 'lucide-react'
import ChartTimeSelect from '../charts/chart-time-select'
import {
chartTimeData,
@@ -26,7 +18,7 @@ import { scaleTime } from 'd3-scale'
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../ui/tooltip'
import { Button, buttonVariants } from '../ui/button'
import { Input } from '../ui/input'
import { TuxIcon } from '../ui/icons'
import { Rows, TuxIcon } from '../ui/icons'
const CpuChart = lazy(() => import('../charts/cpu-chart'))
const ContainerCpuChart = lazy(() => import('../charts/container-cpu-chart'))
@@ -46,7 +38,6 @@ export default function SystemDetail({ name }: { name: string }) {
const [ticks, setTicks] = useState([] as number[])
const [system, setSystem] = useState({} as SystemRecord)
const [systemStats, setSystemStats] = useState([] as SystemStatsRecord[])
const [hasDockerStats, setHasDocker] = useState(false)
const netCardRef = useRef<HTMLDivElement>(null)
const [dockerCpuChartData, setDockerCpuChartData] = useState<Record<string, number | string>[]>(
[]
@@ -57,6 +48,7 @@ export default function SystemDetail({ name }: { name: string }) {
const [dockerNetChartData, setDockerNetChartData] = useState<Record<string, number | number[]>[]>(
[]
)
const hasDockerStats = dockerCpuChartData.length > 0
useEffect(() => {
document.title = `${name} / Beszel`
@@ -64,7 +56,7 @@ export default function SystemDetail({ name }: { name: string }) {
resetCharts()
$chartTime.set($userSettings.get().chartTime)
$containerFilter.set('')
setHasDocker(false)
// setHasDocker(false)
}
}, [name])
@@ -148,7 +140,6 @@ export default function SystemDetail({ name }: { name: string }) {
const expectedInterval = chartTimeData[chartTime].expectedInterval
if (containerStats.status === 'fulfilled' && containerStats.value.length) {
makeContainerData(addEmptyValues(containerStats.value, expectedInterval))
setHasDocker(true)
}
if (systemStats.status === 'fulfilled') {
setSystemStats(addEmptyValues(systemStats.value, expectedInterval))
@@ -321,7 +312,7 @@ export default function SystemDetail({ name }: { name: string }) {
{grid ? (
<LayoutGridIcon className="h-[1.2rem] w-[1.2rem] opacity-85" />
) : (
<StretchHorizontalIcon className="h-[1.2rem] w-[1.2rem] opacity-85" />
<Rows className="h-[1.3rem] w-[1.3rem] opacity-85" />
)}
</Button>
</TooltipTrigger>

12
beszel/site/src/components/ui/icons.tsx
View File

@@ -11,3 +11,15 @@ export function TuxIcon(props: SVGProps<SVGSVGElement>) {
</svg>
)
}
// MingCute Apache License 2.0 https://github.com/Richard9394/MingCute
export function Rows(props: SVGProps<SVGSVGElement>) {
return (
<svg viewBox="0 0 24 24" {...props}>
<path
fill="currentColor"
d="M5 3a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2zm0 2h14v4H5zm0 8a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2zm0 2h14v4H5z"
/>
</svg>
)
}