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

  let {
    row,
    onCancel
  }: {
    row: ActivityItem
    onCancel?: (id: string) => void
  } = $props()

  function showCancel(status: string): boolean {
    return ['pending_approval', 'approved', 'running'].includes(status)
  }
</script>

<div class="flex justify-end">
  {#if showCancel(row.status)}
    <Button size="sm" variant="outline" onclick={() => onCancel?.(row.id)}>Cancel</Button>
  {/if}
</div>
