From f8916d2cc3b073ad5453607baaa4d7486ca2ce1f Mon Sep 17 00:00:00 2001
From: jlightner <jlightner@users.noreply.github.com>
Date: Sat, 4 Apr 2026 10:03:53 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20ChannelDetail=20now=20initializes=20vie?=
 =?UTF-8?q?w=20mode=20from=20the=20channel's=20platfo=E2=80=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- "src/frontend/src/pages/ChannelDetail.tsx"

GSD-Task: S04/T03
---
 src/frontend/src/pages/ChannelDetail.tsx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/frontend/src/pages/ChannelDetail.tsx b/src/frontend/src/pages/ChannelDetail.tsx
index a016791..d8d36da 100644
--- a/src/frontend/src/pages/ChannelDetail.tsx
+++ b/src/frontend/src/pages/ChannelDetail.tsx
@@ -30,6 +30,7 @@ import { useChannel, useUpdateChannel, useDeleteChannel, useScanChannel, useCanc
 import { useChannelContentPaginated, useContentTypeCounts, useDownloadContent, useToggleMonitored, useBulkMonitored, useCollectMonitored, useUpdateContentRating, type ChannelContentFilters } from '../api/hooks/useContent';
 import { useChannelPlaylists, useRefreshPlaylists } from '../api/hooks/usePlaylists';
 import { useFormatProfiles } from '../api/hooks/useFormatProfiles';
+import { usePlatformSetting } from '../api/hooks/usePlatformSettings';
 import { Table, type Column } from '../components/Table';
 import { PlatformBadge } from '../components/PlatformBadge';
 import { StatusBadge } from '../components/StatusBadge';
@@ -82,6 +83,7 @@ export function ChannelDetail() {
   const { data: formatProfiles } = useFormatProfiles();
   const { data: playlistData } = useChannelPlaylists(channelId);
   const { data: contentTypeCounts } = useContentTypeCounts(channelId);
+  const { data: platformSettings } = usePlatformSetting(channel?.platform ?? null);
 
   // ── Content type tab (URL-driven) ──
   const activeTab = searchParams.get('tab') ?? 'all';
@@ -108,6 +110,7 @@ export function ChannelDetail() {
   const [sortDirection, setSortDirection] = usePersistedState<'asc' | 'desc'>('tubearr-sort-dir', 'asc');
   const [groupBy, setGroupBy] = usePersistedState<GroupByKey>('tubearr-group-by', 'none');
   const [viewMode, setViewMode] = usePersistedState<'table' | 'card' | 'list'>('tubearr-content-view', 'table');
+  const viewModeOverriddenRef = useRef(false);
 
   // Derive contentType filter from active tab
   const contentTypeFilter = activeTab === 'all' ? '' : activeTab;
@@ -176,6 +179,18 @@ export function ChannelDetail() {
     return () => observer.disconnect();
   }, []);
 
+  // Reset view-mode override when navigating to a different channel
+  useEffect(() => {
+    viewModeOverriddenRef.current = false;
+  }, [channelId]);
+
+  // Apply platform default view when settings load (only if user hasn't manually switched)
+  useEffect(() => {
+    if (!platformSettings?.defaultView || viewModeOverriddenRef.current) return;
+    const mapped = platformSettings.defaultView === 'poster' ? 'card' : platformSettings.defaultView;
+    setViewMode(mapped);
+  }, [platformSettings?.defaultView, setViewMode]);
+
   // Sync local check interval from channel data
   useEffect(() => {
     if (channel?.checkInterval != null) {
@@ -344,6 +359,7 @@ export function ChannelDetail() {
   }, [groupBy]);
 
   const handleSetViewMode = useCallback((mode: 'table' | 'card' | 'list') => {
+    viewModeOverriddenRef.current = true;
     setViewMode(mode);
   }, [setViewMode]);