damien/neroshitron
1
0
Fork 0
mirror of https://github.com/D4M13N-D3V/neroshitron.git synced 2025-06-16 05:09:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: hooked up tiers to galleries page

Browse Source
This commit is contained in:
Damien Ostler 2024-06-08 19:11:32 -04:00
parent 420e029d66
commit 164aec1c51
2 changed files with 37 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/neroshitron/galleries.tsx
View File

@ -17,6 +17,7 @@ const Galleries = ({ nsfw, tags, search, gallerySelected }: TagProps) => {
const [searchState, setSearchState] = useState<string>(search); const [searchState, setSearchState] = useState<string>(search);
const [selectedGallery, setSelectedGallery] = useState<string | null>(null); const [selectedGallery, setSelectedGallery] = useState<string | null>(null);
const [tiers, setTiers] = useState<any[]>([]);
const selectGallery = (gallery: string) => { const selectGallery = (gallery: string) => {
setSelectedGallery(gallery); setSelectedGallery(gallery);
@ -25,6 +26,17 @@ const Galleries = ({ nsfw, tags, search, gallerySelected }: TagProps) => {
const getData = async () => { const getData = async () => {
try {
const response = await fetch('/api/tiers');
if (response.ok) {
const data = await response.json();
setTiers(data);
} else {
console.error('Failed to fetch users');
}
} catch (error) {
console.error('Error fetching users:', error);
}
const galleriesResponse = await fetch(`/api/galleries?search=` + searchState + '&nsfw=' + nsfwState, { const galleriesResponse = await fetch(`/api/galleries?search=` + searchState + '&nsfw=' + nsfwState, {
method: 'POST', method: 'POST',
headers: { headers: {
@ -43,7 +55,11 @@ const Galleries = ({ nsfw, tags, search, gallerySelected }: TagProps) => {
return ( return (
<div className="absolute inset-0 mx-auto ml-16 md:ml-0 pt-48 p-4 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-y-48 gap-x-4 animate-in overflow-y-scroll no-scrollbar z-0"> <div className="absolute inset-0 mx-auto ml-16 md:ml-0 pt-48 p-4 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-y-48 gap-x-4 animate-in overflow-y-scroll no-scrollbar z-0">
{galleries && galleries.map((gallery: any, index) => ( {galleries && galleries.map((gallery: any, index) => {
const tier = tiers.find((tier) => tier.name == gallery.tier);
const subscriptionColor = tier ? tier.color : null;
return (
<GalleryThumbnail <GalleryThumbnail
key={gallery.name + " " + nsfw} key={gallery.name + " " + nsfw}
id={gallery.name} id={gallery.name}
@ -52,10 +68,12 @@ const Galleries = ({ nsfw, tags, search, gallerySelected }: TagProps) => {
columns={gallery.columns} columns={gallery.columns}
showNsfw={nsfw} showNsfw={nsfw}
subscription={gallery.tier as string} subscription={gallery.tier as string}
subscriptionColor={subscriptionColor}
onSelect={selectGallery} onSelect={selectGallery}
nsfw={gallery.nsfw} nsfw={gallery.nsfw}
></GalleryThumbnail> ></GalleryThumbnail>
))} );
})}
</div> </div>
); );
}; };

18
components/neroshitron/gallery_thumbnail.tsx
View File

@ -6,12 +6,13 @@ interface GalleryThumbnailProps {
onSelect: (id: string, columns: number) => void; onSelect: (id: string, columns: number) => void;
title: string; title: string;
subscription: string; subscription: string;
subscriptionColor: string;
tags: string[]; tags: string[];
showNsfw: boolean; showNsfw: boolean;
nsfw: boolean; nsfw: boolean;
} }
const GalleryThumbnail = ({ id, columns, onSelect, title, showNsfw, nsfw, subscription, tags }: GalleryThumbnailProps) => { const GalleryThumbnail = ({ id, columns, onSelect, title, showNsfw, nsfw, subscription, subscriptionColor, tags }: GalleryThumbnailProps) => {
const [galleryId, setGalleryId] = useState<string>(id); const [galleryId, setGalleryId] = useState<string>(id);
const [thumbnailUrl, setThumbnailUrl] = useState<string>(''); const [thumbnailUrl, setThumbnailUrl] = useState<string>('');
const [isLoading, setIsLoading] = useState<boolean>(true); const [isLoading, setIsLoading] = useState<boolean>(true);
@ -21,6 +22,7 @@ const GalleryThumbnail = ({ id, columns, onSelect, title, showNsfw, nsfw, subscr
const [showNsfwState, setShowNsfw] = useState<boolean>(showNsfw); const [showNsfwState, setShowNsfw] = useState<boolean>(showNsfw);
const [subscriptionState, setSubscription] = useState<string>(subscription); const [subscriptionState, setSubscription] = useState<string>(subscription);
const [tagsState, setTags] = useState<string[]>(tags); const [tagsState, setTags] = useState<string[]>(tags);
console.log(subscriptionColor)
const openGallery = () => { const openGallery = () => {
onSelect(galleryId, galleryCollumns); onSelect(galleryId, galleryCollumns);
}; };
@ -72,18 +74,8 @@ const GalleryThumbnail = ({ id, columns, onSelect, title, showNsfw, nsfw, subscr
{nsfwState && ( {nsfwState && (
<span className=" bg-error text-white px-2 py-1 mr-2 rounded-md text-sm h-full flex items-center">NSFW</span> <span className=" bg-error text-white px-2 py-1 mr-2 rounded-md text-sm h-full flex items-center">NSFW</span>
)} )}
{subscriptionState === "Free" && ( <span className="text-white px-2 py-1 rounded-md text-sm h-full flex items-center" style={{ cursor: 'pointer', backgroundColor: subscriptionColor }}>Free</span>
<span className=" bg-free text-white px-2 py-1 rounded-md text-sm h-full flex items-center">Free</span>
)}
{subscriptionState === "Tier 1" && (
<span className=" bg-tier1 text-white px-2 py-1 rounded-md text-sm h-full flex items-center">Tier 1</span>
)}
{subscriptionState === "Tier 2" && (
<span className=" bg-tier2 text-white px-2 py-1 rounded-md text-sm h-full flex items-center">Tier 2</span>
)}
{subscriptionState === "Tier 3" && (
<span className=" bg-tier3 text-white px-2 py-1 rounded-md text-sm h-full flex items-center">Tier 3</span>
)}
</div> </div>
</div> </div>
{/* <div className="text-white flex justify-between"> {/* <div className="text-white flex justify-between">