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

updates

Browse Source
This commit is contained in:
Henry Dollman
2024-07-12 23:56:58 -04:00
parent 05f5c94764
commit 7e834429cc
8 changed files with 123 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
dockerfile
View File

@@ -26,4 +26,6 @@ COPY ./site/dist /site/dist
EXPOSE 8080
CMD ["/server", "serve", "--http=0.0.0.0:8080"]
ENTRYPOINT [ "/server" ]
CMD ["serve", "--http=0.0.0.0:8080"]

BIN
site/bun.lockb
View File

Binary file not shown.

88
site/package.json
View File

@@ -1,46 +1,46 @@
{
"name": "site",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"@nanostores/react": "^0.7.2",
"@nanostores/router": "^0.15.0",
"@radix-ui/react-alert-dialog": "^1.1.1",
"@radix-ui/react-dialog": "^1.1.1",
"@radix-ui/react-dropdown-menu": "^2.1.1",
"@radix-ui/react-label": "^2.1.0",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-toast": "^1.2.1",
"@radix-ui/react-tooltip": "^1.1.2",
"@tanstack/react-table": "^8.19.2",
"@vitejs/plugin-react": "^4.3.1",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"cmdk": "^1.0.0",
"lucide-react": "^0.407.0",
"nanostores": "^0.10.3",
"pocketbase": "^0.21.3",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"recharts": "^2.12.7",
"tailwind-merge": "^2.4.0",
"tailwindcss-animate": "^1.0.7",
"valibot": "^0.36.0"
},
"devDependencies": {
"@types/bun": "^1.1.6",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"autoprefixer": "^10.4.19",
"postcss": "^8.4.39",
"tailwindcss": "^3.4.4",
"typescript": "^5.5.3",
"vite": "^5.3.3"
}
"name": "site",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"@nanostores/react": "^0.7.2",
"@nanostores/router": "^0.15.0",
"@radix-ui/react-alert-dialog": "^1.1.1",
"@radix-ui/react-dialog": "^1.1.1",
"@radix-ui/react-dropdown-menu": "^2.1.1",
"@radix-ui/react-label": "^2.1.0",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-toast": "^1.2.1",
"@radix-ui/react-tooltip": "^1.1.2",
"@tanstack/react-table": "^8.19.2",
"@vitejs/plugin-react": "^4.3.1",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"cmdk": "^1.0.0",
"lucide-react": "^0.407.0",
"nanostores": "^0.10.3",
"pocketbase": "^0.21.3",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"recharts": "^2.13.0-alpha.1",
"tailwind-merge": "^2.4.0",
"tailwindcss-animate": "^1.0.7",
"valibot": "^0.36.0"
},
"devDependencies": {
"@types/bun": "^1.1.6",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"autoprefixer": "^10.4.19",
"postcss": "^8.4.39",
"tailwindcss": "^3.4.4",
"typescript": "^5.5.3",
"vite": "^5.3.3"
}
}

2
site/src/components/add-server.tsx
View File

