Improve video loading and social media sharing functionality

Fixes video loading errors by increasing retries and improving error handling in `VideoPage.tsx`. Updates social media prerendering in `server/index.ts` to correctly handle both short and full video IDs, ensuring proper metadata display for shared links.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/HCAS0JG
This commit is contained in:
sebastjanartic 2025-09-03 12:06:16 +00:00
parent faa1eaf74e
commit c5dd773a8b
2 changed files with 27 additions and 4 deletions

View File

@ -63,10 +63,18 @@ export default function VideoPage() {
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
// Fetch current video
const { data: currentVideo, isLoading: videoLoading } = useQuery<Video>({
const { data: currentVideo, isLoading: videoLoading, error: videoError } = useQuery<Video>({
queryKey: [`/api/videos/${videoId}`],
queryFn: () => fetch(`/api/videos/${videoId}`).then(res => res.json()),
queryFn: async () => {
const response = await fetch(`/api/videos/${videoId}`);
if (!response.ok) {
throw new Error(`Failed to fetch video: ${response.status}`);
}
return response.json();
},
enabled: !!videoId,
retry: 3,
retryDelay: 1000,
});
// Fetch recommended videos (excluding current video)

View File

@ -76,7 +76,7 @@ app.use((req, res, next) => {
// Initialize video sync service for automatic Bunny.net updates
await videoSyncService.initialize();
// Social media prerendering middleware - mora biti PRED setupVite
// Social media prerendering middleware - samo za social bot-e
app.get('/video/:videoId', async (req, res, next) => {
const { videoId } = req.params;
const userAgent = req.get('User-Agent') || '';
@ -84,9 +84,24 @@ app.use((req, res, next) => {
// Če je to Facebook, Twitter, WhatsApp ali podoben scraper
const isSocialBot = /facebookexternalhit|twitterbot|whatsapp|telegrambot|discordbot|slackbot|linkedinbot/i.test(userAgent);
// Če NI social bot, pustimo da React routing prevzame
if (!isSocialBot) {
return next();
}
if (isSocialBot) {
try {
const video = await storage.getVideo(videoId);
// Support both short and long video IDs for social media
let video;
// If it's a short ID (8 chars), find video by short ID
if (videoId.length === 8) {
const allVideosResponse = await storage.getVideos({ limit: 200, offset: 0 });
video = allVideosResponse.videos.find((v: any) => v.id.replace(/-/g, '').substring(0, 8) === videoId);
} else {
// Try as full ID
video = await storage.getVideo(videoId);
}
if (!video) {
return next(); // Če video ne obstaja, preusmerimo na običajno SPA