Merge pull request #114 from Rindrics/fix

Author: rindrics

firestore.rules

@@ -15,13 +15,13 @@ service cloud.firestore {
     }
 
     // Favorites: users can only read/write their own favorites
-    match /favorites/{userId}/{document=**} {
-      allow read, write: if request.auth != null && request.auth.uid == userId;
-    }
-    
-    // Favorites subcollection: users can only read/write their own favorites
-    match /favorites/{userId}/items/{contentId} {
+    match /favorites/{userId} {
       allow read, write: if request.auth != null && request.auth.uid == userId;
+
+      // Favorites subcollection: users can only read/write their own favorites
+      match /items/{contentId} {
+        allow read, write: if request.auth != null && request.auth.uid == userId;
+      }
     }
 
     // Legacy admin-only rules for other collections

src/components/AuthButton.tsx

@@ -4,11 +4,6 @@ import Link from 'next/link';
 import { useEffect, useState } from 'react';
 import { useAuth } from '@/contexts/AuthContext';
 
-// Show auth UI in development or when using emulators
-const isDevelopment = process.env.NODE_ENV === 'development';
-const useEmulators = process.env.NEXT_PUBLIC_USE_FIREBASE_EMULATORS === 'true';
-const showAuthUI = isDevelopment || useEmulators;
-
 export function AuthButton() {
   const {
     user,
@@ -45,11 +40,6 @@ export function AuthButton() {
     return () => document.removeEventListener('keydown', handleEscape);
   }, []);
 
-  // Hide auth UI in production (unless using emulators)
-  if (!showAuthUI) {
-    return null;
-  }
-
   if (loading) {
     return (
       <div className="text-sm text-zinc-600 dark:text-zinc-400">

src/components/ListWithFavoriteSidebar.tsx

@@ -1,7 +1,8 @@
 'use client';
 
-import { Suspense, useEffect, useState } from 'react';
+import { Suspense, useEffect, useLayoutEffect, useState } from 'react';
 import { useAuth } from '@/contexts/AuthContext';
+import { getFavoriteContentIds } from '@/lib/favorites';
 import { FavoriteContentList } from './FavoriteContentList';
 
 interface Props {
@@ -16,9 +17,11 @@ export function ListWithFavoriteSidebar({
   maxItemsMobile = 2,
 }: Props) {
   const { user, loading } = useAuth();
-  const [isLargeScreen, setIsLargeScreen] = useState(true);
+  const [isLargeScreen, setIsLargeScreen] = useState(false);
+  const [hasFavorites, setHasFavorites] = useState(false);
+  const [isFavoritesLoading, setIsFavoritesLoading] = useState(true);
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     const mediaQuery = window.matchMedia('(min-width: 1024px)');
     setIsLargeScreen(mediaQuery.matches);
 
@@ -27,8 +30,45 @@ export function ListWithFavoriteSidebar({
     return () => mediaQuery.removeEventListener('change', handler);
   }, []);
 
-  // Show full width when not authenticated
-  if (!user && !loading) {
+  // Check if user has favorites
+  useLayoutEffect(() => {
+    if (!user || loading) {
+      setIsFavoritesLoading(true);
+      setHasFavorites(false);
+      return () => {};
+    }
+
+    let cancelled = false;
+
+    setIsFavoritesLoading(true);
+    getFavoriteContentIds(user.uid)
+      .then((ids) => {
+        if (!cancelled) {
+          setHasFavorites(ids.length > 0);
+        }
+      })
+      .catch(() => {
+        if (!cancelled) {
+          setHasFavorites(false);
+        }
+      })
+      .finally(() => {
+        if (!cancelled) {
+          setIsFavoritesLoading(false);
+        }
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [user, loading]);
+
+  // Show full width while loading or when authenticated but no favorites exist
+  if (loading || isFavoritesLoading) {
+    return <>{children}</>;
+  }
+
+  if (!user || !hasFavorites) {
     return <>{children}</>;
   }