@@ -77,7 +77,7 @@ export function AddServerButton() {
<DialogTrigger asChild>
<Button variant="outline" className="flex gap-1">
<Plus className="h-4 w-4 mr-auto" />
Add Server
Add <span className="hidden sm:inline">Server</span>
</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-[425px]">

2
site/src/components/login.tsx
View File

@@ -29,7 +29,7 @@ export default function () {
</div>
<div className="relative hidden h-full flex-col bg-muted p-10 text-white dark:border-r lg:flex">
<div
className="absolute inset-0 bg-slate-900 bg-cover opacity-80"
className="absolute inset-0 bg-background bg-cover opacity-80"
style={{
backgroundImage: `url(https://directus.cloud/assets/waves.2b156907.svg)`,
}}

34
site/src/components/server-table/data-table.tsx
View File

@@ -27,7 +27,6 @@ import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/components/ui/dropdown-menu'
@@ -53,6 +52,9 @@ import {
MemoryStick,
HardDrive,
CopyIcon,
PauseCircleIcon,
PlayCircleIcon,
Trash2Icon,
} from 'lucide-react'
import { useMemo, useState } from 'react'
import { $servers, pb, navigate } from '@/lib/stores'
@@ -62,12 +64,6 @@ import { cn, copyToClipboard } from '@/lib/utils'
function CellFormatter(info: CellContext<SystemRecord, unknown>) {
const val = info.getValue() as number
// let color = 'green'
// if (val > 80) {
// color = 'red'
// } else if (val > 50) {
// color = 'yellow'
// }
return (
<div className="flex gap-2 items-center">
<span className="grow min-w-10 block bg-muted h-4 relative rounded-sm overflow-hidden">
@@ -181,14 +177,28 @@ export default function () {
})
}}
>
{status === 'paused' ? 'Resume' : 'Pause'}
{status === 'paused' ? (
<>
<PlayCircleIcon className="mr-2.5 h-4 w-4" />
Resume
</>
) : (
<>
<PauseCircleIcon className="mr-2.5 h-4 w-4" />
Pause
</>
)}
</DropdownMenuItem>
<DropdownMenuItem onClick={() => copyToClipboard(host)}>
<CopyIcon className="mr-2.5 h-4 w-4" />
Copy host
</DropdownMenuItem>
<DropdownMenuSeparator />
<AlertDialogTrigger asChild>
<DropdownMenuItem>Delete server</DropdownMenuItem>
<DropdownMenuItem>
<Trash2Icon className="mr-2.5 h-4 w-4" />
Delete
</DropdownMenuItem>
</AlertDialogTrigger>
</DropdownMenuContent>
</DropdownMenu>
@@ -236,7 +246,7 @@ export default function () {
return (
<>
<div className="w-full">
<div className="flex items-center mb-4">
<div className="flex items-center mb-4 gap-2">
<Input
// @ts-ignore
placeholder="Filter..."
@@ -271,7 +281,9 @@ export default function () {
<TableRow
key={row.original.id}
data-state={row.getIsSelected() && 'selected'}
className="cursor-pointer"
className={cn('cursor-pointer transition-opacity', {
'opacity-50': row.original.status === 'paused',
})}
onClick={(e) => {
const target = e.target as HTMLElement
if (target.tagName !== 'BUTTON' && !target.hasAttribute('role')) {

8
site/src/components/ui/chart.tsx
View File

@@ -124,15 +124,13 @@ const ChartTooltipContent = React.forwardRef<
) => {
const { config } = useChart()
payload = React.useMemo(() => {
React.useMemo(() => {
if (itemSorter) {
return payload.sort(itemSorter)
// @ts-ignore
payload?.sort(itemSorter)
}
return payload
}, [itemSorter, payload])
// console.log('iiiiii', itemSorter)
const tooltipLabel = React.useMemo(() => {
if (hideLabel || !payload?.length) {
return null

54
site/src/main.tsx
View File

@@ -3,11 +3,11 @@ import React, { Suspense, lazy, useEffect } from 'react'
import ReactDOM from 'react-dom/client'
import Home from './components/routes/home.tsx'
import { ThemeProvider } from './components/theme-provider.tsx'
import { $authenticated, $router, $servers, navigate } from './lib/stores.ts'
import { $authenticated, $router, $servers, navigate, pb } from './lib/stores.ts'
import { ModeToggle } from './components/mode-toggle.tsx'
import { cn, updateFavicon, updateServerList } from './lib/utils.ts'
import { buttonVariants } from './components/ui/button.tsx'
import { Github } from 'lucide-react'
import { DatabaseBackupIcon, Github, LogOutIcon, LogsIcon, UserIcon } from 'lucide-react'
import { useStore } from '@nanostores/react'
import { Toaster } from './components/ui/toaster.tsx'
import { Logo } from './components/logo.tsx'
@@ -17,6 +17,13 @@ import {
TooltipTrigger,
TooltipContent,
} from '@/components/ui/tooltip.tsx'
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from './components/ui/dropdown-menu.tsx'
const ServerDetail = lazy(() => import('./components/routes/server.tsx'))
const CommandPalette = lazy(() => import('./components/command-palette.tsx'))
@@ -39,17 +46,20 @@ const App = () => {
for (const server of servers) {
if (server.status === 'down') {
updateFavicon('/favicon-red.svg')
return
break
} else if (server.status === 'up') {
up = true
}
}
updateFavicon(up ? '/favicon-green.svg' : '/favicon.svg')
}
return () => {
updateFavicon('/favicon.svg')
}
}, [authenticated, servers])
if (!page) {
return <h1>404</h1>
return <h1 className="text-3xl text-center my-14">404</h1>
} else if (page.path === '/') {
return <Home />
} else if (page.route === 'server') {
@@ -84,7 +94,37 @@ const Layout = () => {
<Logo className="h-[1.2em] fill-foreground" />
</a>
<div className={'flex gap-1 ml-auto'}>
<div className={'flex ml-auto'}>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<a
aria-label="User Actions"
href={'https://github.com/henrygd'}
className={cn('', buttonVariants({ variant: 'ghost', size: 'icon' }))}
>
<UserIcon className="h-[1.2rem] w-[1.2rem]" />
</a>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem onSelect={() => pb.authStore.clear()}>
<LogOutIcon className="mr-2.5 h-4 w-4" />
<span>Log out</span>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem asChild>
<a href="/_/#/logs">
<LogsIcon className="mr-2.5 h-4 w-4" />
<span>Logs</span>
</a>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<a href="/_/#/settings/backups">
<DatabaseBackupIcon className="mr-2.5 h-4 w-4" />
<span>Backups</span>
</a>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
<TooltipProvider delayDuration={300}>
<Tooltip>
<TooltipTrigger asChild>
@@ -118,7 +158,9 @@ const Layout = () => {
ReactDOM.createRoot(document.getElementById('app')!).render(
<React.StrictMode>
<ThemeProvider>
<Layout />
<Suspense>
<Layout />
</Suspense>
</ThemeProvider>
</React.StrictMode>
)