syntaxbullet/AuroraBot-discord
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): use shadcn switch for toggles and remove sidebar user footer

Browse Source
This commit is contained in:
syntaxbullet
2026-01-08 23:00:44 +01:00
parent bea6c33024
commit 713ea07040
5 changed files with 39 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
web/src/components/AppSidebar.tsx
View File

@@ -90,21 +90,7 @@ export function AppSidebar() {
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
<SidebarFooter className="p-4 border-t border-white/5">
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton size="lg" className="hover:bg-white/5 rounded-xl transition-colors">
<div className="bg-primary/20 border border-primary/20 flex aspect-square size-10 items-center justify-center rounded-full overflow-hidden">
<span className="text-sm font-bold text-primary italic">A</span>
</div>
<div className="flex flex-col gap-0.5 leading-none ml-2">
<span className="font-bold text-sm text-white/90">Administrator</span>
<span className="text-[10px] text-white/40 font-medium">Session Active</span>
</div>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarFooter>
<SidebarRail />
</Sidebar>
);

29
web/src/components/ui/switch.tsx Normal file
View File

@@ -0,0 +1,29 @@
import * as React from "react"
import * as SwitchPrimitive from "@radix-ui/react-switch"
import { cn } from "@/lib/utils"
function Switch({
className,
...props
}: React.ComponentProps<typeof SwitchPrimitive.Root>) {
return (
<SwitchPrimitive.Root
data-slot="switch"
className={cn(
"peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
className
)}
{...props}
>
<SwitchPrimitive.Thumb
data-slot="switch-thumb"
className={cn(
"bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
)}
/>
</SwitchPrimitive.Root>
)
}
export { Switch }

13
web/src/pages/Settings.tsx
View File

@@ -4,6 +4,7 @@ import { Loader2, Save, RefreshCw, Smartphone, Coins, Trophy, Shield, Users, Ter
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Card, CardContent } from "@/components/ui/card";
import { Switch } from "@/components/ui/switch";
// Types matching the backend response
interface RoleOption { id: string; name: string; color: string; }
@@ -231,11 +232,9 @@ export function Settings() {
/>
<div className="flex items-center justify-between p-4 rounded-lg bg-white/5 border border-white/5">
<span className="text-sm font-medium">Allow Self Transfer</span>
<input
type="checkbox"
<Switch
checked={config?.economy?.transfers?.allowSelfTransfer ?? false}
onChange={(e) => updateConfig("economy.transfers.allowSelfTransfer", e.target.checked)}
className="h-5 w-5 rounded border-white/10 bg-white/5"
onCheckedChange={(checked) => updateConfig("economy.transfers.allowSelfTransfer", checked)}
/>
</div>
</div>
@@ -425,11 +424,9 @@ export function Settings() {
{config?.commands?.[cmd.name] === false ? "Disabled" : "Enabled"}
</span>
</div>
<input
type="checkbox"
<Switch
checked={config?.commands?.[cmd.name] !== false}
onChange={(e) => updateConfig(`commands.${cmd.name}`, e.target.checked)}
className="h-4 w-4 rounded border-white/10 bg-white/5 accent-primary cursor-pointer"
onCheckedChange={(checked) => updateConfig(`commands.${cmd.name}`, checked)}
/>
</div>
))}