Initial commit: LiveStream Platform

Backend: FastAPI + SQLAlchemy + SQLite
Frontend: React + Vite + Ant Design (serif Anthropic theme)
Media server: MediaMTX with edge node support
Load balancing: round-robin / weighted / least-conn
Multicast detection with automatic fallback
Transcoding support via FFmpeg (configurable quality)
hls.js player with line & quality switching
Admin panel with password auth
Windows compatible scripts

frontend/src/admin/pages/StreamList.tsx

@@ -0,0 +1,123 @@
+import { useState, useEffect } from 'react'
+import { useNavigate } from 'react-router-dom'
+import {
+  Table, Button, Tag, Space, Modal, Typography, message, Tooltip, Popconfirm,
+} from 'antd'
+import { PlusOutlined, PlayCircleOutlined, StopOutlined, DeleteOutlined, LinkOutlined } from '@ant-design/icons'
+import { fetchStreams, deleteStream, goLive, endStream, type StreamInfo } from '../../api/streams'
+
+const { Title, Text } = Typography
+
+const statusMap: Record<string, { color: string; label: string }> = {
+  pending: { color: 'blue', label: 'Pending' },
+  live: { color: 'green', label: 'Live' },
+  ended: { color: 'default', label: 'Ended' },
+  cancelled: { color: 'red', label: 'Cancelled' },
+}
+
+export default function StreamList() {
+  const [streams, setStreams] = useState<StreamInfo[]>([])
+  const [loading, setLoading] = useState(true)
+  const navigate = useNavigate()
+
+  useEffect(() => { loadData() }, [])
+
+  async function loadData() {
+    setLoading(true)
+    try {
+      const data = await fetchStreams()
+      setStreams(data)
+    } catch { message.error('Failed to load streams') }
+    setLoading(false)
+  }
+
+  async function handleDelete(id: number) {
+    try {
+      await deleteStream(id)
+      message.success('Stream deleted')
+      loadData()
+    } catch { message.error('Delete failed') }
+  }
+
+  async function handleGoLive(id: number) {
+    try {
+      await goLive(id)
+      message.success('Stream is now live')
+      loadData()
+    } catch { message.error('Failed to set live') }
+  }
+
+  async function handleEnd(id: number) {
+    try {
+      await endStream(id)
+      message.success('Stream ended')
+      loadData()
+    } catch { message.error('Failed to end') }
+  }
+
+  const columns = [
+    { title: 'ID', dataIndex: 'id', key: 'id', width: 80 },
+    { title: 'Title', dataIndex: 'title', key: 'title', ellipsis: true },
+    {
+      title: 'Status', dataIndex: 'status', key: 'status', width: 110,
+      render: (s: string) => {
+        const info = statusMap[s] || { color: 'default', label: s }
+        return <Tag color={info.color}>{info.label}</Tag>
+      },
+    },
+    { title: 'Created', dataIndex: 'created_at', key: 'created_at', render: (v: string) => v?.slice(0, 16), width: 170 },
+    {
+      title: 'Actions', key: 'actions', width: 280,
+      render: (_: any, record: StreamInfo) => (
+        <Space size="small">
+          <Button
+            size="small"
+            icon={<LinkOutlined />}
+            onClick={() => {
+              navigator.clipboard.writeText(record.stream_key)
+              message.success('Stream key copied')
+            }}
+          >
+            Copy Key
+          </Button>
+          {record.status !== 'live' ? (
+            <Tooltip title="Mark as live">
+              <Button size="small" type="primary" icon={<PlayCircleOutlined />}
+                onClick={() => handleGoLive(record.id)} ghost />
+            </Tooltip>
+          ) : (
+            <Tooltip title="End stream">
+              <Button size="small" icon={<StopOutlined />}
+                onClick={() => handleEnd(record.id)} danger />
+            </Tooltip>
+          )}
+          <Button size="small" onClick={() => window.open(`/watch/${record.id}`, '_blank')}>
+            Watch
+          </Button>
+          <Popconfirm title="Delete this stream?" onConfirm={() => handleDelete(record.id)}>
+            <Button size="small" icon={<DeleteOutlined />} danger />
+          </Popconfirm>
+        </Space>
+      ),
+    },
+  ]
+
+  return (
+    <div>
+      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 24 }}>
+        <Title level={3} style={{ margin: 0 }}>Streams</Title>
+        <Button type="primary" icon={<PlusOutlined />} onClick={() => navigate('/admin/streams/new')}>
+          New Stream
+        </Button>
+      </div>
+      <Table
+        dataSource={streams}
+        columns={columns}
+        rowKey="id"
+        loading={loading}
+        pagination={{ pageSize: 15 }}
+        size="middle"
+      />
+    </div>
+  )
+}