fix: resolve CORS issue on public status pages and handle UI errors

client/src/Pages/StatusPage/Status/themes/shared/IncidentModal.tsx

@@ -38,7 +38,7 @@ export const IncidentModal = ({
 	const { t } = useTranslation();
 	const open = Boolean(monitorId && date);
 
-	const { data, isLoading } = useGet<{ incidents: Incident[] }>(
+	const { data, isLoading, error } = useGet<{ incidents: Incident[] }>(
 		open ? `/status-page/${url}/incidents/${monitorId}?date=${date}` : null,
 		{},
 		{ revalidateOnFocus: false }
@@ -68,6 +68,16 @@ export const IncidentModal = ({
 					<Typography mt={SPACING.SM}>
 						{t("pages.statusPages.monitorsList.incidents.loading")}
 					</Typography>
+				) : error ? (
+					<Typography
+						mt={SPACING.SM}
+						color="error"
+					>
+						{t(
+							"pages.statusPages.monitorsList.incidents.errorLoading",
+							"Failed to load incidents."
+						)}
+					</Typography>
 				) : data?.incidents && data.incidents.length > 0 ? (
 					<Stack
 						gap={SPACING.LG}

server/src/api/middleware/statusPagePublicApiPath.ts

@@ -16,7 +16,15 @@ export const isPublicStatusPageApiPath = (method: string, path: string): boolean
 		return true;
 	}
 
-	if (!slug || slug === "team" || slug.includes("/")) {
+	if (!slug || slug === "team") {
+		return false;
+	}
+
+	if (slug.includes("/")) {
+		const parts = slug.split("/");
+		if (parts.length === 3 && parts[1] === "incidents") {
+			return true;
+		}
 		return false;
 	}