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('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]);