diff --git a/src/components/header/header.tsx b/src/components/header/header.tsx
index 737067c..8231156 100644
--- a/src/components/header/header.tsx
+++ b/src/components/header/header.tsx
@@ -55,14 +55,14 @@ const Header: React.FC = () => {
Movies Catalog
-
-
- Watchlist
-
- {user ? (
+ {user ? (
+
+
+ Watchlist
+
- ) : (
+
+ ) : (
+
+
+ Watchlist
+
{
Login
- )}
-
+
+ )}
);
diff --git a/src/modules/watchlist/watchlist.tsx b/src/modules/watchlist/watchlist.tsx
index 3790e8f..c5df6dc 100644
--- a/src/modules/watchlist/watchlist.tsx
+++ b/src/modules/watchlist/watchlist.tsx
@@ -6,6 +6,9 @@ import { getWatchlist } from '@/api/watchlist.api';
import { SquareArrowOutUpRight } from 'lucide-react';
import Image from 'next/image';
import Link from 'next/link';
+import { useSelector } from 'react-redux';
+import { RootState } from '@/store/userStore';
+import { useRouter } from 'next/navigation';
interface Movie {
id: number;
@@ -18,10 +21,17 @@ interface Movie {
const baseUrl = 'https://image.tmdb.org/t/p/original';
const WatchlistModule = () => {
+ const user = useSelector((state: RootState) => state.user.user);
const [watchlist, setWatchlist] = useState([]);
const accessToken = getCookie('accessToken') as string;
+ const router = useRouter();
useEffect(() => {
+ if (!user) {
+ router.push('/signin');
+ return;
+ }
+
const fetchWatchlist = async () => {
try {
const res = await getWatchlist(accessToken);
@@ -33,7 +43,7 @@ const WatchlistModule = () => {
}
};
fetchWatchlist();
- }, []);
+ }, [user, accessToken]);
return (