Fix: Homepage designer preview (#921)

frontend/src/routeLoaders/organizerPreviewRouteLoader.ts

@@ -0,0 +1,44 @@
+import {LoaderFunctionArgs} from "react-router";
+import {getQueryClient} from "../utilites/ssrQueryClient.ts";
+import {getOrganizerPublicQuery} from "../queries/useGetOrganizerPublic.ts";
+import {getOrganizerPublicEventsQuery} from "../queries/useGetOrganizerEventsPublic.ts";
+
+/**
+ * Loader for the organizer preview page - does NOT redirect based on slug
+ * This is used by the iframe preview in the homepage designer
+ */
+export const organizerPreviewRouteLoader = async ({params}: LoaderFunctionArgs) => {
+    const {organizerId} = params;
+
+    if (!organizerId) {
+        throw new Error('Organizer ID is required');
+    }
+
+    try {
+        const organizer = await getQueryClient().fetchQuery(getOrganizerPublicQuery(organizerId));
+
+        const eventsData = await getQueryClient().fetchQuery(
+            getOrganizerPublicEventsQuery(organizerId, {
+                pageNumber: 1,
+                perPage: 30,
+                sortBy: 'start_date',
+                sortDirection: 'asc',
+                additionalParams: {
+                    eventsStatus: 'upcoming',
+                },
+                filterFields: {}
+            })
+        );
+
+        return {
+            organizer,
+            eventsData,
+            isPastEvents: false
+        };
+    } catch (error: any) {
+        if (error?.response?.status === 404) {
+            return {organizer: null, eventsData: null, isPastEvents: false};
+        }
+        throw error;
+    }
+}

frontend/src/router.tsx

@@ -4,6 +4,7 @@ import {useEffect, useState} from "react";
 import {useGetMe} from "./queries/useGetMe.ts";
 import {publicEventRouteLoader} from "./routeLoaders/publicEventRouteLoader.ts";
 import {publicOrganizerRouteLoader} from "./routeLoaders/publicOrganizerRouteLoader.ts";
+import {organizerPreviewRouteLoader} from "./routeLoaders/organizerPreviewRouteLoader.ts";
 
 const Root = () => {
     const [redirectPath, setRedirectPath] = useState<string | null>(null);
@@ -455,7 +456,7 @@ export const router: RouteObject[] = [
     },
     {
         path: "/organizer/:organizerId/preview",
-        loader: publicOrganizerRouteLoader,
+        loader: organizerPreviewRouteLoader,
         async lazy() {
             const OrganizerHomepagePreview = await import("./components/layouts/OrganizerHomepagePreview");
             return {Component: OrganizerHomepagePreview.default};