fix: tags

app/gallery/admin/create/page.tsx

@@ -51,13 +51,18 @@ function PageComponent() {
                         className="mb-8 mr-2 rounded-md bg-secondary p-2 w-1/2 text-white"
                         placeholder="Gallery Name"
                     />
-                    <div className="w-1/2">
+                    <div className="w-1/4">
-                        <button className="w-full bg-success hover:bg-success-light text-white rounded-md p-2">
+                        <button  onClick={() => window.location.href = "/gallery/admin"}  className="w-full bg-error hover:bg-error-light text-white rounded-md p-2">
+                            Back
+                        </button>
+                    </div>
+                    <div className="w-1/4">
+                        <button className="w-full bg-success hover:bg-success-light text-white rounded-md p-2 ml-2">
                             Create Gallery
                         </button>
                     </div>
-                    </div>
+                </div>
-                    <div className="w-full flex">
+                <div className="w-full flex">
                     <div className="w-1/2 mr-2">
                         <SearchInput
                             placeholderTags={[

app/gallery/admin/page.tsx

@@ -8,44 +8,72 @@ import SearchInput from "@/components/neroshitron/search_input";
 
 function PageComponent() {
 
-    const [selectedGallery, setSelectedGallery] = useState<string | null>(null);
-    const [filePreviews, setFilePreviews] = useState<string[]>([]);
     const supabase = createClient();
     const user = supabase.auth.getUser();
+    const [galleries, setGalleries] = useState([]);
+    const [nsfwState, setNsfwState] = useState<boolean>(false);
+    const [tagsState, setTagsState] = useState<string[]>([]);
+    const [searchState, setSearchState] = useState<string>("");
+
     const getData = async () => {
+        const galleriesResponse = await fetch(`/api/galleries?search=` + searchState + '&nsfw=' + nsfwState, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({ tags: tagsState })
+        });
+        const galleriesData = await galleriesResponse.json();
+        setGalleries(galleriesData);
     }
+
     useEffect(() => {
         getData();
-    }, [selectedGallery]);
+    }, [tagsState]);
 
-    const closeGallery = () => {
+    const data = [
-        setSelectedGallery(null);
+        { id: 1, name: "Item 1", imageCount: 5, tier: "Tier 1" },
-    }
+        { id: 2, name: "Item 2", imageCount: 10, tier: "Tier 2" },
+        { id: 3, name: "Item 3", imageCount: 8, tier: "Tier 1" },
+    ];
     
-    const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-        const files = event.target.files;
-        if (files) {
-            const previews: string[] = [];
-            for (let i = 0; i < files.length; i++) {
-                const file = files[i];
-                const reader = new FileReader();
-                reader.onload = (e) => {
-                    if (e.target && e.target.result) {
-                        previews.push(e.target.result.toString());
-                        if (previews.length === files.length) {
-                            setFilePreviews(previews);
-                        }
-                    }
-                };
-                reader.readAsDataURL(file);
-            }
-        }
-    };
 
     return (
         <div className="w-full text-white flex justify-center items-center animate-in">
             <div className="w-1/2 rounded-md bg-primary p-12 mt-32">
-                <h1>Test</h1>
+                <div className="w-full flex">
+                    <SearchInput placeholderTags={[
+                        { value: "tags", label: "❗️ click here to add tags to search" }
+                    ]} nsfwButtonEnabled={true} searchChanged={(search) => { setSearchState(search) }} nsfwChanged={(nsfw) => { setNsfwState(nsfw) }} tagsChanged={(tags) => { setTagsState(tags) }} />
+                    <a href="/gallery/admin/create" className="ml-2 text-center bg-success hover:bg-success-light text-white w-1/6 font-bold rounded flex items-center justify-center">
+                        Create
+                    </a>
+                </div>
+                <table className="w-full">
+                    <thead>
+                        <tr>
+                            <th className="px-4 py-2" style={{ width: '60%' }}>Name</th>
+                            <th className="px-4 py-2" style={{width:"15%"}}>📸 #</th>
+                            <th className="px-4 py-2">Tier</th>
+                            <th className="px-4 py-2"></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {/* Replace this with your data mapping logic */}
+                        {galleries.map((item) => (
+                            <tr key={item.name} className="animate-in">
+                                <td className="px-4 py-2">{item.name}</td>
+                                <td className="px-4 py-2">{item.imageCount}</td>
+                                <td className="px-4 py-2">{item.tier.replace("Tier","")}</td>
+                                <td className="px-4 py-2">
+                                    <a href="/gallery/admin/view" className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded float-right">
+                                        View
+                                    </a>
+                                </td>
+                            </tr>
+                        ))}
+                    </tbody>
+                </table>
             </div>
         </div>
     );

app/gallery/admin/view/page.tsx

@@ -51,14 +51,19 @@ function PageComponent() {
                         className="mb-8 mr-2 rounded-md bg-secondary p-2 w-1/2 text-white"
                         placeholder="Gallery Name"
                     />
-                    <div className="w-1/2">
+                    <div className="w-1/4">
-                        <button className="w-full bg-success hover:bg-success-light text-white rounded-md p-2">
+                        <button  onClick={() => window.location.href = "/gallery/admin"}  className="w-full bg-error hover:bg-error-light text-white rounded-md p-2">
-                            Create Gallery
+                            Back
                         </button>
                     </div>
+                    <div className="w-1/4">
+                        <button className="w-full bg-success hover:bg-success-light text-white rounded-md p-2 ml-2">
+                            Save Gallery
+                        </button>
                     </div>
-                    <div className="w-full flex">
+                </div>
-                    <div className="w-1/2">
+                <div className="w-full flex">
+                    <div className="w-1/2 mr-2">
                         <SearchInput
                             placeholderTags={[
                                 { value: "tags", label: "❗️ click here to add tags" },
@@ -70,13 +75,6 @@ function PageComponent() {
                         />
                     </div>
                     <div className="w-1/2">
-                        <input
-                            className="relative m-0 block w-full min-w-0 flex-auto cursor-pointer rounded border border-solid border-secondary-lighter bg-transparent bg-clip-padding px-3 py-[0.32rem] text-base font-normal text-surface transition duration-300 ease-in-out file:-mx-3 file:-my-[0.32rem] file:me-3 file:cursor-pointer file:overflow-hidden file:rounded-none file:border-0 file:border-e file:border-solid file:border-inherit file:bg-transparent file:px-3  file:py-[0.32rem] file:text-surface focus:border-primary focus:text-gray-700 focus:shadow-inset focus:outline-none dark:border-white/70 dark:text-white  file:dark:text-white"
-                            type="file"
-                            id="formFileMultiple"
-                            multiple
-                            onChange={handleFileChange}
-                        />
                         <Masonry breakpointCols={3} className="my-masonry-grid pl-6 col-span-2">
                             {filePreviews.map((preview, index) => (
                                 <img key={index} src={preview} alt={`Preview ${index}`} />

components/neroshitron/search.tsx

@@ -46,7 +46,7 @@ const Search = ({ gallerySelected }: SearchProps) => {
         <div className="container mx-auto py-8">
           <SearchInput placeholderTags={[
     { value: "neroshi", label: "🧑‍🎨 neroshi" },
-    { value: "neroshi", label: "❗️ click here for tags!" },
+    { value: "neroshi", label: "❗️ click here for tags to search!" },
   ]} nsfwButtonEnabled={true} searchChanged={(search) => { setSearch(search) }} nsfwChanged={(nsfw) => { setNsfw(nsfw) }} tagsChanged={(tags) => { setTags(tags); }} />
         </div>
       </section>