feat: add basic relay management in rust
This commit is contained in:
@@ -1,4 +1,10 @@
|
||||
import { SecureIcon, SettingsIcon, UserIcon, ZapIcon } from "@lume/icons";
|
||||
import {
|
||||
RelayIcon,
|
||||
SecureIcon,
|
||||
SettingsIcon,
|
||||
UserIcon,
|
||||
ZapIcon,
|
||||
} from "@lume/icons";
|
||||
import { cn } from "@lume/utils";
|
||||
import { Link } from "@tanstack/react-router";
|
||||
import { Outlet, createFileRoute } from "@tanstack/react-router";
|
||||
@@ -12,10 +18,10 @@ function Screen() {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<div className="flex h-full w-full flex-col bg-neutral-100 dark:bg-neutral-950">
|
||||
<div className="flex h-full w-full flex-col">
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="flex h-20 w-full shrink-0 items-center justify-center border-b border-neutral-200 dark:border-neutral-800"
|
||||
className="flex h-20 w-full shrink-0 items-center justify-center border-b border-black/10 dark:border-white/10"
|
||||
>
|
||||
<div className="flex items-center gap-1">
|
||||
<Link to="/settings/general">
|
||||
@@ -25,8 +31,8 @@ function Screen() {
|
||||
className={cn(
|
||||
"flex h-14 w-20 shrink-0 flex-col items-center justify-center rounded-lg p-2",
|
||||
isActive
|
||||
? "bg-neutral-200 hover:bg-neutral-300 dark:bg-neutral-800 dark:text-neutral-100 dark:hover:bg-neutral-700"
|
||||
: "text-neutral-700 hover:bg-neutral-200 dark:text-neutral-300 dark:hover:bg-neutral-800",
|
||||
? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
|
||||
: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
|
||||
)}
|
||||
>
|
||||
<SettingsIcon className="size-5 shrink-0" />
|
||||
@@ -44,8 +50,8 @@ function Screen() {
|
||||
className={cn(
|
||||
"flex h-14 w-20 shrink-0 flex-col items-center justify-center rounded-lg p-2",
|
||||
isActive
|
||||
? "bg-neutral-200 hover:bg-neutral-300 dark:bg-neutral-800 dark:text-neutral-100 dark:hover:bg-neutral-700"
|
||||
: "text-neutral-700 hover:bg-neutral-200 dark:text-neutral-300 dark:hover:bg-neutral-800",
|
||||
? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
|
||||
: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
|
||||
)}
|
||||
>
|
||||
<UserIcon className="size-5 shrink-0" />
|
||||
@@ -56,6 +62,23 @@ function Screen() {
|
||||
);
|
||||
}}
|
||||
</Link>
|
||||
<Link to="/settings/relay">
|
||||
{({ isActive }) => {
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
"flex h-14 w-20 shrink-0 flex-col items-center justify-center rounded-lg p-2",
|
||||
isActive
|
||||
? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
|
||||
: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
|
||||
)}
|
||||
>
|
||||
<RelayIcon className="size-5 shrink-0" />
|
||||
<p className="text-sm font-medium">Relay</p>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
</Link>
|
||||
<Link to="/settings/zap">
|
||||
{({ isActive }) => {
|
||||
return (
|
||||
@@ -63,8 +86,8 @@ function Screen() {
|
||||
className={cn(
|
||||
"flex h-14 w-20 shrink-0 flex-col items-center justify-center rounded-lg p-2",
|
||||
isActive
|
||||
? "bg-neutral-200 hover:bg-neutral-300 dark:bg-neutral-800 dark:text-neutral-100 dark:hover:bg-neutral-700"
|
||||
: "text-neutral-700 hover:bg-neutral-200 dark:text-neutral-300 dark:hover:bg-neutral-800",
|
||||
? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
|
||||
: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
|
||||
)}
|
||||
>
|
||||
<ZapIcon className="size-5 shrink-0" />
|
||||
@@ -82,8 +105,8 @@ function Screen() {
|
||||
className={cn(
|
||||
"flex h-14 w-20 shrink-0 flex-col items-center justify-center rounded-lg p-2",
|
||||
isActive
|
||||
? "bg-neutral-200 hover:bg-neutral-300 dark:bg-neutral-800 dark:text-neutral-100 dark:hover:bg-neutral-700"
|
||||
: "text-neutral-700 hover:bg-neutral-200 dark:text-neutral-300 dark:hover:bg-neutral-800",
|
||||
? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
|
||||
: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
|
||||
)}
|
||||
>
|
||||
<SecureIcon className="size-5 shrink-0" />
|
||||
@@ -96,7 +119,7 @@ function Screen() {
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full flex-1 overflow-y-auto px-5 py-4">
|
||||
<div className="w-full flex-1 overflow-y-auto scrollbar-none px-5 py-4">
|
||||
<Outlet />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user