Fix issue #72 follow-ups and IPTV source handling

Author: KuekHaoYang

app/api/iptv/route.ts

@@ -9,15 +9,28 @@ export const runtime = 'edge';
 
 export async function GET(request: NextRequest) {
   const url = request.nextUrl.searchParams.get('url');
+  const customUa = request.nextUrl.searchParams.get('ua');
+  const customReferer = request.nextUrl.searchParams.get('referer');
 
   if (!url) {
     return NextResponse.json({ error: 'Missing url parameter' }, { status: 400 });
   }
 
   try {
+    const parsedUrl = new URL(url);
+    let refererOrigin = `${parsedUrl.protocol}//${parsedUrl.host}`;
+    if (customReferer) {
+      try {
+        refererOrigin = new URL(customReferer).origin;
+      } catch {
+        refererOrigin = `${parsedUrl.protocol}//${parsedUrl.host}`;
+      }
+    }
     const response = await fetch(url, {
       headers: {
-        'User-Agent': 'Mozilla/5.0 (compatible; KVideo/1.0)',
+        'User-Agent': customUa || 'Mozilla/5.0 (compatible; KVideo/1.0)',
+        ...(customReferer ? { 'Referer': customReferer } : {}),
+        'Origin': refererOrigin,
       },
     });
 

app/iptv/page.tsx

@@ -4,7 +4,7 @@
  * IPTV Page - Live TV channel viewer with M3U source management
  */
 
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useMemo } from 'react';
 import { useIPTVStore } from '@/lib/store/iptv-store';
 import { IPTVSourceManager } from '@/components/iptv/IPTVSourceManager';
 import { IPTVChannelGrid } from '@/components/iptv/IPTVChannelGrid';
@@ -15,12 +15,35 @@ import Link from 'next/link';
 import type { M3UChannel } from '@/lib/utils/m3u-parser';
 
 export default function IPTVPage() {
-  const { sources, cachedChannels, cachedGroups, cachedChannelsBySource, refreshSources, isLoading, lastRefreshed } = useIPTVStore();
+  const { sources, cachedChannels, cachedChannelsBySource, refreshSources, isLoading, lastRefreshed } = useIPTVStore();
   const [activeChannel, setActiveChannel] = useState<M3UChannel | null>(null);
   const [showManager, setShowManager] = useState(false);
 
-  const canManageSources = hasPermission('source_management');
+  const canManageSources = hasPermission('iptv_source_management');
   const canAccessIPTV = hasPermission('iptv_access');
+  const canUseBuiltinSources = hasPermission('iptv_builtin_sources');
+  const visibleSources = useMemo(
+    () => sources.filter((source) => canUseBuiltinSources || source.kind !== 'builtin'),
+    [sources, canUseBuiltinSources]
+  );
+  const visibleSourceIds = useMemo(() => new Set(visibleSources.map((source) => source.id)), [visibleSources]);
+  const visibleChannels = useMemo(
+    () => cachedChannels.filter((channel) => !channel.sourceId || visibleSourceIds.has(channel.sourceId)),
+    [cachedChannels, visibleSourceIds]
+  );
+  const visibleGroups = useMemo(
+    () => Array.from(new Set(visibleChannels.map((channel) => channel.group).filter(Boolean))).sort() as string[],
+    [visibleChannels]
+  );
+  const visibleChannelsBySource = useMemo(
+    () =>
+      Object.fromEntries(
+        visibleSources
+          .map((source) => [source.id, cachedChannelsBySource[source.id]])
+          .filter(([, data]) => !!data)
+      ),
+    [visibleSources, cachedChannelsBySource]
+  );
 
   // If auth is configured and user doesn't have iptv_access, show access denied
   if (!canAccessIPTV && getSession()) {
@@ -65,7 +88,7 @@ export default function IPTVPage() {
                     直播
                   </h1>
                   <p className="text-sm text-[var(--text-color-secondary)]">
-                    {cachedChannels.length > 0 ? `${cachedChannels.length} 个频道` : 'IPTV 直播频道'}
+                    {visibleChannels.length > 0 ? `${visibleChannels.length} 个频道` : 'IPTV 直播频道'}
                   </p>
                 </div>
               </div>
@@ -101,12 +124,12 @@ export default function IPTVPage() {
           {!isLoading && (
             <div className="bg-[var(--glass-bg)] border border-[var(--glass-border)] rounded-[var(--radius-2xl)] shadow-[var(--shadow-sm)] p-6">
               <IPTVChannelGrid
-                channels={cachedChannels}
-                groups={cachedGroups}
+                channels={visibleChannels}
+                groups={visibleGroups}
                 onSelect={setActiveChannel}
                 activeChannel={activeChannel}
-                channelsBySource={cachedChannelsBySource}
-                sources={sources}
+                channelsBySource={visibleChannelsBySource}
+                sources={visibleSources}
               />
             </div>
           )}
@@ -117,10 +140,10 @@ export default function IPTVPage() {
           <IPTVPlayer
             channel={activeChannel}
             onClose={() => setActiveChannel(null)}
-            channels={cachedChannels}
+            channels={visibleChannels}
             onChannelChange={setActiveChannel}
-            channelsBySource={cachedChannelsBySource}
-            sources={sources}
+            channelsBySource={visibleChannelsBySource}
+            sources={visibleSources}
           />
         )}
       </div>

app/player/page.tsx

@@ -448,6 +448,9 @@ function PlayerContent() {
                     poster={videoData.vod_pic}
                     type={videoData.type_name}
                     year={videoData.vod_year}
+                    sourceMap={Object.fromEntries(
+                      (groupedSources.length > 0 ? groupedSources : [{ id: videoId, source }]).map((item) => [item.source, item.id])
+                    )}
                     size={20}
                     isPremium={isPremium}
                   />

components/PasswordGate.tsx

@@ -13,7 +13,6 @@ import { Lock } from 'lucide-react';
  */
 function syncIPTVSources(rawValue: string) {
     const iptvStore = useIPTVStore.getState();
-    const existingUrls = new Set(iptvStore.sources.map(s => s.url));
 
     let entries: { name: string; url: string }[] = [];
 
@@ -34,12 +33,7 @@ function syncIPTVSources(rawValue: string) {
         }
     }
 
-    // Add new sources that don't already exist
-    for (const entry of entries) {
-        if (!existingUrls.has(entry.url)) {
-            iptvStore.addSource(entry.name || '直播源', entry.url);
-        }
-    }
+    iptvStore.syncBuiltinSources(entries);
 }
 
 /**

components/favorites/FavoriteButton.tsx

@@ -18,6 +18,7 @@ interface FavoriteButtonProps {
     type?: string;
     year?: string;
     remarks?: string;
+    sourceMap?: Record<string, string | number>;
     className?: string;
     size?: number;
     showTooltip?: boolean;
@@ -33,6 +34,7 @@ export const FavoriteButton = memo<FavoriteButtonProps>(({
     type,
     year,
     remarks,
+    sourceMap,
     className = '',
     size = 20,
     showTooltip = true,
@@ -61,11 +63,12 @@ export const FavoriteButton = memo<FavoriteButtonProps>(({
             type,
             year,
             remarks,
+            sourceMap,
         });
         setIsFav(newState);
 
         setTimeout(() => setIsAnimating(false), 300);
-    }, [videoId, source, title, poster, sourceName, type, year, remarks, toggleFavorite]);
+    }, [videoId, source, title, poster, sourceName, type, year, remarks, sourceMap, toggleFavorite]);
 
     return (
         <button

components/favorites/FavoritesItem.tsx

@@ -5,6 +5,8 @@
 
 import { Icons } from '@/components/ui/Icon';
 import { formatDate } from '@/lib/utils/format-utils';
+import { getSourceName } from '@/lib/utils/source-names';
+import { storeGroupedSources } from '@/lib/utils/grouped-sources-cache';
 import type { FavoriteItem } from '@/lib/types';
 
 interface FavoritesItemProps {
@@ -20,6 +22,18 @@ export function FavoritesItem({ item, onRemove, isPremium = false }: FavoritesIt
             source: item.source,
             title: item.title,
         });
+        if (item.sourceMap && Object.keys(item.sourceMap).length > 1) {
+            const groupData = Object.entries(item.sourceMap).map(([sourceName, videoId]) => ({
+                id: videoId,
+                source: sourceName,
+                sourceName: getSourceName(sourceName),
+                pic: item.poster,
+            }));
+            const cacheKey = storeGroupedSources(groupData);
+            if (cacheKey) {
+                params.set('gs', cacheKey);
+            }
+        }
         if (isPremium) {
             params.set('premium', '1');
         }

components/history/HistoryItem.tsx

@@ -32,6 +32,7 @@ export function HistoryItem({ item, onRemove, isPremium = false }: HistoryItemPr
         id: videoId,
         source: sourceName,
         sourceName: getSourceName(sourceName),
+        pic: item.poster,
       }));
       const cacheKey = storeGroupedSources(groupData);
       if (cacheKey) {
@@ -101,6 +102,7 @@ export function HistoryItem({ item, onRemove, isPremium = false }: HistoryItemPr
               title={item.title}
               poster={item.poster}
               remarks={episodeText}
+              sourceMap={item.sourceMap}
               size={14}
               className="!p-1.5 !bg-transparent !border-0 !shadow-none hover:!bg-[var(--glass-bg)]"
               showTooltip={false}