"use client"; import { createClient } from "@/utils/supabase/client"; import { redirect } from "next/navigation"; import GalleryThumbnail from "@/components/ui/gallery_thumbnail"; import React, { useState, useEffect } from 'react'; import { User } from "@supabase/supabase-js"; import Gallery from "@/components/ui/gallery"; function PageComponent() { const supabase = createClient(); const [randomIds, setRandomIds] = useState([]); // replace any with your gallery type const [isOpen, setIsOpen] = useState(false); const [galleries, setGalleries] = useState([]); // replace any with your gallery type const [user, setUser] = useState(null); const [loading, setLoading] = useState(true); const [selectedGallery, setSelectedGallery] = useState(null); const [galleryColumns, setColumns] = useState(0); const generateRandomString = function (length:number) { let result = ''; let characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; let charactersLength = characters.length; for ( let i = 0; i < length; i++ ) { result += characters.charAt(Math.floor(Math.random() * charactersLength)); } return result; } const selectGallery = (gallery:string, columns:number) => { setRandomIds([generateRandomString(3), generateRandomString(3), generateRandomString(3), generateRandomString(3)]); setSelectedGallery(gallery); setColumns(columns); setIsOpen(true); }; const closeGallery = () => { setSelectedGallery(null); setColumns(0); setIsOpen(false); } const getData = async () => { const galleriesResponse = await fetch('/api/galleries'); const galleriesData = await galleriesResponse.json(); let { data: { user } } = await supabase.auth.getUser(); setGalleries(galleriesData); setUser(user); setLoading(false); } useEffect(() => { getData(); }, []); return ( ( user ? (
<>
Background
{galleries.map((gallery, index) => ( ))}
{(isOpen ? ( <> ): null)}
) : (

loading

))); } export default PageComponent;