Implement team name text overlays with refactored group structure

- Add createTextSource function with automatic OBS text input detection
- Implement createStreamGroup to create groups within team scenes instead of separate scenes
- Add team name text overlays positioned at top-left of each stream
- Refactor stream switching to use stream group names for cleaner organization
- Update setActive API to write stream group names to files
- Fix getActive API to return correct screen position data
- Improve team UUID assignment when adding streams
- Remove manage streams section from home page for cleaner UI
- Add vertical spacing to streams list to match teams page
- Support dynamic text input kinds (text_ft2_source_v2, text_gdiplus, etc.)

This creates a much cleaner OBS structure with 10 team scenes containing grouped
stream sources rather than 200+ individual stream scenes, while adding team
name text overlays for better stream identification.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

app/api/addStream/route.ts

@@ -1,6 +1,6 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { getDatabase } from '../../../lib/database';
-import { connectToOBS, getOBSClient, disconnectFromOBS, addSourceToSwitcher, createGroupIfNotExists, addSourceToGroup } from '../../../lib/obsClient';
+import { connectToOBS, getOBSClient, disconnectFromOBS, addSourceToSwitcher, createGroupIfNotExists, addSourceToGroup, createStreamGroup } from '../../../lib/obsClient';
 import { open } from 'sqlite';
 import sqlite3 from 'sqlite3';
 import path from 'path';
@@ -44,7 +44,7 @@ async function fetchTeamInfo(teamId: number) {
     });
 
     const teamInfo = await db.get(
-      `SELECT team_name, group_name FROM ${teamsTableName} WHERE team_id = ?`,
+      `SELECT team_name, group_name, group_uuid FROM ${teamsTableName} WHERE team_id = ?`,
       [teamId]
     );
 
