m2-inno-bedpressure/components/bed-pressure/BedPressureHeader.tsx
2025-06-21 12:55:27 +07:00

29 lines
No EOL
1.1 KiB
TypeScript

import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { Activity, Pause, Play } from "lucide-react"
import { useBedPressureStore } from "@/stores/bedPressureStore"
export function BedPressureHeader() {
const { isMonitoring, setIsMonitoring } = useBedPressureStore()
return (
<div className="flex items-center justify-between">
<div className="flex items-center gap-4">
<div className="flex items-center gap-2">
<Activity className="w-8 h-8 text-blue-600" />
<h1 className="text-3xl font-bold text-gray-900">Bed Pressure Monitor</h1>
</div>
<Badge variant={isMonitoring ? "default" : "secondary"} className="px-3 py-1">
{isMonitoring ? "Live" : "Paused"}
</Badge>
</div>
<div className="flex items-center gap-2">
<Button variant="outline" size="sm" onClick={() => setIsMonitoring(!isMonitoring)}>
{isMonitoring ? <Pause className="w-4 h-4" /> : <Play className="w-4 h-4" />}
{isMonitoring ? "Pause" : "Resume"}
</Button>
</div>
</div>
)
}