comments and descriptions

webui/src/spectate/SpectatorApp/SpectatorAppRoot.jsx

@@ -1,4 +1,6 @@
-// Spectator app compatibility root.
+// Spectator App Root
+// Purpose: Defines the Spectator App Root module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import SpectatorContent from './SpectatorContent.jsx';
 
 export default function SpectatorAppRoot() {

webui/src/spectate/SpectatorApp/SpectatorContent.jsx

@@ -1,4 +1,6 @@
-// Main spectator screen layout and feed wiring.
+// Spectator Content
+// Purpose: Defines the Spectator Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useSession } from '../../context/SessionContext.jsx';
 import { useTelemetryFrames } from '../../context/TelemetryContext.jsx';
 import { useVideoRequests } from '../../hooks/useVideoRequests.js';

webui/src/spectate/SpectatorApp/components/LogsRow.jsx

@@ -1,4 +1,6 @@
-// Log panel wrapper row for spectator layout.
+// Logs Row
+// Purpose: Defines the Logs Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import LogPanel from '../../../components/LogPanel/index.jsx';
 
 export default function LogsRow({ className = '' }) {

webui/src/spectate/SpectatorApp/components/RoverRow.jsx

@@ -1,4 +1,6 @@
-// Rover grid row for spectator view.
+// Rover Row
+// Purpose: Defines the Rover Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import RoverSpectatorCard from './RoverSpectatorCard.jsx';
 
 export default function RoverRow({ roster, frames, videoSources, snapshotFeeds, audioSources, session, canSpectateVideo }) {

webui/src/spectate/SpectatorApp/components/RoverSpectatorCard.jsx

@@ -1,4 +1,6 @@
-// Single rover spectator card containing live/snapshot tile and HUD.
+// Rover Spectator Card
+// Purpose: Defines the Rover Spectator Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import VideoTile from '../../../components/VideoTile/index.jsx';
 import { formatDriverLabel } from '../utils.js';
 

webui/src/spectate/SpectatorApp/components/SecondaryRow.jsx

@@ -1,4 +1,6 @@
-// Secondary panel row showing room cameras.
+// Secondary Row
+// Purpose: Defines the Secondary Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import RoomCameraPanel from '../../../components/RoomCameraPanel/index.jsx';
 
 export default function SecondaryRow() {

webui/src/spectate/SpectatorApp/hooks/usePortraitLayout.js

@@ -1,4 +1,6 @@
-// Detect portrait-oriented viewport layout mode for spectator UI.
+// use Portrait Layout
+// Purpose: Defines the use Portrait Layout module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useState } from 'react';
 
 export default function usePortraitLayout() {

webui/src/spectate/SpectatorApp/utils.js

@@ -1,4 +1,6 @@
-// Spectator app display formatting helpers.
+// utils
+// Purpose: Defines the utils module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function formatDriverLabel({ roverId, session }) {
   const activeDriverId = session?.activeDrivers?.[roverId] || null;
   const user = (session?.users || []).find((entry) => entry.socketId === activeDriverId);