-- DreamStack Streaming Dashboard
-- Combines imported components with live stream data.
-- Receives from 3 upstream apps, renders with Card, Badge, Button.
--
-- Run with:
--   Tab 1: cargo run -p ds-stream
--   Tab 2: dreamstack stream examples/streaming-counter.ds --port 3000
--   Tab 3: dreamstack stream examples/streaming-clock.ds --port 3002
--   Tab 4: dreamstack stream examples/streaming-stats.ds --port 3003
--   Tab 5: dreamstack build examples/streaming-dashboard.ds -o /tmp/dashboard

import { Card } from "../registry/components/card"
import { Badge } from "../registry/components/badge"
import { Button } from "../registry/components/button"

-- Connect to upstream streams
let counter = stream from "ws://localhost:9100/stream/counter"
let clock = stream from "ws://localhost:9100/stream/clock"
let stats = stream from "ws://localhost:9100/stream/stats"

-- Local state
let refreshCount = 0
let theme = "dark"

view main = column [
  text "Signal Dashboard" { variant: "title" }
  text "Live streaming from 3 DreamStack apps" { variant: "subtitle" }

  row [
    Card { title: "Counter", subtitle: "real-time count" } [
      text "Count: {counter.count}"
      text "Doubled: {counter.doubled}"
      Badge { label: "LIVE", variant: "success" }
    ]

    Card { title: "Clock", subtitle: "streaming time" } [
      text "{clock.hours}:{clock.minutes}:{clock.seconds}"
      Badge { label: "TICKING", variant: "info" }
    ]
  ]

  row [
    Card { title: "Statistics", subtitle: "aggregated data" } [
      text "Samples: {stats.total}"
      text "Average: {stats.average}"
      text "Max: {stats.max}"
      Badge { label: "TRACKING", variant: "warning" }
    ]

    Card { title: "Controls", subtitle: "dashboard actions" } [
      text "Refreshes: {refreshCount}"
      row [
        Button { label: "Refresh", onClick: refreshCount += 1, variant: "primary" }
        Button { label: "Reset", onClick: refreshCount = 0, variant: "ghost" }
      ]
      match theme
        "dark" -> Badge { label: "Dark Mode", variant: "info" }
        "light" -> Badge { label: "Light Mode", variant: "warning" }
        _ -> Badge { label: "System", variant: "info" }
    ]
  ]
]
