Update grid layout, refetch interval, and image handling

Adjusted the grid column behavior for medium screens in event themes and commented out unused badge rendering. Updated the image uploader to handle `existingImage` using the server URL and added debugging output. Modified the event theme context to use a fixed refetch interval of 60 seconds.
This commit is contained in:
2025-03-14 02:00:41 +01:00
parent b7a9e3f981
commit 3244fd8beb
3 changed files with 15 additions and 11 deletions

View File

@@ -61,7 +61,7 @@ export default function EventThemesPage() {
)}
{!isLoadingThemes && themes && themes.length > 0 && (
<div className="grid gap-6 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
<div className="grid gap-6 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4">
{themes.map((theme) => (
<Card
key={theme.id}
@@ -88,14 +88,14 @@ export default function EventThemesPage() {
</CardDescription>
</CardContent>
<CardFooter className="flex flex-col gap-2 p-4 border-t border-gray-200 dark:border-gray-700">
<div className="flex gap-2">
{theme.background_image_url && (
<Badge>Background Image</Badge>
)}
{theme.foreground_image_url && (
<Badge>Foreground Image</Badge>
)}
</div>
{/*<div className="flex gap-2">*/}
{/* {theme.background_image_url && (*/}
{/* <Badge>Background Image</Badge>*/}
{/* )}*/}
{/* {theme.foreground_image_url && (*/}
{/* <Badge>Foreground Image</Badge>*/}
{/* )}*/}
{/*</div>*/}
<Button variant="outline" size="sm" asChild className="w-full">
<Link href={`/dashboard/event-themes/${theme.id}/edit`}>
Edit Theme

View File

@@ -99,7 +99,11 @@ export function ImageUploader({
fileInputRef.current?.click();
};
// Determine the current image to display
const currentImage = getServerFileUrl(fileUrl) || preview || existingImage;
const currentImage =
getServerFileUrl(fileUrl) ||
preview ||
getServerFileUrl(existingImage || undefined);
console.log("currentImage", currentImage);
// const currentImage = preview || existingImage;
return (
<div className={`w-full space-y-2 ${className}`}>

View File

@@ -98,7 +98,7 @@ export const EventThemesProvider: React.FC<EventThemesProviderProps> = ({
} = useQuery({
...listEventThemesOptions(),
refetchOnWindowFocus: "always",
refetchIntervalInBackground: true,
refetchInterval: 60000,
});
// Fetch specific theme