diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx
index 26acbe8..bba53f4 100644
--- a/src/app/admin/page.tsx
+++ b/src/app/admin/page.tsx
@@ -1,6 +1,5 @@
import ImageManager from '@/components/ImageManager';
import ImageUpload from '@/components/ImageUpload';
-import { ImagesResponse, TagsResponse } from '@/interfaces/api';
import { getSession } from '@/lib/session';
import styles from '@/styles/AdminPage.module.scss';
import { redirect } from 'next/navigation';
@@ -12,33 +11,10 @@ export default async function AdminPage() {
redirect('/login');
}
- const fetchImages = async () => {
- const apiUrl = new URL(
- '/api/images?imagesPerPage=-1}',
- process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000',
- );
- const response = await fetch(apiUrl.toString());
- if (!response.ok) {
- throw new Error(`Network response was not ok: ${response.statusText}`);
- }
-
- return (await response.json()) as ImagesResponse;
- };
-
- const fetchTags = async () => {
- const apiUrl = new URL('/api/tags', process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000');
- const response = await fetch(apiUrl.toString());
- if (!response.ok) {
- throw new Error(`Network response was not ok: ${response.statusText}`);
- }
-
- return (await response.json()) as TagsResponse;
- };
-
return (
-
+
);
}
diff --git a/src/components/ImageManager.tsx b/src/components/ImageManager.tsx
index ee4eb7b..e950c82 100644
--- a/src/components/ImageManager.tsx
+++ b/src/components/ImageManager.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/exhaustive-deps */
'use client';
import Button from '@/components/Button';
@@ -5,19 +6,14 @@ import InputField from '@/components/InputField';
import { ImageMeta } from '@/interfaces/image';
import styles from '@/styles/ImageManager.module.scss';
import Image from 'next/image';
-import { redirect, useSearchParams } from 'next/navigation';
+import { useSearchParams } from 'next/navigation';
import React, { useEffect, useState } from 'react';
import Tags from './Tags';
-interface ImageManagerProps {
- images: ImageMeta[];
- tags: string[];
-}
-
-export default function ImageManager({ images: initialImages, tags: initialTags }: ImageManagerProps) {
- const [images, setImages] = useState(initialImages);
+export default function ImageManager() {
+ const [images, setImages] = useState([]);
const [error, setError] = useState();
- const [tags, setTags] = useState(initialTags);
+ const [tags, setTags] = useState([]);
const [activeTag, setActiveTag] = useState('all');
const searchParams = useSearchParams();
@@ -92,23 +88,17 @@ export default function ImageManager({ images: initialImages, tags: initialTags
};
useEffect(() => {
- setActiveTag(searchParams.get('tag') ?? 'all');
- }, [searchParams, tags]);
+ fetchTags();
+ fetchImages();
+ }, []);
useEffect(() => {
- const filterImages = () => {
- if (activeTag === 'all') {
- setImages(initialImages);
- return;
- } else if (activeTag && !tags.includes(activeTag)) {
- redirect('/admin');
- } else {
- setImages(initialImages.filter((image) => image.tags.includes(activeTag)));
- }
- };
+ fetchImages();
+ }, [activeTag]);
- filterImages();
- }, [activeTag, initialImages, tags]);
+ useEffect(() => {
+ setActiveTag(searchParams.get('tag') ?? 'all');
+ }, [searchParams, tags]);
return (