Update video viewing to navigate directly to video pages

Modify `NetflixGrid` and `VideoGrid` to navigate to individual video pages instead of opening modals. Remove debug logs and styling from `VideoPage` component, and update recommended videos display.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/izllXJt
This commit is contained in:
sebastjanartic 2025-08-30 20:25:04 +00:00
parent 90c50cc1da
commit 357ef9c50e
3 changed files with 9 additions and 19 deletions

View File

@ -20,8 +20,8 @@ export default function NetflixGrid({ videos, isLoading }: NetflixGridProps) {
const [isModalOpen, setIsModalOpen] = useState(false);
const handleVideoClick = (video: Video) => {
setSelectedVideo(video);
setIsModalOpen(true);
// Navigate to individual video page instead of modal
window.location.href = `/video/${video.id}`;
};
const handleCloseModal = () => {

View File

@ -18,8 +18,8 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
const [isModalOpen, setIsModalOpen] = useState(false);
const handleVideoClick = (video: Video) => {
setSelectedVideo(video);
setIsModalOpen(true);
// Navigate to individual video page instead of modal
window.location.href = `/video/${video.id}`;
};
const handleCloseModal = () => {

View File

@ -70,13 +70,6 @@ export default function VideoPage() {
const recommendedVideos = recommendedResponse?.videos?.filter(v => v.id !== videoId) || [];
// Debug: Preverimo ali imamo priporočene videji
console.log('Recommended videos debug:', {
videoId,
totalVideos: recommendedResponse?.videos?.length,
filteredCount: recommendedVideos.length,
recommendedVideos: recommendedVideos.slice(0, 3)
});
// Update page meta tags for social sharing
useEffect(() => {
@ -299,9 +292,9 @@ export default function VideoPage() {
}}
/>
<div className="flex flex-col lg:flex-row gap-6 relative z-[60] bg-green-500/20 border border-green-500 p-4">
<div className="flex flex-col lg:flex-row gap-6 relative z-[60]">
{/* Main video section */}
<div className="flex-1 bg-purple-500/20 border border-purple-500 p-2">
<div className="flex-1">
{/* Video player */}
<div className="relative w-full h-0 pb-[56.25%] bg-black rounded-lg overflow-hidden mb-4">
{currentVideo.videoUrlIframe ? (
@ -391,20 +384,17 @@ export default function VideoPage() {
</div>
{/* Recommended videos sidebar */}
<div className="w-full lg:w-96 bg-red-500/20 border border-red-500 p-4 rounded-lg">
<h2 className="text-lg font-semibold text-white mb-4 bg-red-600 p-2 rounded">🔥 Recommended Videos (DEBUG)</h2>
<div className="w-full lg:w-96">
<h2 className="text-lg font-semibold text-bunny-light mb-4">Recommended Videos</h2>
<div className="space-y-3">
<div className="text-white bg-blue-600 p-2 rounded mb-2">
DEBUG: Imamo {recommendedVideos.length} priporočenih videojev
</div>
{recommendedVideos.slice(0, 10).map((video) => (
<div
key={video.id}
onClick={() => window.location.href = `/video/${video.id}`}
className="flex gap-3 p-3 bg-bunny-gray/30 hover:bg-bunny-gray/50 rounded-lg cursor-pointer transition-colors"
>
<div className="relative w-24 h-16 bg-yellow-500 rounded overflow-hidden flex-shrink-0">
<div className="relative w-24 h-16 bg-gray-700 rounded overflow-hidden flex-shrink-0">
<img
src={video.thumbnailUrl}
alt={video.title}