chore: github copilot code review nitpicks

.github/workflows/docker.yml

@@ -63,41 +63,6 @@ jobs:
           secrets: |
             TURBO_TOKEN=${{ secrets.TURBO_TOKEN }}
             TURBO_TEAM=${{ secrets.TURBO_TEAM }}
-  db:
-    name: Push db to Docker Hub
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check out the repo
-        uses: actions/checkout@v3
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Log in to Docker Hub
-        uses: docker/login-action@f4ef78c080cd8ba55a85445d5b36e214a81df20a
-        with:
-          username: ${{ secrets.DOCKER_USERNAME }}
-          password: ${{ secrets.DOCKER_PASSWORD }}
-
-      - name: Extract metadata (tags, labels) for Docker
-        id: meta
-        uses: docker/metadata-action@9ec57ed1fcdbf14dcef7dfbe97b2010124a938b7
-        with:
-          images: srizan10/hclive-db
-          tags: latest
-
-      - name: Build and push Docker image
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          file: ./packages/db/Dockerfile
-          push: true
-          tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
-          platforms: linux/amd64
-          secrets: |
-            TURBO_TOKEN=${{ secrets.TURBO_TOKEN }}
-            TURBO_TEAM=${{ secrets.TURBO_TEAM }}
   chat:
     name: Push chat module to Docker Hub
     runs-on: ubuntu-latest
@@ -134,21 +99,10 @@ jobs:
             TURBO_TOKEN=${{ secrets.TURBO_TOKEN }}
             TURBO_TEAM=${{ secrets.TURBO_TEAM }}
   deploy:
-    name: Deploy to server
+    name: Deploy to Coolify
     runs-on: ubuntu-latest
-    needs: [frontend, db, chat]
+    needs: [frontend, chat]
     steps:
-      # source https://github.com/taciturnaxolotl/cachet/blob/main/.github/workflows/deploy.yaml
-      - name: Deploy with Docker
-        uses: appleboy/ssh-action@v1
-        with:
-          host: hackclub.app
-          username: srizan
-          key: ${{ secrets.SSH_KEY }}
-          port: 22
-          script: |
-            cd ~/compose/hctv
-            docker compose pull
-            docker compose up -d --remove-orphans
-            # for some reason, without the restart, the rtmp container stops working
-            docker compose restart
+      - name: Send coolify redeploy webhook
+        run: |
+          curl -X POST -H "Authorization: Bearer ${{ secrets.COOLIFY_API_KEY }}" https://coolify.srizan.dev/api/v1/deploy?uuid=${{ secrets.COOLIFY_APP_UUID }}&force=true

README.md

@@ -1,6 +1,6 @@
 # hackclub.tv
 
