<script lang="ts">
  import { Button } from '$lib/components/ui/button'
  import type { Signal } from '$lib/api'

  let {
    row,
    acting = null,
    onAck,
    onMute,
    onResolve
  }: {
    row: Signal
    acting?: string | null
    onAck?: (id: string) => void
    onMute?: (id: string) => void
    onResolve?: (id: string) => void
  } = $props()
</script>

<div class="flex justify-end gap-2">
  {#if row.state === 'raised'}
    <Button size="sm" variant="outline" disabled={acting === row.id} onclick={() => onAck?.(row.id)}
      >Ack</Button
    >
  {/if}
  <Button size="sm" variant="outline" disabled={acting === row.id} onclick={() => onMute?.(row.id)}
    >Mute 1h</Button
  >
  <Button size="sm" disabled={acting === row.id} onclick={() => onResolve?.(row.id)}>Resolve</Button
  >
</div>