@@ -130,16 +130,53 @@ export async function POST(request: NextRequest) {
     const sourceExists = inputs.some((input: OBSInput) => input.inputName === obs_source_name);
 
     if (!sourceExists) {
-      // Create/ensure group exists and add source to it
-      await createGroupIfNotExists(groupName);
-      await addSourceToGroup(groupName, obs_source_name, url);
+      // Create stream group with text overlay
+      const result = await createStreamGroup(groupName, name, teamInfo.team_name, url);
+      
+      // Update team with group UUID if not set
+      if (!teamInfo.group_uuid) {
+        const FILE_DIRECTORY = path.resolve(process.env.FILE_DIRECTORY || './files');
+        const dbPath = path.join(FILE_DIRECTORY, 'sources.db');
+        const db = await open({
+          filename: dbPath,
+          driver: sqlite3.Database,
+        });
+
+        const teamsTableName = getTableName(BASE_TABLE_NAMES.TEAMS, {
+          year: 2025,
+          season: 'summer',
+          suffix: 'sat'
+        });
+
+        try {
+          // Get the scene UUID for the group
+          const obsClient = await getOBSClient();
+          const { scenes } = await obsClient.call('GetSceneList');
+          const scene = scenes.find((s: any) => s.sceneName === groupName);
+          
+          if (scene) {
+            await db.run(
+              `UPDATE ${teamsTableName} SET group_name = ?, group_uuid = ? WHERE team_id = ?`,
+              [groupName, scene.sceneUuid, team_id]
+            );
+            console.log(`Updated team ${team_id} with group UUID: ${scene.sceneUuid}`);
+          } else {
+            console.log(`Scene "${groupName}" not found in OBS`);
+          }
+        } catch (error) {
+          console.error('Error updating team group UUID:', error);
+        } finally {
+          await db.close();
+        }
+      }
 
       console.log(`OBS source "${obs_source_name}" created.`);
 
       for (const screen of screens) {
         try {
+          const streamGroupName = `${name.toLowerCase().replace(/\s+/g, '_')}_stream`;
           await addSourceToSwitcher(screen, [
-            { hidden: false, selected: false, value: obs_source_name },
+            { hidden: false, selected: false, value: streamGroupName },
           ]);
         } catch (error) {
         if (error instanceof Error) {

app/api/getActive/route.ts

@@ -47,8 +47,8 @@ export async function GET() {
         const chicken = fs.existsSync(chickenPath) ? fs.readFileSync(chickenPath, 'utf-8') : null;
 
         // For SaT
-        // return NextResponse.json({ large, left, right, topLeft, topRight, bottomLeft, bottomRight }, {status: 201})
-        return NextResponse.json({ tank, tree, kitty, chicken }, {status: 201})
+        return NextResponse.json({ large, left, right, topLeft, topRight, bottomLeft, bottomRight }, {status: 201})
+        // return NextResponse.json({ tank, tree, kitty, chicken }, {status: 201})
       } catch (error) {
         console.error('Error reading active sources:', error);
         return NextResponse.json({ error: 'Failed to read active sources' }, {status: 500});

app/api/setActive/route.ts

@@ -5,6 +5,7 @@ import { FILE_DIRECTORY } from '../../../config';
 import { getDatabase } from '../../../lib/database';
 import { Stream } from '@/types';
 import { validateScreenInput } from '../../../lib/security';
+import { TABLE_NAMES } from '../../../lib/constants';
 
 export async function POST(request: NextRequest) {
   // Parse and validate request body
@@ -27,7 +28,7 @@ export async function POST(request: NextRequest) {
     try {
       const db = await getDatabase();
       const stream: Stream | undefined = await db.get<Stream>(
-        'SELECT * FROM streams_2025_spring_adr WHERE id = ?',
+        `SELECT * FROM ${TABLE_NAMES.STREAMS} WHERE id = ?`,
         [id]
       );
 
@@ -37,7 +38,9 @@ export async function POST(request: NextRequest) {
         return NextResponse.json({ error: 'Stream not found' }, { status: 400 });
       }
 
-      fs.writeFileSync(filePath, stream.obs_source_name);
+      // Use stream group name instead of individual obs_source_name
+      const streamGroupName = `${stream.name.toLowerCase().replace(/\s+/g, '_')}_stream`;
+      fs.writeFileSync(filePath, streamGroupName);
       return NextResponse.json({ message: `${screen} updated successfully.` }, { status: 200 });
     } catch (error) {
       console.error('Error updating active source:', error);

app/api/teams/route.ts

@@ -8,11 +8,12 @@ import {
   createDatabaseError,
   parseRequestBody 
 } from '@/lib/apiHelpers';
+import { createGroupIfNotExists, createTextSource } from '@/lib/obsClient';
 
 // Validation for team creation
 function validateTeamInput(data: unknown): { 
   valid: boolean; 
-  data?: { team_name: string }; 
+  data?: { team_name: string; create_obs_group?: boolean }; 
   errors?: Record<string, string> 
 } {
   const errors: Record<string, string> = {};
@@ -22,7 +23,7 @@ function validateTeamInput(data: unknown): {
     return { valid: false, errors };
   }
   
-  const { team_name } = data as { team_name?: unknown };
+  const { team_name, create_obs_group } = data as { team_name?: unknown; create_obs_group?: unknown };
   
   if (!team_name || typeof team_name !== 'string') {
     errors.team_name = 'Team name is required and must be a string';
@@ -38,7 +39,10 @@ function validateTeamInput(data: unknown): {
   
   return { 
     valid: true, 
-    data: { team_name: (team_name as string).trim() }
+    data: { 
+      team_name: (team_name as string).trim(),
+      create_obs_group: create_obs_group === true
+    }
   };
 }
 
@@ -60,7 +64,7 @@ export const POST = withErrorHandling(async (request: Request) => {
     return bodyResult.response;
   }
   
-  const { team_name } = bodyResult.data;
+  const { team_name, create_obs_group } = bodyResult.data;
   
   try {
     const db = await getDatabase();
@@ -78,16 +82,37 @@ export const POST = withErrorHandling(async (request: Request) => {
       );
     }
     
+    let groupName: string | null = null;
+    let groupUuid: string | null = null;
+    
+    // Create OBS group and text source if requested
+    if (create_obs_group) {
+      try {
+        const obsResult = await createGroupIfNotExists(team_name);
+        groupName = team_name;
+        groupUuid = obsResult.sceneUuid;
+        
+        // Create text source for the team
+        const textSourceName = team_name.toLowerCase().replace(/\s+/g, '_') + '_text';
+        await createTextSource(team_name, textSourceName, team_name);
+        
+        console.log(`OBS group and text source created for team "${team_name}"`);
+      } catch (obsError) {
+        console.error('Error creating OBS group:', obsError);
+        // Continue with team creation even if OBS fails
+      }
+    }
+    
     const result = await db.run(
-      `INSERT INTO ${TABLE_NAMES.TEAMS} (team_name) VALUES (?)`,
-      [team_name]
+      `INSERT INTO ${TABLE_NAMES.TEAMS} (team_name, group_name, group_uuid) VALUES (?, ?, ?)`,
+      [team_name, groupName, groupUuid]
     );
     
     const newTeam: Team = {
       team_id: result.lastID!,
       team_name: team_name,
-      group_name: null,
-      group_uuid: null
+      group_name: groupName,
+      group_uuid: groupUuid
     };
     
     return createSuccessResponse(newTeam, 201);