-This is the source code for [hackclub.tv (hctv.srizan.dev)](https://hctv.srizan.dev), a livestreaming website for hackclubbers.
+This is the source code for [hackclub.tv (hackclub.tv)](https://hackclub.tv), a livestreaming website for hackclubbers.
 
 Development has been ongoing for a few months, and the site is now live! There are some half-baked features, but I'm all ears for feedback.
 

apps/docs/src/content/docs/api/chat.mdx

@@ -9,7 +9,7 @@ The chat system is powered by a websocket server. Please read the entire page be
 
 ## Connection and messages
 
-The websocket server is located at `wss://hctv.srizan.dev/api/chat/ws/:username`, where `:username` is the channel you want to connect to.
+The websocket server is located at `wss://hackclub.tv/api/chat/ws/:username`, where `:username` is the channel you want to connect to.
 
 You'll need to provide authentication, which can be done by providing an `auth_session` cookie, just like the REST API.  
 <Aside type="tip">

apps/docs/src/content/docs/api/index.mdx

@@ -9,7 +9,7 @@ since this is beta software, the API is subject to change. additionally, many en
 
 ## Base url
 
-base url for all endpoints is `https://hctv.srizan.dev/api`.
+base url for all endpoints is `https://hackclub.tv/api`.
 
 ## Authentication
 

apps/docs/src/content/docs/api/rtmp.mdx

@@ -3,10 +3,6 @@ title: RTMP
 description: RTMP related endpoint group
 ---
 
-## GET `/rtmp/hls/:path`
-gets HLS segments, the backbone of hctv livestreaming. **authentication required**.  
-not really sure why you would need this? but check the browser console when playing a stream for an insight on how it's used.
-
 ## POST `/rtmp/streamKey`
 regenerates your stream key. **authentication required**.  
 body parameters (json):

apps/docs/src/content/docs/guides/start-stream.mdx

@@ -7,7 +7,7 @@ description: Get started with OBS and streaming on hackclub.tv
 - open settings
 - open "Stream"
 - set service to custom
-- set url to `rtmp://hackclub.app:45913/live`
+- set url to `srt://localhost:8890?streamid=publish:CHANNEL_NAME:thisusernameislongonpurposesoyoudontaccidentallyleakyourstreamkey:STREAM_KEY&pkt_size=1316`
 - on the website, click "Regenerate key"
 - paste the key into your obs "Stream Key"
 - start streaming!

apps/web/Dockerfile

@@ -1,8 +1,10 @@
-FROM node:lts-alpine AS base
+FROM node:lts-slim AS base
 
 FROM base AS builder
-RUN apk update
-RUN apk add --no-cache libc6-compat git
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    git \
+    ca-certificates \
+    && rm -rf /var/lib/apt/lists/*
 # Set working directory
 WORKDIR /app
 # Replace <your-major-version> with the major version installed in your repository. For example:
@@ -19,42 +21,54 @@ RUN turbo prune @hctv/web --docker
  
 # Add lockfile and package.json's of isolated subworkspace
 FROM base AS installer
-RUN apk update
-RUN apk add --no-cache libc6-compat git vips vips-dev python3 make g++
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    git \
+    libvips-dev \
+    python3 \
+    make \
+    g++ \
+    ca-certificates \
+    && rm -rf /var/lib/apt/lists/*
 # Get the commit hash from the builder stage
 COPY --from=builder /tmp/commit_hash /tmp/commit_hash
-# Read commit hash and set as build arg
-ARG COMMIT_HASH_FILE=/tmp/commit_hash
-RUN COMMIT_HASH=$(cat /tmp/commit_hash 2>/dev/null || echo "unknown") && \
-    echo "COMMIT_HASH=$COMMIT_HASH" > /tmp/build_env
 WORKDIR /app
 
 # First install the dependencies (as they change less often)
 COPY --from=builder /app/out/json/ .
 RUN yarn install --frozen-lockfile
 
-RUN cd apps/web && yarn add sharp --platform=linuxmusl --arch=x64
-
 COPY --from=builder /app/out/full/ .
 RUN --mount=type=secret,id=TURBO_TOKEN --mount=type=secret,id=TURBO_TEAM \
-    . /tmp/build_env && \
-    export commit=$COMMIT_HASH && \
-    TURBO_TOKEN=$(cat /run/secrets/TURBO_TOKEN) TURBO_TEAM=$(cat /run/secrets/TURBO_TEAM) yarn turbo run build --env-mode=loose
+    COMMIT=$(cat /tmp/commit_hash 2>/dev/null || echo "unknown") && \
+    TURBO_TOKEN=$(cat /run/secrets/TURBO_TOKEN) TURBO_TEAM=$(cat /run/secrets/TURBO_TEAM) \
+    commit=$COMMIT yarn turbo run build --env-mode=loose
  
 FROM base AS runner
 WORKDIR /app
 
-RUN apk add --no-cache ffmpeg vips vips-dev
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    ffmpeg \
+    libvips42 \
+    && rm -rf /var/lib/apt/lists/*
 
-# Don't run production as root
-RUN addgroup --system --gid 1001 nodejs
-RUN adduser --system --uid 1001 nextjs
+RUN groupadd --system --gid 1001 nodejs
+RUN useradd --system --uid 1001 nextjs
+
+# Copy Prisma files for migrations
+COPY --from=installer --chown=nextjs:nodejs /app/packages/db/prisma ./packages/db/prisma
+COPY --from=installer --chown=nextjs:nodejs /app/packages/db/generated ./packages/db/generated
+COPY --from=installer --chown=nextjs:nodejs /app/packages/db/package.json ./packages/db/package.json
+COPY --from=installer --chown=nextjs:nodejs /app/node_modules ./node_modules
 
-# Get the commit hash from the installer stage and create a startup script
 COPY --from=installer /tmp/commit_hash /tmp/commit_hash
 RUN COMMIT_VALUE=$(cat /tmp/commit_hash 2>/dev/null || echo "unknown") && \
     echo "#!/bin/sh" > /usr/local/bin/start.sh && \
+    echo "set -e" >> /usr/local/bin/start.sh && \
+    echo "echo 'Running database migrations...'" >> /usr/local/bin/start.sh && \
+    echo "npx prisma migrate deploy --schema=/app/packages/db/prisma/schema.prisma" >> /usr/local/bin/start.sh && \
+    echo "cd /app" >> /usr/local/bin/start.sh && \
     echo "export commit=$COMMIT_VALUE" >> /usr/local/bin/start.sh && \
+    echo "echo 'Starting Next.js application...'" >> /usr/local/bin/start.sh && \
     echo "exec node apps/web/server.js" >> /usr/local/bin/start.sh && \
     chmod +x /usr/local/bin/start.sh
 

apps/web/next.config.mjs

@@ -56,6 +56,9 @@ const nextConfig = {
       },
     ];
   },
+  logging: {
+    incomingRequests: false,
+  },
 };
 
 export default withSentryConfig(nextConfig, {

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hctv/web",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "private": true,
   "type": "module",
   "scripts": {
@@ -12,7 +12,7 @@
     "lint": "next lint",
     "ui:add": "shadcn add",
     "check-types": "tsc --noEmit",
-    "openapi": "next-openapi-gen"
+    "genMtxTypes": "bunx openapi-typescript https://github.com/bluenviron/mediamtx/raw/refs/tags/v1.15.5/api/openapi.yaml -o ./src/lib/types/mediamtx.d.ts"
   },
   "dependencies": {
     "@hctv/auth": "*",
@@ -21,6 +21,7 @@
     "@lucia-auth/adapter-prisma": "^4.0.1",
     "@node-rs/argon2": "^2.0.2",
     "@omit/react-confirm-dialog": "^1.2.0",
+    "@radix-ui/react-alert-dialog": "^1.1.15",
     "@radix-ui/react-avatar": "^1.0.4",
     "@radix-ui/react-checkbox": "^1.1.4",
     "@radix-ui/react-dialog": "^1.1.5",
@@ -30,7 +31,7 @@
     "@radix-ui/react-popover": "^1.1.5",
     "@radix-ui/react-select": "^2.1.5",
     "@radix-ui/react-separator": "^1.1.1",
-    "@radix-ui/react-slot": "^1.1.1",
+    "@radix-ui/react-slot": "^1.2.4",
     "@radix-ui/react-switch": "^1.1.3",
     "@radix-ui/react-tabs": "^1.1.12",
     "@radix-ui/react-tooltip": "^1.2.7",
@@ -50,14 +51,14 @@
     "lucia": "^3.2.2",
     "lucide-react": "^0.473.0",
     "media-chrome": "^4.8.0",
-    "next": "^15.6.0-canary.34",
+    "next": "^16.1.0",
     "next-themes": "^0.4.4",
     "node-cron": "^3.0.3",
     "nuqs": "^2.4.3",
     "pg": "^8.14.1",
     "pg-boss": "^10.1.6",
-    "react": "19",
-    "react-dom": "19",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
     "react-hook-form": "^7.54.2",
     "rehype-raw": "^7.0.0",
     "rehype-react": "^8.0.0",

apps/web/src/app/(ui)/(protected)/api/mediamtx/publish/route.ts

@@ -0,0 +1,49 @@
+import { prisma, getRedisConnection } from '@hctv/db';
+import { NextRequest } from 'next/server';
+import { z } from 'zod';
+import { lucia } from '@hctv/auth';
+
+export async function POST(request: NextRequest) {
+  const redis = getRedisConnection();
+  const body = await request.json();
+
+  const parsed = schema.safeParse(body);
+
+  if (!parsed.success) {
+    return new Response('invalid request', { status: 400 });
+  }
+  const { action, protocol, path, password } = parsed.data;
+  if (action === 'publish' && protocol === 'srt') {
+    const channelKey = await redis.get(`streamKey:${path}`);
+
+    if (channelKey) {
+      if (channelKey !== password) {
+        return new Response('invalid stream key', { status: 403 });
+      }
+      return new Response('youre in yay', { status: 200 });
+    }
+  } else if (action === 'read' && protocol === 'hls') {
+    if (password === process.env.MEDIAMTX_PUBLISH_KEY) {
+      return new Response('authorized', { status: 200 });
+    }
+    const sessionExists = await redis.exists(`sessions:${password}`);
+    if (!sessionExists) {
+      return new Response('unauthorized', { status: 401 });
+    }
+    return new Response('authorized', { status: 200 });
+  }
+
+  return new Response('uhh', { status: 401 });
+}
+
+const schema = z.object({
+  user: z.string(),
+  password: z.string(),
+  token: z.string(),
+  ip: z.string(),
+  action: z.enum(['publish', 'read', 'playback', 'api', 'metrics', 'pprof']),
+  path: z.string(),
+  protocol: z.enum(['rtsp', 'rtmp', 'hls', 'webrtc', 'srt']),
+  id: z.string().nullable(),
+  query: z.string(),
+});

apps/web/src/app/(ui)/(protected)/api/rtmp/streamKey/route.ts

@@ -1,6 +1,7 @@
 import { validateRequest } from '@/lib/auth/validate';
 import { prisma } from '@hctv/db';
 import { NextRequest } from "next/server";
+import { regenerateStreamKey } from '@/lib/db/streamKey';
 
 export async function POST(request: NextRequest) {
   const { user } = await validateRequest();
@@ -34,20 +35,9 @@ export async function POST(request: NextRequest) {
     return new Response('Unauthorized', { status: 401 });
   }
 
-  const dbUpdate = await prisma.streamKey.upsert({
-    create: {
-      key: crypto.randomUUID(),
-      channelId: channelInfo.id
-    },
-    update: {
-      key: crypto.randomUUID()
-    },
-    where: {
-      channelId: channelInfo.id
-    }
-  })
+  const streamKey = await regenerateStreamKey(channelInfo.id, channel);
 
-  return new Response(JSON.stringify({ key: dbUpdate.key }), {
+  return new Response(JSON.stringify({ key: streamKey.key }), {
     status: 200,
     headers: {
       'Content-Type': 'application/json'

apps/web/src/app/(ui)/(protected)/api/stream/info/route.ts

@@ -51,5 +51,14 @@ export async function GET(request: NextRequest) {
     },
   });
 
+  db.forEach((obj) => {
+    if (obj.channel.personalFor) {
+      // @ts-ignore
+      delete obj.channel.personalFor.email;
+    }
+    // @ts-ignore
+    delete obj.channel.obsChatGrantToken;
+  });
+
   return Response.json(db);
 }

apps/web/src/app/(ui)/(protected)/layout.tsx

@@ -4,7 +4,7 @@ import { redirect, RedirectType } from 'next/navigation';
 export default async function Layout({ children }: { children: React.ReactNode }) {
   const { user } = await validateRequest();
   if (!user) {
-    return redirect('/auth/slack');
+    return redirect('/auth/hackclub');
   }
   if (!user.hasOnboarded) {
     return redirect(`/onboarding`, RedirectType.push);

apps/web/src/app/(ui)/(protected)/settings/channel/[channelName]/page.client.tsx

@@ -19,6 +19,8 @@ import {
   Copy,
   Check,
   Wrench,
+  Eye,
+  EyeOff,
 } from 'lucide-react';
 import { UniversalForm } from '@/components/app/UniversalForm/UniversalForm';
 import {
@@ -50,6 +52,7 @@ import { useOwnedChannels } from '@/lib/hooks/useUserList';
 import { ChannelSelect } from '@/components/app/ChannelSelect/ChannelSelect';
 import { useRouter } from 'next/navigation';
 import Link from 'next/link';
+import { useConfirm } from '@omit/react-confirm-dialog';
 
 interface ChannelSettingsClientProps {
   channel: Channel & {
@@ -74,9 +77,13 @@ export default function ChannelSettingsClient({
   currentUser,
   isPersonal,
 }: ChannelSettingsClientProps) {
+  const confirm = useConfirm();
   const [streamKey, setStreamKey] = useState(channel.streamKey?.key || '');
   const [keyVisible, setKeyVisible] = useState(false);
-  const [copied, setCopied] = useState(false);
+  const [copied, setCopied] = useState({
+    streamKey: false,
+    streamUrl: false,
+  });
   const [selTab, setSelTab] = useQueryState('tab', parseAsString.withDefault('general'));
   const [isUploading, setIsUploading] = useState(false);
   const [uploadError, setUploadError] = useState<string | null>(null);
@@ -98,9 +105,9 @@ export default function ChannelSettingsClient({
   const copyStreamKey = async () => {
     if (streamKey) {
       await navigator.clipboard.writeText(streamKey);
-      setCopied(true);
+      setCopied({ ...copied, streamKey: true });
       toast.success('Stream key copied to clipboard');
-      setTimeout(() => setCopied(false), 2000);
+      setTimeout(() => setCopied({ ...copied, streamKey: false }), 2000);
     }
   };
 
@@ -124,6 +131,24 @@ export default function ChannelSettingsClient({
     }
   };
 
+  const generateStreamUrl = () => {
+    if (!streamKey) {
+      toast.error('Stream key not available');
+      return '';
+    }
+    return `srt://${process.env.NEXT_PUBLIC_MEDIAMTX_INGEST_ROUTE}?streamid=publish:${channel.name}:thisusernameislongonpurposesoyoudontaccidentallyleakyourstreamkey:${streamKey}&pkt_size=1316`;
+  };
+
+  const copyStreamUrl = async () => {
+    const url = generateStreamUrl();
+    if (url) {
+      await navigator.clipboard.writeText(url);
+      setCopied({ ...copied, streamUrl: true });
+      toast.success('Stream URL copied to clipboard');
+      setTimeout(() => setCopied({ ...copied, streamUrl: false }), 2000);
+    }
+  };
+
   return (
     <div className="container max-w-4xl mx-auto py-6 px-4">
       <div className="mb-6 flex">
@@ -335,36 +360,45 @@ export default function ChannelSettingsClient({
                 onActionComplete={handleChannelSettingsActionComplete}
               />
 
-              {false && isOwner && (
+              {isOwner && !isPersonal && (
                 <>
                   <Separator />
                   <div className="space-y-4">
                     <h3 className="text-lg font-semibold text-destructive">Danger Zone</h3>
-                    <Card className="border-destructive">
-                      <CardHeader>
-                        <CardTitle className="text-destructive">Delete Channel</CardTitle>
-                        <CardDescription>
+                    <div className="flex items-center justify-between p-4 border border-destructive/20 rounded-lg bg-destructive/5">
+                      <div>
+                        <p className="font-medium text-destructive">Delete Channel</p>
+                        <p className="text-sm text-muted-foreground">
                           Permanently delete this channel. This action cannot be undone.
-                        </CardDescription>
-                      </CardHeader>
-                      <CardContent>
-                        <Button
-                          variant="destructive"
-                          onClick={() => {
-                            if (
-                              confirm(
-                                'Are you sure you want to delete this channel? This action cannot be undone.'
-                              )
-                            ) {
-                              deleteChannel(channel.id);
+                        </p>
+                      </div>
+                      <Button
+                        variant="destructive"
+                        size="sm"
+                        onClick={async () => {
+                          if (
+                            await confirm({
+                              title: 'Delete Channel',
+                              description:
+                                'Are you sure you want to delete this channel? This action cannot be undone.',
+                              confirmText: 'Delete',
+                              cancelText: 'Cancel',
+                            })
+                          ) {
+                            const result = await deleteChannel(channel.id);
+                            if (result.success) {
+                              toast.success('Channel deleted successfully');
+                              router.push('/settings/channel');
+                            } else {
+                              toast.error(result.error || 'Failed to delete channel');
                             }
-                          }}
-                        >
-                          <Trash2 className="h-4 w-4 mr-2" />
-                          Delete Channel
-                        </Button>
-                      </CardContent>
-                    </Card>
+                          }
+                        }}
+                      >
+                        <Trash2 className="h-4 w-4 mr-2" />
+                        Delete
+                      </Button>
+                    </div>
                   </div>
                 </>
               )}
@@ -379,51 +413,74 @@ export default function ChannelSettingsClient({
               <CardDescription>Manage your stream key and streaming configuration.</CardDescription>
             </CardHeader>
             <CardContent className="space-y-6">
-              <div className="space-y-4">
-                <div>
-                  <h3 className="text-lg font-semibold mb-2">Stream Key</h3>
-                  <p className="text-sm text-mantle-foreground mb-4">
-                    Use this key to start streaming to your channel. Keep it secure!
-                  </p>
-                  <p className="text-xs text-muted-foreground mb-4">
-                    Need help getting started? Check out our{' '}
-                    <Link
-                      href="https://gist.github.com/SrIzan10/ebd89ced6b21b016d4d389e6711a94e9" 
-                      className="text-primary hover:underline"
-                      target="_blank"
-                      rel="noopener noreferrer"
-                    >
-                      streaming guide
-                    </Link>
-                    .
-                  </p>
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1">
-                      <input
-                        type={keyVisible ? 'text' : 'password'}
-                        value={streamKey}
-                        readOnly
-                        className="w-full px-3 py-2 border rounded-md bg-mantle font-mono text-sm"
-                      />
+              <div>
+                <div className="space-y-3">
+                  <div className="space-y-2">
+                    <label className="text-sm font-medium">Stream Key</label>
+                    <div className="flex items-center gap-2">
+                      <div className="relative flex-1">
+                        <input
+                          type={keyVisible ? 'text' : 'password'}
+                          value={streamKey}
+                          readOnly
+                          className="w-full px-3 py-2 pr-10 border rounded-md bg-mantle font-mono text-sm"
+                        />
+                        <button
+                          type="button"
+                          onClick={() => setKeyVisible(!keyVisible)}
+                          className="absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors"
+                        >
+                          {keyVisible ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
+                        </button>
+                      </div>
+                      <Button onClick={regenerateStreamKey} variant="outline" size="smicon">
+                        <Key className="h-4 w-4" />
+                      </Button>
+                      <Button
+                        variant="outline"
+                        size="smicon"
+                        onClick={copyStreamKey}
+                        disabled={!streamKey}
+                      >
+                        {copied.streamKey ? <Check className="h-4 w-4" /> : <Copy className="h-4 w-4" />}
+                      </Button>
+                    </div>
+                  </div>
+
+                  <div className="space-y-2">
+                    <label className="text-sm font-medium">Stream URL (for OBS)</label>
+                    <div className="flex items-center gap-2">
+                      <div className="relative flex-1">
+                        <input
+                          type="text"
+                          value={generateStreamUrl()}
+                          readOnly
+                          className="w-full px-3 py-2 border rounded-md bg-mantle font-mono text-xs"
+                        />
+                      </div>
+                      <Button
+                        variant="outline"
+                        size="smicon"
+                        onClick={copyStreamUrl}
+                        disabled={!streamKey}
+                      >
+                        {copied.streamUrl ? <Check className="h-4 w-4" /> : <Copy className="h-4 w-4" />}
+                      </Button>
                     </div>
-                    <Button variant="outline" size="sm" onClick={() => setKeyVisible(!keyVisible)}>
-                      {keyVisible ? 'Hide' : 'Show'}
-                    </Button>
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      onClick={copyStreamKey}
-                      disabled={!streamKey}
-                    >
-                      {copied ? <Check className="h-4 w-4" /> : <Copy className="h-4 w-4" />}
-                    </Button>
                   </div>
                 </div>
-
-                <Button onClick={regenerateStreamKey} variant="outline">
-                  <Key className="h-4 w-4 mr-2" />
-                  Regenerate Stream Key
-                </Button>
+                <p className="text-xs text-muted-foreground mt-2">
+                  Need help getting started? Check out our{' '}
+                  <Link
+                    href="https://docs.hackclub.tv/guides/start-stream/" 
+                    className="text-primary hover:underline"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                  >
+                    streaming guide
+                  </Link>
+                  .
+                </p>
               </div>
 
               <Separator />
@@ -536,8 +593,13 @@ export default function ChannelSettingsClient({
                             <Button
                               variant="outline"
                               size="sm"
-                              onClick={() => {
-                                if (confirm('Remove this manager?')) {
+                              onClick={async () => {
+                                if (await confirm({
+                                  title: 'Remove Manager',
+                                  description: `Are you sure you want to remove ${personalChannel?.name} as a manager? They will no longer be able to stream or moderate this channel.`,
+                                  confirmText: 'Remove',
+                                  cancelText: 'Cancel',
+                                })) {
                                   removeChannelManager(channel.id, manager.id);
                                 }
                               }}
@@ -649,7 +711,7 @@ export default function ChannelSettingsClient({
                     <div className="relative flex-1">
                       <input
                         type={keyVisible ? 'text' : 'password'}
-                        value={`https://hctv.srizan.dev/chat/${channel.name}?grant=${channel.obsChatGrantToken}`}
+                        value={`https://hackclub.tv/chat/${channel.name}?grant=${channel.obsChatGrantToken}`}
                         readOnly
                         className="w-full px-3 py-2 border rounded-md bg-mantle font-mono text-sm"
                       />

apps/web/src/app/(ui)/(protected)/settings/channel/[channelName]/page.tsx

@@ -13,7 +13,7 @@ export default async function ChannelSettingsPage({
   const { user } = await validateRequest();
 
   if (!user) {
-    redirect('/auth/slack');
+    redirect('/auth/hackclub');
   }
 
   const channel = await prisma.channel.findUnique({

apps/web/src/app/(ui)/(public)/auth/hackclub/callback/route.ts

@@ -1,6 +1,6 @@
-import { slack, lucia } from '@hctv/auth';
+import { hackClub, lucia, HCID_TOKEN_URL, HCID_USER_INFO_URL } from '@hctv/auth';
 import { cookies as nextCookies } from 'next/headers';
-import { decodeIdToken, OAuth2RequestError } from 'arctic';
+import { OAuth2RequestError } from 'arctic';
 import { generateIdFromEntropySize } from 'lucia';
 import { prisma } from '@hctv/db';
 import { getRedisConnection } from '@hctv/db';
@@ -10,7 +10,7 @@ export async function GET(request: Request): Promise<Response> {
   const url = new URL(request.url);
 	const code = url.searchParams.get("code");
 	const state = url.searchParams.get("state");
-	const storedState = cookies.get("slack_oauth_state")?.value ?? null;
+	const storedState = cookies.get("hackclub_oauth_state")?.value ?? null;
 	if (!code || !state || !storedState || state !== storedState) {
     console.log('invalid state stuff');
 		return new Response(null, {
@@ -19,22 +19,38 @@ export async function GET(request: Request): Promise<Response> {
 	}
 
   try {
-    const tokens = await slack.validateAuthorizationCode(code);
-    const accessToken = tokens.accessToken()
-    const slackUserResponse = await fetch('https://slack.com/api/openid.connect.userInfo', {
+    const tokens = await hackClub.validateAuthorizationCode(HCID_TOKEN_URL, code, null);
+    const accessToken = tokens.accessToken();
+    const userResponse = await fetch(HCID_USER_INFO_URL, {
       headers: {
         'Authorization': `Bearer ${accessToken}`,
       },
     });
-    const slackUser: SlackUserInfo = await slackUserResponse.json();
+    const userResult: HackClubUserResponse = await userResponse.json();
+    const identity = userResult.identity;
+
+    const slackId = identity.slack_id;
+    if (!slackId) {
+      return new Response("Please make sure to have a Slack account before continuing.", {
+        status: 400,
+      });
+    }
 
     const existingUser = await prisma.user.findFirst({
       where: {
-        slack_id: slackUser.sub,
+        slack_id: slackId,
       },
     });
 
     if (existingUser) {
+      // Update email if it's missing or changed
+      if (existingUser.email !== identity.primary_email) {
+        await prisma.user.update({
+          where: { id: existingUser.id },
+          data: { email: identity.primary_email },
+        });
+      }
+
       const session = await lucia.createSession(existingUser.id, {});
       const sessionCookie = lucia.createSessionCookie(session.id);
       await getRedisConnection().set(`sessions:${session.id}`, '');
@@ -52,8 +68,9 @@ export async function GET(request: Request): Promise<Response> {
     await prisma.user.create({
       data: {
         id: userId,
-        slack_id: slackUser.sub,
-        pfpUrl: `https://cachet.dunkirk.sh/users/${slackUser.sub}/r`,
+        slack_id: slackId,
+        email: identity.primary_email,
+        pfpUrl: identity.slack_id ? `https://cachet.dunkirk.sh/users/${identity.slack_id}/r` : 'https://github.com/hackclub.png',
         hasOnboarded: false,
       },
     });
@@ -83,40 +100,15 @@ export async function GET(request: Request): Promise<Response> {
   }
 }
 
-interface SlackUserInfo {
-  // OpenID Connect standard fields
-  ok: boolean;
-  sub: string;
-  email: string;
-  email_verified: boolean;
-  date_email_verified: number;
-  name: string;
-  picture: string;
-  given_name: string;
-  family_name: string;
-  locale: string;
-
-  // Slack-specific fields
-  ['https://slack.com/user_id']: string;
-  ['https://slack.com/team_id']: string;
-  ['https://slack.com/team_name']: string;
-  ['https://slack.com/team_domain']: string;
-
-  // User image URLs
-  ['https://slack.com/user_image_24']: string;
-  ['https://slack.com/user_image_32']: string;
-  ['https://slack.com/user_image_48']: string;
-  ['https://slack.com/user_image_72']: string;
-  ['https://slack.com/user_image_192']: string;
-  ['https://slack.com/user_image_512']: string;
-
-  // Team image URLs
-  ['https://slack.com/team_image_34']?: string;
-  ['https://slack.com/team_image_44']?: string;
-  ['https://slack.com/team_image_68']?: string;
-  ['https://slack.com/team_image_88']?: string;
-  ['https://slack.com/team_image_102']?: string;
-  ['https://slack.com/team_image_132']?: string;
-  ['https://slack.com/team_image_230']?: string;
-  ['https://slack.com/team_image_default']?: boolean;
+interface HackClubIdentity {
+  id: string;
+  slack_id?: string;
+  first_name: string;
+  last_name: string;
+  primary_email: string;
 }
+
+interface HackClubUserResponse {
+  identity: HackClubIdentity;
+}
+

apps/web/src/app/(ui)/(public)/auth/hackclub/route.ts

@@ -1,12 +1,12 @@
 import { generateState } from "arctic";
-import { slack } from '@hctv/auth';
+import { hackClub, HCID_AUTH_URL } from '@hctv/auth';
 import { cookies } from "next/headers";
 
 export async function GET(): Promise<Response> {
 	const state = generateState();
-	const url = slack.createAuthorizationURL(state, ['openid', 'profile']);
+	const url = hackClub.createAuthorizationURL(HCID_AUTH_URL, state, ['slack_id', 'verification_status', 'email']);
 
-	(await cookies()).set("slack_oauth_state", state, {
+	(await cookies()).set("hackclub_oauth_state", state, {
 		path: "/",
 		secure: process.env.NODE_ENV === "production",
 		httpOnly: true,

apps/web/src/app/(ui)/(public)/page.tsx

@@ -42,7 +42,8 @@ export default async function Home() {
             <Card className="overflow-hidden hover:shadow-lg transition-shadow">
               <CardContent className="p-0">
                 <div className="relative">
-                  <Image
+                  {/* eslint-disable-next-line @next/next/no-img-element */}
+                  <img
                     src={`/api/stream/thumb/${stream.channel.name}`}
                     width={512}
                     height={512}

apps/web/src/app/(ui)/layout.tsx

@@ -1,5 +1,6 @@
 import type { Metadata } from 'next';
 import { Inter } from 'next/font/google';
+import { cookies } from 'next/headers';
 import '../globals.css';
 import Navbar from '@/components/app/NavBar/NavBar';
 import { SessionProvider } from '@/lib/providers/SessionProvider';
@@ -31,6 +32,9 @@ export default async function RootLayout({
   children: React.ReactNode;
 }>) {
   const sessionData = await validateRequest();
+  const cookieStore = await cookies();
+  const defaultOpen = cookieStore.get('sidebar:state')?.value === 'true';
+
   return (
     <html lang="en">
       <body className={cn('flex flex-col h-screen', inter.className)}>
@@ -45,9 +49,13 @@ export default async function RootLayout({
             <NextSSRPlugin
               routerConfig={extractRouterConfig(ourFileRouter)}
             />
-            <ConfirmDialogProvider>
+            <ConfirmDialogProvider defaultOptions={{
+              cancelButton: {
+                variant: 'outline',
+              },
+            }}>
               <NuqsAdapter>
-                <SidebarProvider>
+                <SidebarProvider defaultOpen={defaultOpen}>
                   <StreamInfoProvider>
                     {/* this promise is ugly but i'm lazy to fix the type errors */}
                     <Navbar editLivestream={Promise.resolve(<EditLivestream />)} />

apps/web/src/app/globals.css

@@ -4,111 +4,125 @@
 
 @layer base {
   :root {
-    --background: 220 23.077% 94.902%;
-    --foreground: 233.793 16.022% 35.49%;
+    /* Light theme - based on your color scheme */
 
-    --muted: 222.857 15.909% 82.745%;
-    --muted-foreground: 233.333 12.796% 41.373%;
+    /* Main background and foreground */
+    --background: 350 59% 98%; /* FDF7F8 - main background */
+    --foreground: 351 34% 30%; /* 5D3A3F - main text */
 
-    --popover: 220 23.077% 94.902%;
-    --popover-foreground: 233.793 16.022% 35.49%;
+    /* Muted elements */
+    --muted: 350 40% 93%; /* F8E8EA - muted background */
+    --muted-foreground: 350 30% 45%; /* Lighter version of main text */
 
-    --card: 220 23.077% 94.902%;
-    --card-foreground: 233.793 16.022% 35.49%;
+    /* Popover and card */
+    --popover: 0 0% 100%; /* FFFFFF - popover background */
+    --popover-foreground: 351 34% 30%; /* 5D3A3F - popover text */
+    --card: 0 0% 100%; /* FFFFFF - card background */
+    --card-foreground: 351 34% 30%; /* 5D3A3F - card text */
 
-    --border: 225 13.559% 76.863%;
-    --input: 225 13.559% 76.863%;
+    /* Border and input */
+    --border: 350 30% 85%; /* Derived border color */
+    --input: 350 30% 85%; /* Input background */
 
-    --primary: 219.907 91.489% 53.922%;
-    --primary-foreground: 220 23.077% 94.902%;
+    /* Primary actions */
+    --primary: 350 70% 50%; /* C8394F - primary button */
+    --primary-foreground: 0 0% 100%; /* FFFFFF - text on primary */
 
-    --secondary: 222.857 15.909% 82.745%;
-    --secondary-foreground: 233.793 16.022% 35.49%;
+    /* Secondary elements */
+    --secondary: 350 40% 93%; /* F8E8EA - secondary background */
+    --secondary-foreground: 351 34% 30%; /* 5D3A3F - text on secondary */
 
-    --accent: 222.857 15.909% 82.745%;
-    --accent-foreground: 233.793 16.022% 35.49%;
+    /* Accent elements */
+    --accent: 350 70% 40%; /* A12D3E - accent color */
+    --accent-foreground: 0 0% 100%; /* FFFFFF - text on accent */
 
-    --destructive: 347.077 86.667% 44.118%;
-    --destructive-foreground: 220 21.951% 91.961%;
+    /* Destructive actions */
+    --destructive: 350 70% 55%; /* D63C56 - error/destroy */
+    --destructive-foreground: 0 0% 100%; /* FFFFFF - text on destructive */
 
-    --ring: 233.793 16.022% 35.49%;
+    /* Focus ring */
+    --ring: 350 70% 50%; /* C8394F - focus ring */
 
-    --surface-1: 225 14% 77%;
-    --surface-2: 227 12% 71%;
+    /* Surface colors */
+    --surface-1: 350 40% 93%; /* F8E8EA - surface 1 */
+    --surface-2: 350 35% 88%; /* Derived surface 2 */
 
-    --mantle: 220 22% 92%;
+    /* Mantle */
+    --mantle: 350 59% 98%; /* FDF7F8 - mantle */
 
+    /* Radius */
     --radius: 0.5rem;
 
-    --sidebar-background: 0 0% 98%;
-
-    --sidebar-foreground: 240 5.3% 26.1%;
-
-    --sidebar-primary: 240 5.9% 10%;
-
-    --sidebar-primary-foreground: 0 0% 98%;
-
-    --sidebar-accent: 240 4.8% 95.9%;
-
-    --sidebar-accent-foreground: 240 5.9% 10%;
-
-    --sidebar-border: 220 13% 91%;
-
-    --sidebar-ring: 217.2 91.2% 59.8%;
+    /* Sidebar specific */
+    --sidebar-background: 350 59% 98%; /* FDF7F8 - sidebar bg */
+    --sidebar-foreground: 351 34% 30%; /* 5D3A3F - sidebar text */
+    --sidebar-primary: 350 70% 50%; /* C8394F - sidebar primary */
+    --sidebar-primary-foreground: 0 0% 100%; /* FFFFFF - text on sidebar primary */
+    --sidebar-accent: 350 40% 93%; /* F8E8EA - sidebar accent */
+    --sidebar-accent-foreground: 351 34% 30%; /* 5D3A3F - text on sidebar accent */
+    --sidebar-border: 350 30% 85%; /* Derived border */
+    --sidebar-ring: 350 70% 50%; /* C8394F - sidebar focus ring */
   }
 
   .dark {
-    --background: 240 21.053% 14.902%;
-    --foreground: 226.154 63.934% 88.039%;
+    /* Dark theme - based on your color scheme */
 
-    --muted: 240 12% 19%;
-    --muted-foreground: 240 12% 69%;
+    /* Main background and foreground */
+    --background: 350 20% 15%; /* 2A1F21 - main background */
+    --foreground: 350 30% 92%; /* F5E6E8 - main text */
 
-    --popover: 240 21.053% 14.902%;
-    --popover-foreground: 226.154 63.934% 88.039%;
+    /* Muted elements */
+    --muted: 350 20% 25%; /* 4A2D31 - muted background */
+    --muted-foreground: 350 30% 75%; /* Lighter version of main text */
 
-    --card: 240 21.053% 14.902%;
-    --card-foreground: 226.154 63.934% 88.039%;
+    /* Popover and card */
+    --popover: 350 20% 15%; /* 2A1F21 - popover background */
+    --popover-foreground: 350 30% 92%; /* F5E6E8 - popover text */
+    --card: 350 20% 15%; /* 2A1F21 - card background */
+    --card-foreground: 350 30% 92%; /* F5E6E8 - card text */
 
-    --border: 234.286 13.208% 31.176%;
-    --input: 234.286 13.208% 31.176%;
+    /* Border and input */
+    --border: 350 20% 35%; /* Derived border color */
+    --input: 350 20% 35%; /* Input background */
 
-    --primary: 267 84% 81%;
-    --primary-foreground: 267 84% 21%;
+    /* Primary actions */
+    --primary: 350 100% 75%; /* FF7A8A - primary button */
+    --primary-foreground: 350 20% 15%; /* 2A1F21 - text on primary */
 
-    --secondary: 236.842 16.239% 22.941%;
-    --secondary-foreground: 226.154 63.934% 88.039%;
+    /* Secondary elements */
+    --secondary: 350 20% 25%; /* 4A2D31 - secondary background */
+    --secondary-foreground: 350 30% 92%; /* F5E6E8 - text on secondary */
 
-    --accent: 236.842 16.239% 22.941%;
-    --accent-foreground: 226.154 63.934% 88.039%;
+    /* Accent elements */
+    --accent: 350 100% 80%; /* FF9AAA - accent color */
+    --accent-foreground: 350 20% 15%; /* 2A1F21 - text on accent */
 
-    --destructive: 343.269 81.25% 74.902%;
-    --destructive-foreground: 240 21.311% 11.961%;
+    /* Destructive actions */
+    --destructive: 350 100% 70%; /* FF6B7D - error/destroy */
+    --destructive-foreground: 350 20% 15%; /* 2A1F21 - text on destructive */
 
-    --ring: 226.154 63.934% 88.039%;
+    /* Focus ring */
+    --ring: 350 100% 75%; /* FF7A8A - focus ring */
 
-    --surface-1: 234 13% 31%;
-    --surface-2: 233 12% 39%;
+    /* Surface colors */
+    --surface-1: 350 20% 25%; /* 4A2D31 - surface 1 */
+    --surface-2: 350 20% 35%; /* Derived surface 2 */
 
-    --mantle: 240 21.311% 11.961%;
+    /* Mantle */
+    --mantle: 350 20% 12%; /* 1F1617 - mantle */
 
+    /* Radius */
     --radius: 0.5rem;
 
-    --sidebar-background: 240 21.311% 11.961%;     /* crust - matches mantle var */
-    
-    --sidebar-foreground: 226.154 63.934% 88.039%; /* matches main foreground */
-    
-    --sidebar-primary: 217.168 91.87% 75.882%;     /* matches primary */
-    
-    --sidebar-primary-foreground: 240 21.053% 14.902%; /* matches primary-foreground */
-    
-    --sidebar-accent: 236.842 16.239% 22.941%;     /* matches accent */
-    
-    --sidebar-accent-foreground: 226.154 63.934% 88.039%; /* matches accent-foreground */
-    
-    --sidebar-border: 234.286 13.208% 31.176%;     /* matches border */
-    
-    --sidebar-ring: 217.168 91.87% 75.882%;        /* matches primary */
+    /* Sidebar specific */
+    --sidebar-background: 350 20% 12%; /* 1F1617 - sidebar bg */
+    --sidebar-foreground: 350 30% 92%; /* F5E6E8 - sidebar text */
+    --sidebar-primary: 350 100% 75%; /* FF7A8A - sidebar primary */
+    --sidebar-primary-foreground: 350 20% 15%; /* 2A1F21 - text on sidebar primary */
+    --sidebar-accent: 350 20% 25%; /* 4A2D31 - sidebar accent */
+    --sidebar-accent-foreground: 350 30% 92%; /* F5E6E8 - text on sidebar accent */
+    --sidebar-border: 350 20% 35%; /* Derived border */
+    --sidebar-ring: 350 100% 75%; /* FF7A8A - sidebar focus ring */
   }
 }
 
@@ -119,17 +133,20 @@
   body {
     @apply bg-background text-foreground;
   }
-
+  
   .scrollbar-hide::-webkit-scrollbar { display: none; }
   .scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
 }
+
 h1 {
   @apply scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl;
 }
+
 h2 {
   @apply scroll-m-20 pb-2 text-3xl font-semibold tracking-tight first:mt-0;
 }
 
+/* Media controller styles remain unchanged */
 media-controller {
   --media-primary-color: #ffffff;
   --media-secondary-color: hsla(var(--background), 0.85);
@@ -161,7 +178,7 @@ media-time-range {
 }
 
 media-time-display {
-  --media-text-color: #ffffff; 
+  --media-text-color: #ffffff;
 }
 
 media-controller::part(centered-layer) {

apps/web/src/components/app/ChatPanel/message.tsx

@@ -1,7 +1,7 @@
 import { User } from './ChatPanel';
 import React from 'react';
 import Image from 'next/image';
-import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
 import { Bot } from 'lucide-react';
 
 export function Message({ user, message, type, emojiMap }: MessageProps) {
@@ -48,24 +48,26 @@ export function EmojiRenderer({ text, emojiMap }: EmojiRendererProps) {
 
           if (emojiUrl) {
             return (
-              <Tooltip key={index} delayDuration={250}>
-                <TooltipTrigger>
-                  <span
-                    key={index}
-                    className="inline-block align-middle"
-                    style={{ height: '1.2em' }}
-                  >
-                    <Image
-                      src={emojiUrl}
-                      alt={part}
-                      width={20}
-                      height={20}
-                      className="inline-block"
-                    />
-                  </span>
-                </TooltipTrigger>
-                <TooltipContent>{part}</TooltipContent>
-              </Tooltip>
+              <TooltipProvider key={index}>
+                <Tooltip delayDuration={250}>
+                  <TooltipTrigger>
+                    <span
+                      key={index}
+                      className="inline-block align-middle"
+                      style={{ height: '1.2em' }}
+                    >
+                      <Image
+                        src={emojiUrl}
+                        alt={part}
+                        width={20}
+                        height={20}
+                        className="inline-block"
+                      />
+                    </span>
+                  </TooltipTrigger>
+                  <TooltipContent>{part}</TooltipContent>
+                </Tooltip>
+              </TooltipProvider>
             );
           }
         }

apps/web/src/components/app/Livestream/Livestream.tsx

@@ -3,7 +3,7 @@
 import StreamPlayer from '../StreamPlayer/StreamPlayer';
 import UserInfoCard from '../UserInfoCard/UserInfoCard';
 import ChatPanel from '../ChatPanel/ChatPanel';
-import type { StreamInfo, User, Channel } from '@hctv/db';
+import type { StreamInfo, Channel } from '@hctv/db';
 import { useIsMobile } from '@/lib/hooks/useMobile';
 
 export default function LiveStream(props: Props) {

apps/web/src/components/app/NavBar/NavBar.tsx

@@ -15,7 +15,7 @@ import { logout } from '@/lib/auth/actions';
 import { useSession } from '@/lib/providers/SessionProvider';
 import Link from 'next/link';
 import { ThemeSwitcher } from '../ThemeSwitcher/ThemeSwitcher';
-import { Slack } from 'lucide-react';
+import { IdCard, Slack } from 'lucide-react';
 import { SidebarTrigger } from '@/components/ui/sidebar';
 
 export default function Navbar(props: Props) {
@@ -58,7 +58,7 @@ export default function Navbar(props: Props) {
                     <DropdownMenuItem className="cursor-pointer">Bot accounts</DropdownMenuItem>
                   </Link>
                   <DropdownMenuSeparator />
-                  <Link href={'https://docs.hctv.srizan.dev'} target="_blank" rel="noreferrer">
+                  <Link href={'https://docs.hackclub.tv'} target="_blank" rel="noreferrer">
                     <DropdownMenuItem className="cursor-pointer">API Docs</DropdownMenuItem>
                   </Link>
                   <Link href={'https://github.com/SrIzan10/hctv'} target="_blank" rel="noreferrer">
@@ -97,9 +97,9 @@ export default function Navbar(props: Props) {
               </DropdownMenuContent>
             </DropdownMenu>
           ) : (
-            <Link href="/auth/slack">
+            <Link href="/auth/hackclub">
               <Button variant="outline" size="sm" className="gap-1 md:gap-2 text-xs md:text-sm">
-                <Slack className="w-3 h-3 md:w-4 md:h-4" />
+                <IdCard className="w-3 h-3 md:w-4 md:h-4" />
                 <span className="hidden sm:inline">Sign in</span>
                 <span className="sm:hidden">Login</span>
               </Button>

apps/web/src/components/app/Sidebar/Sidebar.tsx

@@ -13,124 +13,153 @@ import {
   SidebarMenu,
   SidebarMenuButton,
   SidebarMenuItem,
+  SidebarTrigger,
+  useSidebar,
 } from '@/components/ui/sidebar';
 import { StreamInfoResponse, useStreams } from '@/lib/providers/StreamInfoProvider';
 import { useRouter } from 'next/navigation';
 import { Skeleton } from '@/components/ui/skeleton';
 import { useAllChannels } from '@/lib/hooks/useUserList';
+import { cn } from '@/lib/utils';
+import { Separator } from '@/components/ui/separator';
 
 export default function Sidebar({ ...props }: React.ComponentProps<typeof UISidebar>) {
   const { channels: stream, isLoading } = useAllChannels(5000);
   const [followedExpanded, setFollowedExpanded] = React.useState(true);
+  const { state } = useSidebar();
+  const isCollapsed = state === 'collapsed';
 
-  if (isLoading) return <SidebarSkeleton />;
+  if (isLoading) return <SidebarSkeleton {...props} />;
 
   const liveStreamers = stream?.filter((s) => s.isLive) || [];
   const offlineStreamers = stream?.filter((s) => !s.isLive) || [];
 
   return (
-    <UISidebar {...props}>
+    <UISidebar collapsible="icon" {...props}>
       <SidebarContent>
         <SidebarGroup>
-          <SidebarGroupLabel asChild>
-            <button
-              onClick={() => setFollowedExpanded(!followedExpanded)}
-              className="w-full flex items-center justify-between"
-            >
-              <span>Live Channels</span>
-              {followedExpanded ? (
-                <ChevronUp className="h-4 w-4" />
-              ) : (
-                <ChevronDown className="h-4 w-4" />
-              )}
-            </button>
+          <SidebarGroupLabel className="flex items-center justify-between px-2 py-1.5">
+            <span className="text-xs font-semibold uppercase text-muted-foreground group-data-[collapsible=icon]:opacity-0 transition-opacity duration-200">
+              Live Channels
+            </span>
+            <span className="text-xs text-muted-foreground group-data-[collapsible=icon]:opacity-0 transition-opacity duration-200">
+              {liveStreamers.length}
+            </span>
           </SidebarGroupLabel>
 
-          {followedExpanded && (
-            <SidebarGroupContent>
-              <SidebarMenu>
-                {liveStreamers.map((streamer) => (
-                  <StreamerItem key={streamer.id} streamer={streamer} />
-                ))}
-              </SidebarMenu>
-            </SidebarGroupContent>
-          )}
+          <SidebarGroupContent>
+            <SidebarMenu>
+              {liveStreamers.length === 0 && !isCollapsed && (
+                <div className="px-4 py-2 text-sm text-muted-foreground">
+                  No channels live
+                </div>
+              )}
+              {liveStreamers.map((streamer) => (
+                <StreamerItem key={streamer.id} streamer={streamer} isCollapsed={isCollapsed} />
+              ))}
+            </SidebarMenu>
+          </SidebarGroupContent>
         </SidebarGroup>
 
-        {offlineStreamers.length > 0 && (
-          <SidebarGroup>
-            <SidebarGroupLabel>Offline Channels</SidebarGroupLabel>
-            <SidebarGroupContent>
-              <SidebarMenu>
-                {offlineStreamers.map((streamer) => (
-                  <StreamerItem key={streamer.id} streamer={streamer} />
-                ))}
-              </SidebarMenu>
-            </SidebarGroupContent>
-          </SidebarGroup>
-        )}
+        <Separator className="group-data-[collapsible=icon]:block hidden" />
+        
+        <SidebarGroup>
+          <SidebarGroupLabel className="flex items-center justify-between px-2 py-1.5">
+            <span className="text-xs font-semibold uppercase text-muted-foreground group-data-[collapsible=icon]:opacity-0 transition-opacity duration-200">
+              Offline Channels
+            </span>
+          </SidebarGroupLabel>
+          <SidebarGroupContent>
+            <SidebarMenu>
+              {offlineStreamers.map((streamer) => (
+                <StreamerItem key={streamer.id} streamer={streamer} isCollapsed={isCollapsed} />
+              ))}
+            </SidebarMenu>
+          </SidebarGroupContent>
+        </SidebarGroup>
       </SidebarContent>
     </UISidebar>
   );
 }
 
-function StreamerItem({ streamer }: { streamer: StreamInfoResponse[0] }) {
+function StreamerItem({ streamer, isCollapsed }: { streamer: StreamInfoResponse[0], isCollapsed: boolean }) {
   const router = useRouter();
+  
   return (
-    <SidebarMenuItem key={streamer.id} className={streamer.isLive ? '' : '*:text-muted-foreground'}>
-      <SidebarMenuButton className="flex items-center gap-3 h-full" onClick={() => {
-        router.push(`/${streamer.username}`);
-      }}>
-        <div className="relative">
-          <Avatar className="h-9 w-9">
-            <AvatarImage src={streamer.channel.pfpUrl} alt={streamer.username} />
-            <AvatarFallback>{streamer.username}</AvatarFallback>
-          </Avatar>
-          {streamer.isLive && (
-            <span className="absolute -top-1 -right-1 w-3 h-3 bg-primary rounded-full border-2 border-black" />
+    <SidebarMenuItem>
+      <SidebarMenuButton
+        asChild
+        tooltip={streamer.username}
+        className="h-12"
+        onClick={() => router.push(`/${streamer.username}`)}
+      >
+        <button className="flex w-full items-center gap-3">
+          <div className="relative flex-shrink-0">
+            <Avatar className="h-8 w-8">
+              <AvatarImage src={streamer.channel.pfpUrl} alt={streamer.username} className="object-cover" />
+              <AvatarFallback>{streamer.username[0]?.toUpperCase()}</AvatarFallback>
+            </Avatar>
+            {streamer.isLive && (
+              <span className="absolute -bottom-0.5 -right-0.5 flex h-3 w-3 items-center justify-center rounded-full bg-background ring-2 ring-background">
+                <span className="h-2 w-2 rounded-full bg-red-500 animate-pulse" />
+              </span>
+            )}
+          </div>
+          
+          {!isCollapsed && (
+            <div className="flex flex-1 flex-col items-start overflow-hidden">
+              <div className="flex w-full items-center justify-between">
+                <span className="truncate font-medium text-sm leading-none">
+                  {streamer.username}
+                </span>
+                {streamer.isLive && (
+                  <div className="flex items-center gap-1 text-xs text-red-500">
+                    <span className="h-1.5 w-1.5 rounded-full bg-red-500" />
+                    <span>{streamer.viewers}</span>
+                  </div>
+                )}
+              </div>
+              <span className="truncate text-xs text-muted-foreground w-full text-left">
+                {streamer.isLive ? streamer.title || streamer.category || 'Live' : 'Offline'}
+              </span>
+            </div>
           )}
-        </div>
-        <div className="flex-1">
-          <p className="font-medium truncate">{streamer.username}</p>
-          <p className="text-sm truncate">{streamer.category}</p>
-          {streamer.isLive && (
-            <p className="text-sm">
-              {streamer.viewers} viewer{streamer.viewers === 1 ? '' : 's'}
-            </p>
-          )}
-        </div>
+        </button>
       </SidebarMenuButton>
     </SidebarMenuItem>
   );
 }
 
 function SidebarSkeleton({ ...props }: React.ComponentProps<typeof UISidebar>) {
+  const { state } = useSidebar();
+  const isCollapsed = state === 'collapsed';
+
   return (
-    <UISidebar {...props}>
+    <UISidebar collapsible="icon" {...props}>
       <SidebarContent>
         <SidebarGroup>
-          <SidebarGroupLabel asChild>
-            <button className="w-full flex items-center justify-between">
-              <span>Live Channels</span>
-              <ChevronUp className="h-4 w-4" />
-            </button>
+          <SidebarGroupLabel className="px-2 py-1.5">
+            <Skeleton className="h-4 w-24 group-data-[collapsible=icon]:opacity-0 transition-opacity duration-200" />
           </SidebarGroupLabel>
-
           <SidebarGroupContent>
             <SidebarMenu>
               {Array(3).fill(0).map((_, i) => (
-                <StreamerItemSkeleton key={i} />
+                <StreamerItemSkeleton key={i} isCollapsed={isCollapsed} />
               ))}
             </SidebarMenu>
           </SidebarGroupContent>
         </SidebarGroup>
 
+        <Separator className="group-data-[collapsible=icon]:block hidden" />
+
         <SidebarGroup>
-          <SidebarGroupLabel>Offline Channels</SidebarGroupLabel>
+          <SidebarGroupLabel className="px-2 py-1.5">
+            <Skeleton className="h-4 w-24 group-data-[collapsible=icon]:opacity-0 transition-opacity duration-200" />
+          </SidebarGroupLabel>
           <SidebarGroupContent>
             <SidebarMenu>
               {Array(5).fill(0).map((_, i) => (
-                <StreamerItemSkeleton key={i} />
+                <StreamerItemSkeleton key={i} isCollapsed={isCollapsed} />
               ))}
             </SidebarMenu>
           </SidebarGroupContent>
@@ -140,16 +169,18 @@ function SidebarSkeleton({ ...props }: React.ComponentProps<typeof UISidebar>) {
   );
 }
 
-function StreamerItemSkeleton() {
+function StreamerItemSkeleton({ isCollapsed }: { isCollapsed: boolean }) {
   return (
     <SidebarMenuItem>
-      <SidebarMenuButton className="flex items-center gap-3 h-full">
-        <div className="relative">
-          <Skeleton className="h-9 w-9 rounded-full" />
-        </div>
-        <div className="flex-1 space-y-2">
-          <Skeleton className="h-4 w-24" />
-          <Skeleton className="h-3 w-16" />
+      <SidebarMenuButton className="h-12">
+        <div className="flex w-full items-center gap-3">
+          <Skeleton className="h-8 w-8 rounded-full flex-shrink-0" />
+          {!isCollapsed && (
+            <div className="flex-1 space-y-1.5">
+              <Skeleton className="h-3.5 w-24" />
+              <Skeleton className="h-3 w-16" />
+            </div>
+          )}
         </div>
       </SidebarMenuButton>
     </SidebarMenuItem>

apps/web/src/components/app/StreamPlayer/StreamPlayer.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { useParams } from 'next/navigation';
+import { useRef, useEffect } from 'react';
 import {
   MediaController,
   MediaLoadingIndicator,
@@ -13,45 +14,47 @@ import {
   MediaFullscreenButton,
 } from 'media-chrome/react';
 import HlsVideo from 'hls-video-element/react';
+import { useSession } from '@/lib/providers/SessionProvider';
 
 export default function StreamPlayer() {
   const { username } = useParams();
+  const { session } = useSession();
+  const videoRef = useRef(null);
+
+  useEffect(() => {
+    const video = videoRef.current;
+    if (video && username && session) {
+      const user = 'skibiditoilet';
+      const credentials = btoa(`${user}:${session.id}`);
+
+      // @ts-ignore
+      video.config = {
+        xhrSetup: (xhr: XMLHttpRequest) => {
+          xhr.setRequestHeader('Authorization', `Basic ${credentials}`);
+        },
+        lowLatencyMode: true,
+        debug: process.env.NODE_ENV === 'development',
+      };
+
+      // @ts-ignore
+      video.src = `${process.env.NEXT_PUBLIC_MEDIAMTX_URL}/${username}/index.m3u8`;
+    }
+
+    return () => {
+      if (video) {
+        // @ts-ignore
+        video.src = '';
+      }
+    };
+  }, [username, session]);
 
   return (
     <MediaController className="w-full aspect-video">
       <HlsVideo
-        src={`/api/rtmp/hls/${username}.m3u8`}
+        ref={videoRef}
         slot="media"
         crossOrigin="anonymous"
         autoplay
-        config={{
-          lowLatencyMode: true,
-          liveSyncDurationCount: 1,
-          liveMaxLatencyDurationCount: 2,
-          liveDurationInfinity: true,
-          enableWorker: true,
-          backBufferLength: 1,
-          startLevel: -1,
-          maxBufferLength: 2,
-          maxMaxBufferLength: 4,
-          startFragPrefetch: true,
-          testBandwidth: false,
-          progressive: false,
-          maxBufferSize: 10 * 1000 * 1000,
-          maxBufferHole: 0.1,
-          highBufferWatchdogPeriod: 0.5,
-          nudgeOffset: 0.01,
-          nudgeMaxRetry: 3,
-          manifestLoadingTimeOut: 3000,
-          manifestLoadingMaxRetry: 3,
-          levelLoadingTimeOut: 3000,
-          fragLoadingTimeOut: 5000,
-          debug: process.env.NODE_ENV === 'development',
-          liveSyncDuration: 1,
-          liveMaxLatencyDuration: 3,
-          maxLiveSyncPlaybackRate: 1.5,
-          liveBackBufferLength: 0,
-        }}
       />
       <MediaLoadingIndicator slot="centered-chrome" noAutohide />
       <MediaControlBar className="w-full px-2">

apps/web/src/components/ui/button.tsx

@@ -26,7 +26,8 @@ const buttonVariants = cva(
         default: "h-10 px-4 py-2",
         sm: "h-9 rounded-md px-3",
         lg: "h-11 rounded-md px-8",
-        icon: "h-10 w-10"
+        icon: "h-10 w-10",
+        smicon: "h-9 w-9",
       },
     },
     defaultVariants: {

apps/web/src/components/ui/channel-desc-fancy-area/mention.tsx

@@ -37,7 +37,7 @@ export function Mention({ children, handle }: Props) {
   }
 
   const fallback = handle.substring(0, 2).toUpperCase();
-  const url = `https://hctv.srizan.dev/${handle}`;
+  const url = `https://hackclub.tv/${handle}`;
 
   return (
     <HoverCard>

apps/web/src/components/ui/sidebar.tsx

@@ -23,7 +23,7 @@ const SIDEBAR_COOKIE_NAME = "sidebar:state"
 const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7
 const SIDEBAR_WIDTH = "16rem"
 const SIDEBAR_WIDTH_MOBILE = "18rem"
-const SIDEBAR_WIDTH_ICON = "3rem"
+const SIDEBAR_WIDTH_ICON = "4rem"
 const SIDEBAR_KEYBOARD_SHORTCUT = "b"
 
 type SidebarContext = {
@@ -512,7 +512,7 @@ const SidebarMenuItem = React.forwardRef<
 SidebarMenuItem.displayName = "SidebarMenuItem"
 
 const sidebarMenuButtonVariants = cva(
-  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-12 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
   {
     variants: {
       variant: {

apps/web/src/instrumentation.ts

@@ -6,6 +6,7 @@ export async function register() {
   if (process.env.NEXT_RUNTIME === 'nodejs') {
     await (await import('@/lib/instrumentation/streamInfo')).default();
     await (await import('@/lib/instrumentation/writeSessions')).default();
+    await (await import('@/lib/instrumentation/syncStreamKeys')).default();
   }
   
   if (process.env.NEXT_RUNTIME === 'nodejs') {

apps/web/src/lib/db/streamKey.ts

@@ -0,0 +1,35 @@
+import { prisma, getRedisConnection } from '@hctv/db';
+
+export async function generateStreamKey(channelId: string, channelName: string) {
+  const streamKey = await prisma.streamKey.create({
+    data: {
+      key: crypto.randomUUID(),
+      channelId,
+    },
+  });
+
+  const redis = getRedisConnection();
+  await redis.set(`streamKey:${channelName}`, streamKey.key);
+
+  return streamKey;
+}
+
+export async function regenerateStreamKey(channelId: string, channelName: string) {
+  const streamKey = await prisma.streamKey.upsert({
+    create: {
+      key: crypto.randomUUID(),
+      channelId,
+    },
+    update: {
+      key: crypto.randomUUID(),
+    },
+    where: {
+      channelId,
+    },
+  });
+
+  const redis = getRedisConnection();
+  await redis.set(`streamKey:${channelName}`, streamKey.key);
+
+  return streamKey;
+}

apps/web/src/lib/form/actions.ts

@@ -6,11 +6,20 @@ import { prisma } from '@hctv/db';
 import zodVerify from '../zodVerify';
 import {
   createBotSchema,
-  createChannelSchema, editBotSchema, onboardSchema, streamInfoEditSchema, updateChannelSettingsSchema
+  createChannelSchema,
+  editBotSchema,
+  onboardSchema,
+  streamInfoEditSchema,
+  updateChannelSettingsSchema,
 } from './zod';
 import { initializeStreamInfo } from '../instrumentation/streamInfo';
-import { resolveFollowedChannels, resolveStreamInfo, resolveUserFromPersonalChannelName } from '../auth/resolve';
+import {
+  resolveFollowedChannels,
+  resolveStreamInfo,
+  resolveUserFromPersonalChannelName,
+} from '../auth/resolve';
 import { genIdenticonUpload } from '../utils/genIdenticonUpload';
+import { generateStreamKey } from '../db/streamKey';
 
 export async function editStreamInfo(prev: any, formData: FormData) {
   const { user } = await validateRequest();
@@ -81,8 +90,8 @@ export async function onboard(prev: any, formData: FormData) {
       ownerId: user.id,
       personalFor: { connect: { id: user.id } },
       pfpUrl: user.pfpUrl,
-    }
-  })
+    },
+  });
   await prisma.user.update({
     where: { id: user.id },
     data: {
@@ -94,13 +103,15 @@ export async function onboard(prev: any, formData: FormData) {
   });
   await initializeStreamInfo(createdChannel.id);
 
+  await generateStreamKey(createdChannel.id, createdChannel.name);
+
   if (process.env.NODE_ENV === 'production') {
     await fetch(process.env.WELCOME_WORKFLOW_URL!, {
       method: 'POST',
       body: JSON.stringify({
         username: zod.data.username,
       }),
-    })
+    });
   }
 
   return { success: true };
@@ -153,11 +164,13 @@ export async function createChannel(prev: any, formData: FormData) {
       name: zod.data.name,
       ownerId: user.id,
       pfpUrl: identicon,
-    }
+    },
   });
 
   await initializeStreamInfo(createdChannel.id);
 
+  await generateStreamKey(createdChannel.id, createdChannel.name);
+
   return { success: true, channel: createdChannel.name };
 }
 
@@ -166,9 +179,10 @@ export async function updateChannelSettings(prev: any, formData: FormData) {
   if (!user) {
     return { success: false, error: 'Unauthorized' };
   }
-  
+
   const zod = await zodVerify(updateChannelSettingsSchema, formData);
-  const urlRegex = /(?:http[s]?:\/\/.)?(?:www\.)?[-a-zA-Z0-9@%._\+~#=]{2,256}\.[a-z]{2,6}\b(?:[-a-zA-Z0-9@:%_\+.~#?&\/\/=]*)/gm;
+  const urlRegex =
+    /(?:http[s]?:\/\/.)?(?:www\.)?[-a-zA-Z0-9@%._\+~#=]{2,256}\.[a-z]{2,6}\b(?:[-a-zA-Z0-9@:%_\+.~#?&\/\/=]*)/gm;
   if (!zod.success) {
     return zod;
   }
@@ -189,7 +203,7 @@ export async function updateChannelSettings(prev: any, formData: FormData) {
   }
 
   const isOwner = channel.ownerId === user.id;
-  const isManager = channel.managers.some(manager => manager.id === user.id);
+  const isManager = channel.managers.some((manager) => manager.id === user.id);
 
   if (!isOwner && !isManager) {
     return { success: false, error: 'Unauthorized' };
@@ -233,7 +247,7 @@ export async function addChannelManager(channelId: string, userChannel: string)
   }
 
   if (channel.ownerId === userChannel) {
-    return { success: false, error: 'Owner can\'t add themselves as managers' };
+    return { success: false, error: "Owner can't add themselves as managers" };
   }
 
   const userDb = await resolveUserFromPersonalChannelName(userChannel);
@@ -315,8 +329,8 @@ export async function toggleGlobalChannelNotifs(channelId: string) {
     },
     data: {
       enableNotifications: !streamInfo.enableNotifications,
-    }
-  })
+    },
+  });
 
   revalidatePath(`/settings/channel/${channel.name}`);
 
@@ -324,15 +338,14 @@ export async function toggleGlobalChannelNotifs(channelId: string) {
 }
 
 export async function deleteChannel(channelId: string) {
-  return { success: false, error: 'disabled atm. dm @eth0 if you want to request a deletion.' }
-  /* const { user } = await validateRequest();
+  const { user } = await validateRequest();
   if (!user) {
     return { success: false, error: 'Unauthorized' };
   }
 
   const channel = await prisma.channel.findUnique({
     where: { id: channelId },
-    include: { 
+    include: {
       owner: true,
       personalFor: true,
     },
@@ -346,7 +359,6 @@ export async function deleteChannel(channelId: string) {
     return { success: false, error: 'Only channel owners can delete channels' };
   }
 
-  // Prevent deletion of personal channels
   if (channel.personalFor) {
     return { success: false, error: 'Cannot delete personal channels' };
   }
@@ -355,7 +367,7 @@ export async function deleteChannel(channelId: string) {
     where: { id: channelId },
   });
 
-  return { success: true }; */
+  return { success: true };
 }
 
 export async function createBot(prev: any, formData: FormData) {
@@ -382,10 +394,10 @@ export async function createBot(prev: any, formData: FormData) {
       ownerId: user.id,
       description: zod.data.description,
       pfpUrl: await genIdenticonUpload(zod.data.slug, 'botpfp'),
-    }
+    },
   });
 
-  return { success: true, slug: createdBot.slug }
+  return { success: true, slug: createdBot.slug };
 }
 
 export async function editBot(prev: any, formData: FormData) {
@@ -422,10 +434,10 @@ export async function editBot(prev: any, formData: FormData) {
       displayName: zod.data.name,
       slug: zod.data.slug,
       description: zod.data.description,
-    }
+    },
   });
 
   revalidatePath(`/settings/bot/${updatedBot.slug}`);
 
-  return { success: true, slug: updatedBot.slug }
-}
+  return { success: true, slug: updatedBot.slug };
+}

apps/web/src/lib/instrumentation/streamInfo.ts

@@ -2,6 +2,7 @@ import { prisma } from '@hctv/db';
 import { HttpFlv } from '../types/liveBackendJson';
 import { getNotificationQueue } from '../workers';
 import client from '../services/slackNotifier';
+import type { paths } from '../types/mediamtx.d.ts';
 
 export default async function runner() {
   // if there are no users it explodes so yeah
@@ -48,28 +49,21 @@ export async function initializeStreamInfo(channelId?: string) {
 
 export async function syncStream() {
   try {
-    const response = await fetch(`${process.env.LIVE_SERVER_URL}/stat`, {
-      headers: {
-        Authorization: process.env.STAT_AUTH!,
-      },
-    });
+    const response = await fetch(`${process.env.MEDIAMTX_API}/v3/paths/list?itemsPerPage=1000`);
 
     if (!response.ok) {
       console.error(`Failed to fetch stream stats: ${response.status} ${response.statusText}`);
       return;
     }
 
-    const data = await response.json();
-    const httpFlv = data['http-flv'] as HttpFlv;
+    type ResponseType = paths['/v3/paths/list']['get']['responses']['200']['content']['application/json'];
+    const data = await response.json() as ResponseType;
 
-    if (!httpFlv?.servers?.[0]?.applications) {
+    if (!data) {
       return;
     }
 
-    const channelLiveApp = httpFlv.servers[0].applications.find(
-      (app) => app.name === 'channel-live'
-    );
-    const activeStreams = channelLiveApp?.live?.streams || [];
+    const activeStreams = data.items!;
 
     const currentLiveStreams = await prisma.streamInfo.findMany({
       where: { isLive: true },
@@ -78,8 +72,7 @@ export async function syncStream() {
     const activeStreamMap = new Map();
     for (const stream of activeStreams) {
       activeStreamMap.set(stream.name, {
-        isLive: stream.active,
-        viewers: stream.clients.filter((c) => !c.publishing).length,
+        isLive: stream.ready,
       });
     }
 
@@ -99,7 +92,7 @@ export async function syncStream() {
     }
 
     for (const stream of activeStreams) {
-      if (stream.active) {
+      if (stream.ready) {
         const existingStream = await prisma.streamInfo.findUnique({
           where: { username: stream.name },
           include: { channel: true },
@@ -128,7 +121,7 @@ export async function syncStream() {
 
           if (!existingStream.channel.is247) {
             queue.add(`streamStartChannel:${existingStream.username}`, {
-              text: `${existingStream.username} is now *live*, streaming *${existingStream.title}* (${existingStream.category})!\n<https://hctv.srizan.dev/${existingStream.username}|Go check them out>`,
+              text: `${existingStream.username} is now *live*, streaming *${existingStream.title}* (${existingStream.category})!\n<https://hackclub.tv/${existingStream.username}|Go check them out>`,
               channel: process.env.NOTIFICATION_CHANNEL_ID!,
               unfurl_links: true,
             });
@@ -136,7 +129,7 @@ export async function syncStream() {
           if (existingStream.enableNotifications && !existingStream.channel.is247) {
             for (const follower of subscribedFollowers) {
               queue.add(`streamStartDm:${follower.user.id}`, {
-                text: `${existingStream.username} is now *live*, streaming *${existingStream.title}* (${existingStream.category})!\n<https://hctv.srizan.dev/${existingStream.username}|Go check them out>\n_Stream notifications are enabled for this user. If you want to disable them, you can do so in \`Profile > Follows\`._`,
+                text: `${existingStream.username} is now *live*, streaming *${existingStream.title}* (${existingStream.category})!\n<https://hackclub.tv/${existingStream.username}|Go check them out>\n_Stream notifications are enabled for this user. If you want to disable them, you can do so in \`Profile > Follows\`._`,
                 channel: follower.user.slack_id,
                 unfurl_links: true,
               });

apps/web/src/lib/instrumentation/syncStreamKeys.ts

@@ -0,0 +1,31 @@
+import { prisma, getRedisConnection } from '@hctv/db';
+
+export default async function syncStreamKeys() {
+  console.log('Syncing stream keys to Redis...');
+  try {
+    const keys = await prisma.streamKey.findMany({
+      include: {
+        channel: true,
+      },
+    });
+
+    if (keys.length === 0) {
+      console.log('No stream keys found to sync.');
+      return;
+    }
+
+    const redis = getRedisConnection();
+    const pipeline = redis.pipeline();
+
+    for (const key of keys) {
+      if (key.channel && key.channel.name) {
+        pipeline.set(`streamKey:${key.channel.name}`, key.key);
+      }
+    }
+
+    await pipeline.exec();
+    console.log(`Synced ${keys.length} stream keys to Redis`);
+  } catch (error) {
+    console.error('Failed to sync stream keys to Redis:', error);
+  }
+}

apps/web/src/lib/workers/worker/thumbnails.ts

@@ -1,9 +1,9 @@
 import { Worker } from 'bullmq';
 import { getRedisConnection } from '@hctv/db';
-import { exec } from 'node:child_process';
 import { promisify } from 'node:util';
 import { existsSync } from 'node:fs';
-const pExec = promisify(exec);
+import { exec as execCallback } from 'node:child_process';
+const pExec = promisify(execCallback);
 
 const globalForWorker = global as unknown as {
   thumbnailWorker: Worker | null;
@@ -26,28 +26,24 @@ export async function registerThumbnailWorker(): Promise<void> {
       try {
         // this is totally unnecessary, but i'll keep it for security purposes.
         const name = job.data.name.replace(/[^a-zA-Z0-9]/g, '_');
-        const m3u8location = `/dev/shm/hls/${name}.m3u8`;
+        const m3u8location = `${process.env.NEXT_PUBLIC_MEDIAMTX_URL}/${name}/index.m3u8`;
         const thumbDir = '/dev/shm/hctv-thumb';
         
-        if (!existsSync(m3u8location)) return;
         if (!existsSync(thumbDir)) {
           await pExec(`mkdir -p ${thumbDir}`);
         }
-        // unnecessary for development, but maybe docker volumes mess with permissions in prod
-        // also ik it's not the best practice to use 777, but it'll be fiiiiiine
-        // await pExec('chown -R 777 /dev/shm/hctv-thumb');
 
-        exec(
-          `ffmpeg -i ${m3u8location} -vframes 1 -an -y -f image2 ${thumbDir}/${name}.webp`,
-          (error) => {
-            if (error) {
-              console.error(`Error: ${error.message}`);
-              return { success: false, error: error.message };
-            }
-          }
-        );
-
-        return { success: true };
+        const header = `-headers "Authorization: Basic ${Buffer.from(`skibiditoilet:${process.env.MEDIAMTX_PUBLISH_KEY}`).toString('base64')}\r\n" `;
+        
+        try {
+          await pExec(
+            `ffmpeg ${header} -i ${m3u8location} -vframes 1 -an -y -f image2 ${thumbDir}/${name}.webp`
+          );
+          return { success: true };
+        } catch (ffmpegError) {
+          console.error(`FFmpeg error for ${name}:`, ffmpegError);
+          return { success: false, error: ffmpegError instanceof Error ? ffmpegError.message : String(ffmpegError) };
+        }
       } catch (e) {
         console.error('Slack notification failed:', e);
         // @ts-ignore e is unknown

apps/web/tailwind.config.mts

@@ -1,5 +1,6 @@
 import type { Config } from "tailwindcss"
-import { withUt } from "uploadthing/tw";
+import { uploadthingPlugin } from 'uploadthing/tw'
+import * as tan from 'tailwindcss-animate'
 
 const config = {
   darkMode: ["class"],
@@ -102,7 +103,7 @@ const config = {
   		}
   	}
   },
-  plugins: [require("tailwindcss-animate")],
+  plugins: [tan, uploadthingPlugin],
 } satisfies Config
 
-export default withUt(config)
+export default config

apps/web/tsconfig.json

@@ -32,7 +32,9 @@
     "next-env.d.ts",
     "**/*.ts",
     "**/*.tsx",
-    ".next/types/**/*.ts"
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts",
+    "tailwind.config.mts"
   ],
   "exclude": [
     "node_modules"

dev/docker-compose.yml

@@ -15,38 +15,11 @@ services:
       - ./redis:/data
     ports:
       - 6379:6379
-  nginx-rtmp:
-    # ports:
-    #   - 1935:1935
-    #   - 8888:8888
-    network_mode: host
-    environment:
-      UID: 1000
-      GID: 1000
-      API_AUTH: skibiditoilet
+  mediamtx:
+    image: bluenviron/mediamtx:latest
+    ports:
+      - 8890:8890/udp
+      - 8891:8888
+      - 9997:9997
     volumes:
-      - ./nginx.conf:/etc/nginx/templates/nginx.conf.template
-      - ./html:/var/www/html
-      - /dev/shm/hls:/dev/shm/hls
-    image: srizan10/flv-module
-    entrypoint:
-      - /bin/sh
-      - -c
-      - |
-        # Process the template file
-        mkdir -p /usr/local/nginx/conf
-        envsubst '$${API_AUTH}' < /etc/nginx/templates/nginx.conf.template > /usr/local/nginx/conf/nginx.conf
-
-        echo "Setting UID to $${UID} and GID to $${GID}"
-        usermod -u $${UID} nginx || echo "failed to change uid"
-        groupmod -g $${GID} nginx || echo "failed to change gid"
-
-        mkdir -p /usr/local/nginx/proxy_temp /usr/local/nginx/client_body_temp
-        chown -R nginx:nginx /usr/local/nginx
-        mkdir -p /var/www/html
-        chown -R nginx:nginx /var/www/html
-
-        echo "testing nginx config..."
-        /usr/local/nginx/sbin/nginx -t
-
-        /usr/local/nginx/sbin/nginx -g 'daemon off;'
+      - ./mediamtx.yml:/mediamtx.yml

dev/mediamtx.yml

@@ -0,0 +1,13 @@
+paths:
+  all:
+    source: publisher
+
+srt: yes
+srtAddress: :8890
+
+hls: yes
+
+authMethod: http
+authHTTPAddress: http://192.168.1.47:3000/api/mediamtx/publish
+
+api: yes

dev/nginx.conf

@@ -54,7 +54,7 @@ http {
 
   map $http_authorization $is_authorized {
     default 0;
-    $API_AUTH 1;
+    ${API_AUTH} 1;
   }
 
   server {

flv-module/Dockerfile

@@ -1,4 +1,4 @@
-FROM alpine:3.19 as builder
+FROM alpine:3.19 AS builder
 
 RUN apk add --no-cache \
     build-base \
@@ -37,20 +37,8 @@ RUN mkdir -p /etc/nginx/templates
 
 EXPOSE 80 1935 8888
 
-# Create an entrypoint script to handle environment variable substitution
-RUN echo '#!/bin/sh \n\
-# Replace environment variables in configuration templates \n\
-for template in /etc/nginx/templates/*.conf.template; do \n\
-  if [ -f "$template" ]; then \n\
-    output_file="/usr/local/nginx/conf/$(basename $template .template)" \n\
-    echo "Processing template: $template -> $output_file" \n\
-    envsubst "$(env | awk -F= "{printf \\\"\\\$%s \\\",\\\$1}")" < $template > $output_file \n\
-  fi \n\
-done \n\
-\n\
-# Start Nginx \n\
-exec "$@"' > /docker-entrypoint.sh && \
-chmod +x /docker-entrypoint.sh
+COPY docker-entrypoint.sh /docker-entrypoint.sh
+RUN chmod +x /docker-entrypoint.sh
 
 ENTRYPOINT ["/docker-entrypoint.sh"]
 CMD ["/usr/local/nginx/sbin/nginx", "-g", "daemon off;"]

flv-module/docker-entrypoint.sh

@@ -0,0 +1,27 @@
+#!/bin/sh
+set -e
+
+UID=${UID:-1000}
+GID=${GID:-1000}
+
+echo "Setting UID to $UID and GID to $GID"
+usermod -u $UID nginx 2>/dev/null || echo "Failed to change UID"
+groupmod -g $GID nginx 2>/dev/null || echo "Failed to change GID"
+
+mkdir -p /usr/local/nginx/conf
+for template in /etc/nginx/templates/*.conf.template; do
+  if [ -f "$template" ]; then
+    output_file="/usr/local/nginx/conf/$(basename $template .template)"
+    echo "Processing template: $template -> $output_file"
+    envsubst '${API_AUTH}' < $template > $output_file
+  fi
+done
+
+mkdir -p /usr/local/nginx/proxy_temp /usr/local/nginx/client_body_temp
+mkdir -p /var/www/html
+chown -R nginx:nginx /usr/local/nginx /var/www/html
+
+echo "Testing nginx configuration..."
+/usr/local/nginx/sbin/nginx -t
+
+exec "$@"

packages/auth/src/index.ts

@@ -1,10 +1,18 @@
 import { PrismaAdapter } from '@lucia-auth/adapter-prisma';
 import { Lucia } from 'lucia';
 import { prisma } from '@hctv/db';
-import { Slack } from 'arctic';
+import { OAuth2Client } from 'arctic';
 
 const adapter = new PrismaAdapter(prisma.session, prisma.user);
-export const slack = new Slack(process.env.SLACK_ID!, process.env.SLACK_SECRET!, process.env.SLACK_REDIRECT_URI!);
+export const hackClub = new OAuth2Client(
+  process.env.HCID_CLIENT!,
+  process.env.HCID_SECRET!,
+  process.env.HCID_REDIRECT_URI!
+);
+
+export const HCID_AUTH_URL = "https://account.hackclub.com/oauth/authorize";
+export const HCID_TOKEN_URL = "https://account.hackclub.com/oauth/token";
+export const HCID_USER_INFO_URL = "https://account.hackclub.com/api/v1/me";
 
 export const lucia = new Lucia(adapter, {
   sessionCookie: {
@@ -19,6 +27,7 @@ export const lucia = new Lucia(adapter, {
   getUserAttributes: (attributes) => {
     return {
       slack_id: attributes.slack_id,
+      email: attributes.email,
       pfpUrl: attributes.pfpUrl,
       hasOnboarded: attributes.hasOnboarded,
       personalChannelId: attributes.personalChannelId,
@@ -35,6 +44,7 @@ declare module 'lucia' {
 
 interface DatabaseUserAttributes {
   slack_id: string;
+  email: string | null;
   pfpUrl: string;
   hasOnboarded: boolean;
   personalChannelId: string | null;

packages/db/Dockerfile

@@ -1,44 +0,0 @@
-FROM node:lts-alpine AS base
-
-FROM base AS builder
-RUN apk update
-RUN apk add --no-cache libc6-compat
-# Set working directory
-WORKDIR /app
-RUN yarn global add turbo@^2
-COPY . .
- 
-# Generate a partial monorepo with a pruned lockfile for the db package
-RUN turbo prune @hctv/db --docker
- 
-FROM base AS installer
-RUN apk update
-RUN apk add --no-cache libc6-compat
-WORKDIR /app
- 
-# First install the dependencies
-COPY --from=builder /app/out/json/ .
-RUN yarn install --frozen-lockfile
-
-COPY --from=builder /app/out/full/ .
-RUN --mount=type=secret,id=TURBO_TOKEN --mount=type=secret,id=TURBO_TEAM TURBO_TOKEN=$(cat /run/secrets/TURBO_TOKEN) TURBO_TEAM=$(cat /run/secrets/TURBO_TEAM) yarn turbo run build --filter=@hctv/db
- 
-FROM base AS runner
-WORKDIR /app
- 
-RUN addgroup --system --gid 1001 nodejs
-RUN adduser --system --uid 1001 prisma
-USER prisma
- 
-COPY --from=installer --chown=prisma:nodejs /app/packages ./packages
-COPY --from=installer --chown=prisma:nodejs /app/node_modules ./node_modules
-COPY --from=installer --chown=prisma:nodejs /app/package.json ./package.json
-
-# Set environment variables for database connection
-ENV NODE_ENV=production
-
-# Set the working directory to the db package
-WORKDIR /app/packages/db
-
-# Run Prisma migrations as the entrypoint
-ENTRYPOINT ["npx", "prisma", "migrate", "deploy"]

packages/db/prisma/migrations/20251124212814_add_emails/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "email" TEXT;

packages/db/prisma/migrations/20251218220346_cascade_delete_channel/migration.sql

@@ -0,0 +1,5 @@
+-- DropForeignKey
+ALTER TABLE "StreamInfo" DROP CONSTRAINT "StreamInfo_channelId_fkey";
+
+-- AddForeignKey
+ALTER TABLE "StreamInfo" ADD CONSTRAINT "StreamInfo_channelId_fkey" FOREIGN KEY ("channelId") REFERENCES "Channel"("id") ON DELETE CASCADE ON UPDATE CASCADE;

packages/db/prisma/migrations/20251218223614_more_stream_key_cascading/migration.sql

@@ -0,0 +1,5 @@
+-- DropForeignKey
+ALTER TABLE "StreamKey" DROP CONSTRAINT "StreamKey_channelId_fkey";
+
+-- AddForeignKey
+ALTER TABLE "StreamKey" ADD CONSTRAINT "StreamKey_channelId_fkey" FOREIGN KEY ("channelId") REFERENCES "Channel"("id") ON DELETE CASCADE ON UPDATE CASCADE;

packages/db/prisma/schema.prisma

@@ -7,7 +7,7 @@
 generator client {
   provider      = "prisma-client-js"
   output        = "../generated/client"
-  binaryTargets = ["native", "linux-musl-openssl-3.0.x"]
+  binaryTargets = ["native", "debian-openssl-3.0.x"]
 }
 
 datasource db {
@@ -19,6 +19,7 @@ datasource db {
 model User {
   id           String  @id @default(cuid())
   slack_id     String
+  email        String?
   pfpUrl       String
   hasOnboarded Boolean @default(false)
 
@@ -76,7 +77,7 @@ model StreamInfo {
   isLive    Boolean
 
   channelId String
-  channel   Channel @relation(fields: [channelId], references: [id])
+  channel   Channel @relation(fields: [channelId], references: [id], onDelete: Cascade)
 
   ownedBy User   @relation(fields: [userId], references: [id])
   userId  String
@@ -108,7 +109,7 @@ model StreamKey {
   key String @unique
 
   channelId String  @unique
-  channel   Channel @relation(fields: [channelId], references: [id])
+  channel   Channel @relation(fields: [channelId], references: [id], onDelete: Cascade)
 }
 
 model BotAccount {

slack-import-emojis/Cargo.lock

@@ -827,7 +827,7 @@ checksum = "04dc19736151f35336d325007ac991178d504a119863a2fcb3758cdb5e52c50d"
 
 [[package]]
 name = "slack-import-emojis"
-version = "0.2.1"
+version = "0.3.0"
 dependencies = [
  "reqwest",
  "serde",

slack-import-emojis/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "slack-import-emojis"
-version = "0.2.1"
+version = "0.3.0"
 edition = "2021"
 
 [dependencies]

slack-import-emojis/src/main.rs

@@ -6,12 +6,12 @@ use std::io::Write;
 use std::env;
 
 #[derive(Debug, Deserialize)]
-struct SlackEmojiResponse {
-  emoji: HashMap<String, String>,
-  #[serde(skip_serializing_if = "Option::is_none")]
-  #[allow(dead_code)]
-  error: Option<String>,
+struct SlackEmojiItem {
+  name: String,
+  #[serde(rename = "imageUrl")]
+  image_url: String,
 }
+
 #[derive(Debug, Deserialize)]
 struct DefaultEmojiResponse {
   emoji: HashMap<String, String>,
@@ -35,41 +35,41 @@ async fn main() {
   let mut slack_emojis = slack_request()
     .await
     .expect("Failed to fetch slack_emojis from Slack API");
-  println!("{:?} slack_emojis fetched", slack_emojis.emoji.len());
+  println!("{:?} slack_emojis fetched", slack_emojis.len());
 
   if args.len() > 1 && args[1] == "default" {
     let default_emojis = default_request()
       .await
       .expect("Failed to fetch default_emojis from GitHub");
     println!("{:?} default_emojis fetched", default_emojis.emoji.len());
-    slack_emojis.emoji.extend(default_emojis.emoji);
+    slack_emojis.extend(default_emojis.emoji);
   }
 
   let mut file = File::create("emojis.json").expect("failed to create file for some reason");
   let json_data =
-    serde_json::to_string(&slack_emojis.emoji).expect("failed to serialize emojis wtf");
+    serde_json::to_string(&slack_emojis).expect("failed to serialize emojis wtf");
   file
     .write_all(json_data.as_bytes())
     .expect("failed to write emojis to file");
   println!("saved :yay:");
 }
 
-async fn slack_request() -> Result<SlackEmojiResponse, Box<dyn std::error::Error>> {
+async fn slack_request() -> Result<HashMap<String, String>, Box<dyn std::error::Error>> {
   let client = reqwest::Client::new();
   let res = client
-    .get("https://slack.com/api/emoji.list")
-    .header(
-      "Authorization",
-      format!(
-        "Bearer {}",
-        std::env::var("SLACK_TOKEN").expect("SLACK_TOKEN not set")
-      ),
-    )
+    .get("https://cachet.dunkirk.sh/emojis")
     .send()
     .await;
 
   match res {
-    Ok(response) => Ok(response.json().await?),
+    Ok(response) => {
+      let items: Vec<SlackEmojiItem> = response.json().await?;
+      let map: HashMap<String, String> = items
+        .into_iter()
+        .map(|item| (item.name, item.image_url))
+        .collect();
+      Ok(map)
+    }
     Err(err) => {
       eprintln!("Error: {:?}", err);
       Err(Box::new(err))

yarn.lock

@@ -1946,10 +1946,10 @@
     "@emnapi/runtime" "^1.3.1"
     "@tybys/wasm-util" "^0.9.0"
 
-"@next/env@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/env/-/env-15.6.0-canary.34.tgz#e97bce92f8918239fce88a688b260c81cc043720"
-  integrity sha512-OpjhOCarzTE7c5GvNGYrpVlPh60seQDwa1Vau76ZDgFx8BLwODL7wpOkgKaWqHepu68zV9EuLQy1IkrU34Vjcw==
+"@next/env@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/env/-/env-16.1.0.tgz#b5398c47619789f190211e90e3e032b3d84a6458"
+  integrity sha512-Dd23XQeFHmhf3KBW76leYVkejHlCdB7erakC2At2apL1N08Bm+dLYNP+nNHh0tzUXfPQcNcXiQyacw0PG4Fcpw==
 
 "@next/eslint-plugin-next@15.1.3":
   version "15.1.3"
@@ -1958,45 +1958,45 @@
   dependencies:
     fast-glob "3.3.1"
 
-"@next/swc-darwin-arm64@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.6.0-canary.34.tgz#553d843b8da5ece93cbd6f5d2f5eb327e9601544"
-  integrity sha512-YAGGiAJyfqISxu+0vTvZO6wNnjHpPDqQ/Km9HuoUgdFa9Gl02qgYenkl0wtLv4ULizpvDP4An2ik1S63JzFasw==
+"@next/swc-darwin-arm64@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.1.0.tgz#b7bded3911f35f585243292f85f63c3ef7d4fd85"
+  integrity sha512-onHq8dl8KjDb8taANQdzs3XmIqQWV3fYdslkGENuvVInFQzZnuBYYOG2HGHqqtvgmEU7xWzhgndXXxnhk4Z3fQ==
 
-"@next/swc-darwin-x64@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-darwin-x64/-/swc-darwin-x64-15.6.0-canary.34.tgz#995ebc272fb8c6b79e565ade0b738b361f173f58"
-  integrity sha512-7Ils05FOT0jLL/zpvobtqlodswfpTe28z4a701ZIUxUcRMb0p3F3aySjd3oc/1ZElQf2buGabxbJZIsoPKNXrw==
+"@next/swc-darwin-x64@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-darwin-x64/-/swc-darwin-x64-16.1.0.tgz#93394a41b9fd368e1d12c3d542bd118b5d6a5ccf"
+  integrity sha512-Am6VJTp8KhLuAH13tPrAoVIXzuComlZlMwGr++o2KDjWiKPe3VwpxYhgV6I4gKls2EnsIMggL4y7GdXyDdJcFA==
 
-"@next/swc-linux-arm64-gnu@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.6.0-canary.34.tgz#dca81392730b3fbab59df6ee7a1a39929c992a05"
-  integrity sha512-MWqankIvInIQlWclHOZwC5FHJ7dx6OFrtpqJCtThabncSy7imkKBTzfL/Bytb8WQw6e85YzNwUzH1PGA8voHrw==
+"@next/swc-linux-arm64-gnu@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.1.0.tgz#e33c4bc206366501c9bf323a9cc8e4b0aaa6ea9b"
+  integrity sha512-fVicfaJT6QfghNyg8JErZ+EMNQ812IS0lmKfbmC01LF1nFBcKfcs4Q75Yy8IqnsCqH/hZwGhqzj3IGVfWV6vpA==
 
-"@next/swc-linux-arm64-musl@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.6.0-canary.34.tgz#2c7bbb7ed2028321772e220e213ce8f399d8d78f"
-  integrity sha512-8Cv+0TS8m3S7n4LBDe+GLn/6GZyutPxuHFaeZouFOgU7uHwXo/CRzRwPh10RoxyobooRoDIovVeA9moKy/JqiQ==
+"@next/swc-linux-arm64-musl@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.1.0.tgz#aeef7cd46a6b69c986dd08a730d40fe8853c629e"
+  integrity sha512-TojQnDRoX7wJWXEEwdfuJtakMDW64Q7NrxQPviUnfYJvAx5/5wcGE+1vZzQ9F17m+SdpFeeXuOr6v3jbyusYMQ==
 
-"@next/swc-linux-x64-gnu@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.6.0-canary.34.tgz#2e1825a9c13d339561262103b6f6109bde605766"
-  integrity sha512-TJ/cCYk/aXp7Gxz6WtmuiklTpojfhikqEFrZRzNt4vLB+s1/6BdOx7FgIp2Y6m0Xjxqqq+i+3DI094L392ssFw==
+"@next/swc-linux-x64-gnu@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.1.0.tgz#6882bc63ef3566d0f7596ba7945f58f378dbb1eb"
+  integrity sha512-quhNFVySW4QwXiZkZ34SbfzNBm27vLrxZ2HwTfFFO1BBP0OY1+pI0nbyewKeq1FriqU+LZrob/cm26lwsiAi8Q==
 
-"@next/swc-linux-x64-musl@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-15.6.0-canary.34.tgz#a2a2a04eb3dd43b270e2c712e519d96cb550d39b"
-  integrity sha512-+zpMXFVGspAYfTR30v6EM0pOPaTjBSwwDbcRg2hOsI1PdFGVLwvljdDw2jZrS9JwyaIF7btCfTUi4w636G66TQ==
+"@next/swc-linux-x64-musl@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.1.0.tgz#b1b83cc42f8bf32cbc7ba0e97ccf59a4002cf1a2"
+  integrity sha512-6JW0z2FZUK5iOVhUIWqE4RblAhUj1EwhZ/MwteGb//SpFTOHydnhbp3868gxalwea+mbOLWO6xgxj9wA9wNvNw==
 
-"@next/swc-win32-arm64-msvc@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.6.0-canary.34.tgz#80f9cf75616f7d3dae54839c0795a03a0cd84100"
-  integrity sha512-f40lriU/Zqy5v5QqmdTaCZywCeH/sg5Q5gE1rTFpJXfSf3O7uDAfh960A//Yatl/ADeNGNvY1BdA/NXdKntEsQ==
+"@next/swc-win32-arm64-msvc@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.1.0.tgz#8e4dccc755fc285d0455d4fb14e9e7d551d2357c"
+  integrity sha512-+DK/akkAvvXn5RdYN84IOmLkSy87SCmpofJPdB8vbLmf01BzntPBSYXnMvnEEv/Vcf3HYJwt24QZ/s6sWAwOMQ==
 
-"@next/swc-win32-x64-msvc@15.6.0-canary.34":
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.6.0-canary.34.tgz#bc1eb485053f3fe869dcc7c2bacf01c8348a9a75"
-  integrity sha512-2V5q/qv9s70IQjhzaRZG6X22qdI67gBknBeNAD6/TR7JB2dCpPjsUXt8JpR+LiUueth26GR8Hbn+w68S3hNHug==
+"@next/swc-win32-x64-msvc@16.1.0":
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.1.0.tgz#288b4803e56e6b15a0b203e39b7ed3b8dd628755"
+  integrity sha512-Tr0j94MphimCCks+1rtYPzQFK+faJuhHWCegU9S9gDlgyOk8Y3kPmO64UcjyzZAlligeBtYZ/2bEyrKq0d2wqQ==
 
 "@node-rs/argon2-android-arm-eabi@2.0.2":
   version "2.0.2"
@@ -2586,7 +2586,7 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.1.3.tgz#e2dbc13bdc5e4168f4334f75832d7bdd3e2de5ba"
   integrity sha512-JTF99U/6XIjCBo0wqkU5sK10glYe27MRRsfwoiq5zzOEZLHU3A3KCMa5X/azekYRCJ0HlwI0crAXS/5dEHTzDg==
 
-"@radix-ui/react-alert-dialog@^1.1.13":
+"@radix-ui/react-alert-dialog@^1.1.13", "@radix-ui/react-alert-dialog@^1.1.15":
   version "1.1.15"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-alert-dialog/-/react-alert-dialog-1.1.15.tgz#fa751d0fdd9aa2a90961c9901dba18e638dd4b41"
   integrity sha512-oTVLkEw5GpdRe29BqJ0LSDFWI3qu0vR1M0mUkOQWDIUnY/QIkLpgDMWuKxP94c2NAC2LGcgVhG1ImF3jkZ5wXw==
@@ -3136,7 +3136,7 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-compose-refs" "1.0.1"
 
-"@radix-ui/react-slot@1.1.2", "@radix-ui/react-slot@^1.1.1":
+"@radix-ui/react-slot@1.1.2":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.1.2.tgz#daffff7b2bfe99ade63b5168407680b93c00e1c6"
   integrity sha512-YAKxaiGsSQJ38VzKH86/BPRC4rh+b1Jpa+JneA5LRE7skmLPNAyeG8kPJj/oo4STLvlrs8vkf/iYyc3A5stYCQ==
@@ -3150,6 +3150,13 @@
   dependencies:
     "@radix-ui/react-compose-refs" "1.1.2"
 
+"@radix-ui/react-slot@^1.2.4":
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.2.4.tgz#63c0ba05fdf90cc49076b94029c852d7bac1fb83"
+  integrity sha512-Jl+bCv8HxKnlTLVrcDE8zTMJ09R9/ukw4qBs/oZClOfoQk/cOTbDn+NceXfV7j09YPVQUryJPHurafcSg6EVKA==
+  dependencies:
+    "@radix-ui/react-compose-refs" "1.1.2"
+
 "@radix-ui/react-switch@^1.1.3":
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-switch/-/react-switch-1.1.3.tgz#cb6386909d1d3f65a2b81a3b15da8c91d18f49b0"
@@ -5575,6 +5582,11 @@ base64-js@^1.1.2, base64-js@^1.3.0, base64-js@^1.3.1:
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
   integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
 
+baseline-browser-mapping@^2.8.3:
+  version "2.9.11"
+  resolved "https://registry.yarnpkg.com/baseline-browser-mapping/-/baseline-browser-mapping-2.9.11.tgz#53724708c8db5f97206517ecfe362dbe5181deea"
+  integrity sha512-Sg0xJUNDU1sJNGdfGWhVHX0kkZ+HWcvmVymJbj6NSgZZmW/8S9Y2HQ5euytnIgakgxN6papOAWiwDo1ctFDcoQ==
+
 bcp-47-match@^2.0.0:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/bcp-47-match/-/bcp-47-match-2.0.3.tgz#603226f6e5d3914a581408be33b28a53144b09d0"
@@ -10024,25 +10036,26 @@ next-themes@^0.4.4:
   resolved "https://registry.yarnpkg.com/next-themes/-/next-themes-0.4.6.tgz#8d7e92d03b8fea6582892a50a928c9b23502e8b6"
   integrity sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA==
 
-next@^15.6.0-canary.34:
-  version "15.6.0-canary.34"
-  resolved "https://registry.yarnpkg.com/next/-/next-15.6.0-canary.34.tgz#37dfec95a7cdb6edd87d3559667ec28674d55576"
-  integrity sha512-H2lVHtMc8TSMvQe3zu66AlLGYM3Jn22KW+TpIFIIQaplZZQyyPN8hcq76fO/iIIb0KI5902rHesmoPxxlFAWYA==
+next@^16.1.0:
+  version "16.1.0"
+  resolved "https://registry.yarnpkg.com/next/-/next-16.1.0.tgz#af5941f1c313655ace98b60f26db8de5a2692c42"
+  integrity sha512-Y+KbmDbefYtHDDQKLNrmzE/YYzG2msqo2VXhzh5yrJ54tx/6TmGdkR5+kP9ma7i7LwZpZMfoY3m/AoPPPKxtVw==
   dependencies:
-    "@next/env" "15.6.0-canary.34"
+    "@next/env" "16.1.0"
     "@swc/helpers" "0.5.15"
+    baseline-browser-mapping "^2.8.3"
     caniuse-lite "^1.0.30001579"
     postcss "8.4.31"
     styled-jsx "5.1.6"
   optionalDependencies:
-    "@next/swc-darwin-arm64" "15.6.0-canary.34"
-    "@next/swc-darwin-x64" "15.6.0-canary.34"
-    "@next/swc-linux-arm64-gnu" "15.6.0-canary.34"
-    "@next/swc-linux-arm64-musl" "15.6.0-canary.34"
-    "@next/swc-linux-x64-gnu" "15.6.0-canary.34"
-    "@next/swc-linux-x64-musl" "15.6.0-canary.34"
-    "@next/swc-win32-arm64-msvc" "15.6.0-canary.34"
-    "@next/swc-win32-x64-msvc" "15.6.0-canary.34"
+    "@next/swc-darwin-arm64" "16.1.0"
+    "@next/swc-darwin-x64" "16.1.0"
+    "@next/swc-linux-arm64-gnu" "16.1.0"
+    "@next/swc-linux-arm64-musl" "16.1.0"
+    "@next/swc-linux-x64-gnu" "16.1.0"
+    "@next/swc-linux-x64-musl" "16.1.0"
+    "@next/swc-win32-arm64-msvc" "16.1.0"
+    "@next/swc-win32-x64-msvc" "16.1.0"
     sharp "^0.34.4"
 
 nlcst-to-string@^4.0.0:
@@ -10931,12 +10944,12 @@ raw-body@^3.0.0:
     iconv-lite "0.6.3"
     unpipe "1.0.0"
 
-react-dom@19:
-  version "19.0.0"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-19.0.0.tgz#43446f1f01c65a4cd7f7588083e686a6726cfb57"
-  integrity sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==
+react-dom@^19.2.3:
+  version "19.2.3"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-19.2.3.tgz#f0b61d7e5c4a86773889fcc1853af3ed5f215b17"
+  integrity sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg==
   dependencies:
-    scheduler "^0.25.0"
+    scheduler "^0.27.0"
 
 react-hook-form@^7.54.2:
   version "7.54.2"
@@ -10986,10 +10999,10 @@ react-style-singleton@^2.2.1, react-style-singleton@^2.2.2, react-style-singleto
     get-nonce "^1.0.0"
     tslib "^2.0.0"
 
-react@19:
-  version "19.0.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-19.0.0.tgz#6e1969251b9f108870aa4bff37a0ce9ddfaaabdd"
-  integrity sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==
+react@^19.2.3:
+  version "19.2.3"
+  resolved "https://registry.yarnpkg.com/react/-/react-19.2.3.tgz#d83e5e8e7a258cf6b4fe28640515f99b87cd19b8"
+  integrity sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==
 
 read-cache@^1.0.0:
   version "1.0.0"
@@ -11610,10 +11623,10 @@ sax@^1.2.4:
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.4.1.tgz#44cc8988377f126304d3b3fc1010c733b929ef0f"
   integrity sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==
 
-scheduler@^0.25.0:
-  version "0.25.0"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.25.0.tgz#336cd9768e8cceebf52d3c80e3dcf5de23e7e015"
-  integrity sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==
+scheduler@^0.27.0:
+  version "0.27.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.27.0.tgz#0c4ef82d67d1e5c1e359e8fc76d3a87f045fe5bd"
+  integrity sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==
 
 semver@^6.3.1:
   version "6.3.1"