diff --git a/app/gallery/page.tsx b/app/gallery/page.tsx index 86cb83f..c237691 100644 --- a/app/gallery/page.tsx +++ b/app/gallery/page.tsx @@ -1,5 +1,5 @@ import { GalleryContent } from "@/components/gallery-content"; -import { GALLERY_ITEMS } from "@/data/gallery"; +import { GALLERY_IMAGES } from "@/data/gallery"; import type { Metadata } from "next"; export const metadata: Metadata = { @@ -8,5 +8,5 @@ export const metadata: Metadata = { }; export default function GalleryPage() { - return ; + return ; } diff --git a/components/gallery-content.tsx b/components/gallery-content.tsx index d561bae..c94bfaf 100644 --- a/components/gallery-content.tsx +++ b/components/gallery-content.tsx @@ -1,18 +1,16 @@ "use client"; import Image from "next/image"; -import { useCallback, useEffect, useMemo, useState } from "react"; +import { useCallback, useEffect, useState } from "react"; import { Icon } from "@iconify/react"; -import { Badge, Typography } from "poyraz-ui/atoms"; +import { Typography } from "poyraz-ui/atoms"; import { StaggerContainer, StaggerItem } from "@/components/motion-wrapper"; -import type { GalleryItem } from "@/data/gallery"; type GalleryContentProps = { - items: GalleryItem[]; + images: string[]; }; -export function GalleryContent({ items }: GalleryContentProps) { - const [activeCategory, setActiveCategory] = useState("All"); +export function GalleryContent({ images }: GalleryContentProps) { const [lightboxIndex, setLightboxIndex] = useState(null); // Keyboard navigation for lightbox @@ -23,123 +21,93 @@ export function GalleryContent({ items }: GalleryContentProps) { if (e.key === "Escape") { setLightboxIndex(null); } else if (e.key === "ArrowLeft") { - setLightboxIndex((prev) => (prev !== null && prev > 0 ? prev - 1 : prev)); + setLightboxIndex((prev) => + prev !== null && prev > 0 ? prev - 1 : prev, + ); } else if (e.key === "ArrowRight") { setLightboxIndex((prev) => - prev !== null && prev < items.length - 1 ? prev + 1 : prev, + prev !== null && prev < images.length - 1 ? prev + 1 : prev, ); } }; + // Prevent body scroll when lightbox is open + document.body.style.overflow = "hidden"; window.addEventListener("keydown", handleKeyDown); - return () => window.removeEventListener("keydown", handleKeyDown); - }, [lightboxIndex, items.length]); + return () => { + document.body.style.overflow = ""; + window.removeEventListener("keydown", handleKeyDown); + }; + }, [lightboxIndex, images.length]); - const categories = useMemo(() => { - const cats = new Set(items.map((item) => item.category)); - return ["All", ...Array.from(cats)].sort(); - }, [items]); - - const filteredItems = useMemo(() => { - if (activeCategory === "All") return items; - return items.filter((item) => item.category === activeCategory); - }, [items, activeCategory]); - - const openLightbox = useCallback( - (item: GalleryItem) => { - const index = items.findIndex((i) => i.id === item.id); - if (index !== -1) { - setLightboxIndex(index); - } - }, - [items], - ); + const openLightbox = useCallback((index: number) => { + setLightboxIndex(index); + }, []); const closeLightbox = useCallback(() => { setLightboxIndex(null); }, []); - const lightboxItem = lightboxIndex !== null ? items[lightboxIndex] : null; + if (images.length === 0) { + return ( +
+
+ + Henüz galeriye görsel eklenmemiş. + +
+
+ ); + } return ( <>
- - {categories.length > 1 && ( -
- {categories.map((category) => ( - - ))} -
- )} - - {filteredItems.length === 0 ? ( -
- Henüz bu kategoride görsel bulunmuyor. -
- ) : ( - - {filteredItems.map((item) => ( - -
openLightbox(item)} - > - {item.title} -
-
- - {item.title} - - - {item.category} - -
-
- - ))} - - )} + {`Gallery +
+
+ ))} +
- {/* Lightbox / Modal */} - {lightboxItem && ( -
+ {/* Lightbox */} + {lightboxIndex !== null && ( +
+ {/* Close */} - {lightboxIndex! > 0 && ( + {/* Previous */} + {lightboxIndex > 0 && ( )} - {lightboxIndex! < items.length - 1 && ( + {/* Next */} + {lightboxIndex < images.length - 1 && ( )} + {/* Image */}
e.stopPropagation()} > -
- {lightboxItem.title} -
- -
-
-
- - {lightboxItem.title} - - - {lightboxItem.category} - -
-
- {lightboxIndex! + 1} / {items.length} -
-
- {lightboxItem.description && ( - - {lightboxItem.description} - - )} -
+ {`Gallery +
+ + {/* Counter */} +
+ {lightboxIndex + 1} / {images.length}
)} diff --git a/data/gallery.ts b/data/gallery.ts index 7e55244..40ebd31 100644 --- a/data/gallery.ts +++ b/data/gallery.ts @@ -1,9 +1,15 @@ -export type GalleryItem = { - id: string; - title: string; - description: string; - image: string; - category: string; -}; - -export const GALLERY_ITEMS: GalleryItem[] = []; +// Galeri resimleri – public/gallery/ klasörüne eklenen dosyaların yolları +export const GALLERY_IMAGES: string[] = [ + "/gallery/1.jpg", + "/gallery/2.jpg", + "/gallery/3.jpg", + "/gallery/4.jpg", + "/gallery/5.jpg", + "/gallery/6.jpg", + "/gallery/7.jpeg", + "/gallery/8.jpeg", + "/gallery/9.jpeg", + "/gallery/10.jpeg", + "/gallery/11.jpeg", + "/gallery/12.jpeg", +]; diff --git a/public/gallery/1.jpg b/public/gallery/1.jpg new file mode 100644 index 0000000..71a6743 Binary files /dev/null and b/public/gallery/1.jpg differ diff --git a/public/gallery/10.jpeg b/public/gallery/10.jpeg new file mode 100644 index 0000000..61f70a1 Binary files /dev/null and b/public/gallery/10.jpeg differ diff --git a/public/gallery/11.jpeg b/public/gallery/11.jpeg new file mode 100644 index 0000000..46ace70 Binary files /dev/null and b/public/gallery/11.jpeg differ diff --git a/public/gallery/12.jpeg b/public/gallery/12.jpeg new file mode 100644 index 0000000..0a2b64e Binary files /dev/null and b/public/gallery/12.jpeg differ diff --git a/public/gallery/2.jpg b/public/gallery/2.jpg new file mode 100644 index 0000000..23fab49 Binary files /dev/null and b/public/gallery/2.jpg differ diff --git a/public/gallery/3.jpg b/public/gallery/3.jpg new file mode 100644 index 0000000..93b3d91 Binary files /dev/null and b/public/gallery/3.jpg differ diff --git a/public/gallery/4.jpg b/public/gallery/4.jpg new file mode 100644 index 0000000..bba3683 Binary files /dev/null and b/public/gallery/4.jpg differ diff --git a/public/gallery/5.jpg b/public/gallery/5.jpg new file mode 100644 index 0000000..28a3cd0 Binary files /dev/null and b/public/gallery/5.jpg differ diff --git a/public/gallery/6.jpg b/public/gallery/6.jpg new file mode 100644 index 0000000..fa941b5 Binary files /dev/null and b/public/gallery/6.jpg differ diff --git a/public/gallery/7.jpeg b/public/gallery/7.jpeg new file mode 100644 index 0000000..7e72586 Binary files /dev/null and b/public/gallery/7.jpeg differ diff --git a/public/gallery/8.jpeg b/public/gallery/8.jpeg new file mode 100644 index 0000000..90c7007 Binary files /dev/null and b/public/gallery/8.jpeg differ diff --git a/public/gallery/9.jpeg b/public/gallery/9.jpeg new file mode 100644 index 0000000..8c59221 Binary files /dev/null and b/public/gallery/9.jpeg differ