From 1f1192fb62d0ea017e4058ffcd0d02458b198de6 Mon Sep 17 00:00:00 2001
From: Felipe Cardoso <felipe.cardoso@hotmail.it>
Date: Wed, 19 Mar 2025 09:02:57 +0100
Subject: [PATCH] Trigger data refetch on mount for events and themes pages

Added `useEffect` hooks to automatically refetch guests data in the Event Detail Page and themes data in the Event Themes Page upon component mount. This ensures the displayed data is always up-to-date when the user navigates to these pages.
---
 frontend/src/app/(main)/dashboard/event-themes/page.tsx  | 6 +++++-
 frontend/src/app/(main)/dashboard/events/[slug]/page.tsx | 6 ++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/(main)/dashboard/event-themes/page.tsx b/frontend/src/app/(main)/dashboard/event-themes/page.tsx
index a54b89a..4cb2706 100644
--- a/frontend/src/app/(main)/dashboard/event-themes/page.tsx
+++ b/frontend/src/app/(main)/dashboard/event-themes/page.tsx
@@ -17,6 +17,7 @@ import Link from "next/link";
 import { Loader2Icon, PaletteIcon } from "lucide-react";
 import { useEventThemes } from "@/context/event-theme-context";
 import { getServerFileUrl } from "@/lib/utils";
+import { useEffect } from "react";
 
 export default function EventThemesPage() {
   // const { data: themes, isLoading } = useQuery({
@@ -24,8 +25,11 @@ export default function EventThemesPage() {
   //     queryFn: () => listEventThemes().then(res => res.data),
   // });
 
-  const { themes, isLoadingThemes } = useEventThemes();
+  const { themes, refetchThemes, isLoadingThemes } = useEventThemes();
 
+  useEffect(() => {
+    refetchThemes();
+  }, []);
   return (
     <div className="max-w-7xl mx-auto py-6 px-4">
       <div className="flex items-center justify-between mb-8">
diff --git a/frontend/src/app/(main)/dashboard/events/[slug]/page.tsx b/frontend/src/app/(main)/dashboard/events/[slug]/page.tsx
index 1ef8541..2245b5d 100644
--- a/frontend/src/app/(main)/dashboard/events/[slug]/page.tsx
+++ b/frontend/src/app/(main)/dashboard/events/[slug]/page.tsx
@@ -27,11 +27,13 @@ import {
 import { useEventThemes } from "@/context/event-theme-context";
 import { getServerFileUrl } from "@/lib/utils";
 import GuestsList from "@/components/guests/guests-list";
+import { useGuests } from "@/context/guest-context";
 
 export default function EventDetailPage() {
   const { slug } = useParams<{ slug: string }>();
   const { event, fetchEventBySlug, isLoadingEvent, eventError } = useEvents();
   const { themes } = useEventThemes();
+  const { refetchGuests } = useGuests();
   const currentTheme =
     event?.theme_id && themes
       ? themes.find((theme) => theme.id === event.theme_id)
@@ -44,6 +46,10 @@ export default function EventDetailPage() {
     fetchEventBySlug(slug);
   }, [slug, fetchEventBySlug]);
 
+  useEffect(() => {
+    refetchGuests();
+  }, []);
+
   if (isLoadingEvent) {
     return (
       <div className="flex items-center justify-center min-h-[50vh]">