sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update navigation logic to use Wouter for smoother page transitions

Browse Source 
Replaced direct window.location.href assignments with setLocation from Wouter in FolxStadlPage.tsx to improve client-side routing and prevent full page reloads.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 344ec1e0-1186-4058-bbff-2e9619a7b1e0
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/344ec1e0-1186-4058-bbff-2e9619a7b1e0/FgaI1Sc
This commit is contained in:
sebastjanartic 2025-08-30 22:57:27 +00:00
parent 9bf9eb7cd0
commit 71d2f1fdae
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
client/src/pages/FolxStadlPage.tsx
View File

@ -1,5 +1,5 @@
import { useQuery } from '@tanstack/react-query'; import { useQuery } from '@tanstack/react-query';
import { Link } from 'wouter'; import { Link, useLocation } from 'wouter';
import { ArrowLeft, ChevronLeft, ChevronRight, Menu, X } from 'lucide-react'; import { ArrowLeft, ChevronLeft, ChevronRight, Menu, X } from 'lucide-react';
import VideoCard from '@/components/video-card'; import VideoCard from '@/components/video-card';
import BunnyVideoModal from '@/components/bunny-video-modal'; import BunnyVideoModal from '@/components/bunny-video-modal';
@ -16,6 +16,7 @@ export default function FolxStadlPage() {
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
const [searchQuery, setSearchQuery] = useState(""); const [searchQuery, setSearchQuery] = useState("");
const [viewMode, setViewMode] = useState<"grid" | "list">("grid"); const [viewMode, setViewMode] = useState<"grid" | "list">("grid");
const [, setLocation] = useLocation();
const itemsPerPage = 10; const itemsPerPage = 10;
const { data, isLoading } = useQuery<{videos: Video[], total: number}>({ const { data, isLoading } = useQuery<{videos: Video[], total: number}>({
@ -38,7 +39,7 @@ export default function FolxStadlPage() {
const handleVideoClick = (video: Video) => { const handleVideoClick = (video: Video) => {
// Navigate to individual video page instead of modal // Navigate to individual video page instead of modal
window.location.href = `/video/${video.id}`; setLocation(`/video/${video.id}`);
}; };
const handleCloseModal = () => { const handleCloseModal = () => {
@ -90,7 +91,7 @@ export default function FolxStadlPage() {
value={searchQuery} value={searchQuery}
onChange={(e) => { onChange={(e) => {
setSearchQuery(e.target.value); setSearchQuery(e.target.value);
if (e.target.value) window.location.href = `/?search=${encodeURIComponent(e.target.value)}`; if (e.target.value) setLocation(`/?search=${encodeURIComponent(e.target.value)}`);
}} }}
className="bg-white border border-gray-300 rounded-lg px-4 py-2 pl-10 text-sm text-gray-900 placeholder-gray-500 focus:outline-none focus:border-bunny-blue transition-colors w-64" className="bg-white border border-gray-300 rounded-lg px-4 py-2 pl-10 text-sm text-gray-900 placeholder-gray-500 focus:outline-none focus:border-bunny-blue transition-colors w-64"
/> />