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

@@ -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">

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]">