import React, { useState } from 'react';
import { Tv, Link } from 'lucide-react';
import VideoPlayer from './components/VideoPlayer';
import ChannelList from './components/ChannelList';
import { parseM3U } from './utils/m3uParser';
interface Channel {
name: string;
url: string;
}
function App() {
const [m3uUrl, setM3uUrl] = useState('');
const [channels, setChannels] = useState([]);
const [selectedChannel, setSelectedChannel] = useState();
const [loading, setLoading] = useState(false);
const [error, setError] = useState('');
const handleLoadPlaylist = async (e: React.FormEvent) => {
e.preventDefault();
setLoading(true);
setError('');
try {
const parsedChannels = await parseM3U(m3uUrl);
if (parsedChannels.length === 0) {
throw new Error('No channels found in the playlist');
}
setChannels(parsedChannels);
setSelectedChannel(undefined);
} catch (err) {
setError('Failed to load playlist. Please check the URL and try again.');
} finally {
setLoading(false);
}
};
return (
);
}
export default App;
{/* Header */}
{/* URL Input Form */}
{/* Main Content */}
{channels.length > 0 && (
M3U Stream Player
{/* Channel List */}
{/* Video Player */}
)}
{selectedChannel ? (
) : (
)}
{selectedChannel.name}
No Channel Selected
Select a channel from the list to start watching
Comments
Post a Comment
Please when you post a comment on our website respect the noble words style