achmad
8009fc6b8a
Adds device list panel with 1s real-time polling, device cards showing connection type/Android version/battery, wireless connect dialog, and DeviceInfoPanel with static fields fetched once and live fields (RAM, battery, thermal, storage, IP) pulsed every second. Introduces the selectedDeviceId vs profiledDeviceId split in Zustand store, Profile toggle per card, and auto-clear on device disconnect. All non-device feature panels gate on useActiveDevice and render NoDeviceSelected when no device is being profiled.
56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area"
|
|
|
|
import { cn } from "@/lib/utils"
|
|
|
|
function ScrollArea({
|
|
className,
|
|
children,
|
|
...props
|
|
}: ScrollAreaPrimitive.Root.Props) {
|
|
return (
|
|
<ScrollAreaPrimitive.Root
|
|
data-slot="scroll-area"
|
|
className={cn("relative", className)}
|
|
{...props}
|
|
>
|
|
<ScrollAreaPrimitive.Viewport
|
|
data-slot="scroll-area-viewport"
|
|
className="size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1"
|
|
>
|
|
{children}
|
|
</ScrollAreaPrimitive.Viewport>
|
|
<ScrollBar />
|
|
<ScrollAreaPrimitive.Corner />
|
|
</ScrollAreaPrimitive.Root>
|
|
)
|
|
}
|
|
|
|
function ScrollBar({
|
|
className,
|
|
orientation = "vertical",
|
|
...props
|
|
}: ScrollAreaPrimitive.Scrollbar.Props) {
|
|
return (
|
|
<ScrollAreaPrimitive.Scrollbar
|
|
data-slot="scroll-area-scrollbar"
|
|
data-orientation={orientation}
|
|
orientation={orientation}
|
|
className={cn(
|
|
"flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent",
|
|
className
|
|
)}
|
|
{...props}
|
|
>
|
|
<ScrollAreaPrimitive.Thumb
|
|
data-slot="scroll-area-thumb"
|
|
className="relative flex-1 rounded-full bg-border"
|
|
/>
|
|
</ScrollAreaPrimitive.Scrollbar>
|
|
)
|
|
}
|
|
|
|
export { ScrollArea, ScrollBar }
|