Latest fixes for echo

echo/directus/sync/collections/operations.json

@@ -79,7 +79,7 @@
     "resolve": null,
     "reject": null,
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "615a54cd-a72e-41ad-9403-9577c80280d6"
+    "_syncId": "84c38ea6-5d15-429f-8c24-9485d54ba7be"
   },
   {
     "name": "Email Send Operation Failed Dutch",
@@ -93,7 +93,7 @@
     "resolve": null,
     "reject": null,
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "84c38ea6-5d15-429f-8c24-9485d54ba7be"
+    "_syncId": "615a54cd-a72e-41ad-9403-9577c80280d6"
   },
   {
     "name": "failed",
@@ -107,7 +107,7 @@
     "resolve": null,
     "reject": null,
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "8d8d787a-dbc4-44f9-9ab4-28e3f3d5f31c"
+    "_syncId": "eb6f8253-647f-4fb1-9010-e93594ba065e"
   },
   {
     "name": "failed",
@@ -121,7 +121,7 @@
     "resolve": null,
     "reject": null,
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "eb6f8253-647f-4fb1-9010-e93594ba065e"
+    "_syncId": "8d8d787a-dbc4-44f9-9ab4-28e3f3d5f31c"
   },
   {
     "name": "Filter Emails",
@@ -132,10 +132,10 @@
     "options": {
       "code": "module.exports = async function(data) {\n\n    const submissions = data.get_all_participants;\n    \n    // Filter submissions to only include those where email_opt_in is true\n    const filteredSubmissions = submissions.filter(sub => sub.email_opt_in === true);\n\n    // Create an array with email, project_id and an email_opt_out token for each submission\n    const result = filteredSubmissions.map(sub => ({\n        project_name: data.project_data[0].name || '',\n\t\tdefault_conversation_title: data.project_data[0].default_conversation_title || '',\n\t\tconversation_name: sub.conversation_id.participant_name || '',\n        email: sub.email,\n        project_id: sub.project_id || '',\n        token: sub.email_opt_out_token,\n        language: data.check_report_language[0].language || 'empty',\n        ADMIN_BASE_URL: \"{{ $env.ADMIN_BASE_URL }}\" || \"http://localhost:5173\",\n        PARTICIPANT_BASE_URL: \"{{ $env.PARTICIPANT_BASE_URL }}\" || \"http://localhost:5174\",        \n    }));\n    \n    return result;\n};"
     },
-    "resolve": "b8144cee-59f6-40d9-a849-dd0c639e4e31",
+    "resolve": "e101f00d-2fb8-4f40-9e0e-4d24da5bb1e9",
     "reject": null,
     "flow": "ec4e7ea5-72de-4365-b66f-d8f11b549495",
-    "_syncId": "ca1ffbc5-cfce-4fb4-8f15-c128ea407d41"
+    "_syncId": "efb3982e-5703-4c07-8982-a6e1b5218e4a"
   },
   {
     "name": "Filter Emails",
@@ -146,10 +146,10 @@
     "options": {
       "code": "module.exports = async function(data) {\n\n    const submissions = data.get_all_participants;\n    \n    // Filter submissions to only include those where email_opt_in is true\n    const filteredSubmissions = submissions.filter(sub => sub.email_opt_in === true);\n\n    // Create an array with email, project_id and an email_opt_out token for each submission\n    const result = filteredSubmissions.map(sub => ({\n        project_name: data.project_data[0].name || '',\n\t\tdefault_conversation_title: data.project_data[0].default_conversation_title || '',\n\t\tconversation_name: sub.conversation_id.participant_name || '',\n        email: sub.email,\n        project_id: sub.project_id || '',\n        token: sub.email_opt_out_token,\n        language: data.check_report_language[0].language || 'empty',\n        ADMIN_BASE_URL: \"{{ $env.ADMIN_BASE_URL }}\" || \"http://localhost:5173\",\n        PARTICIPANT_BASE_URL: \"{{ $env.PARTICIPANT_BASE_URL }}\" || \"http://localhost:5174\",        \n    }));\n    \n    return result;\n};"
     },
-    "resolve": "e101f00d-2fb8-4f40-9e0e-4d24da5bb1e9",
+    "resolve": "b8144cee-59f6-40d9-a849-dd0c639e4e31",
     "reject": null,
     "flow": "ec4e7ea5-72de-4365-b66f-d8f11b549495",
-    "_syncId": "efb3982e-5703-4c07-8982-a6e1b5218e4a"
+    "_syncId": "ca1ffbc5-cfce-4fb4-8f15-c128ea407d41"
   },
   {
     "name": "log environment vars",
@@ -213,7 +213,7 @@
     "resolve": null,
     "reject": null,
     "flow": "ec4e7ea5-72de-4365-b66f-d8f11b549495",
-    "_syncId": "84852456-3f3a-4906-be94-8b750159883b"
+    "_syncId": "e8274ad4-5844-42cd-8a6b-d40d08cf83d3"
   },
   {
     "name": "Report Not Published",
@@ -227,7 +227,7 @@
     "resolve": null,
     "reject": null,
     "flow": "ec4e7ea5-72de-4365-b66f-d8f11b549495",
-    "_syncId": "e8274ad4-5844-42cd-8a6b-d40d08cf83d3"
+    "_syncId": "84852456-3f3a-4906-be94-8b750159883b"
   },
   {
     "name": "Send Email Dutch",
@@ -256,9 +256,9 @@
       ]
     },
     "resolve": null,
-    "reject": "84c38ea6-5d15-429f-8c24-9485d54ba7be",
+    "reject": "615a54cd-a72e-41ad-9403-9577c80280d6",
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "34fb6ee5-2813-484a-a1cc-f97de097509b"
+    "_syncId": "ea78ec02-364d-4f18-80f8-ea5ac4c787ed"
   },
   {
     "name": "Send Email Dutch",
@@ -287,9 +287,9 @@
       ]
     },
     "resolve": null,
-    "reject": "615a54cd-a72e-41ad-9403-9577c80280d6",
+    "reject": "84c38ea6-5d15-429f-8c24-9485d54ba7be",
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "ea78ec02-364d-4f18-80f8-ea5ac4c787ed"
+    "_syncId": "34fb6ee5-2813-484a-a1cc-f97de097509b"
   },
   {
     "name": "Send Email English",
@@ -318,9 +318,9 @@
       ]
     },
     "resolve": null,
-    "reject": "2b24450b-6a2e-4452-aba1-9814d17fef42",
+    "reject": "920bd181-b2a2-4f0d-94dc-3b1a08c3f4ef",
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "9390ed2f-7dc6-4a6a-83da-2d87d478261d"
+    "_syncId": "3dbf2ea1-17f8-4bde-aa89-43278fe9a00f"
   },
   {
     "name": "Send Email English",
@@ -349,9 +349,9 @@
       ]
     },
     "resolve": null,
-    "reject": "920bd181-b2a2-4f0d-94dc-3b1a08c3f4ef",
+    "reject": "2b24450b-6a2e-4452-aba1-9814d17fef42",
     "flow": "17703446-fef0-49e9-bdc4-385db1311137",
-    "_syncId": "3dbf2ea1-17f8-4bde-aa89-43278fe9a00f"
+    "_syncId": "9390ed2f-7dc6-4a6a-83da-2d87d478261d"
   },
   {
     "name": "Trigger Email Flow",

echo/directus/sync/collections/permissions.json

@@ -914,6 +914,13 @@
                 }
               }
             },
+            {
+              "folder": {
+                "name": {
+                  "_contains": "avatars"
+                }
+              }
+            },
             {
               "folder": {
                 "name": {

echo/directus/sync/collections/policies.json

@@ -11,10 +11,6 @@
       {
         "role": "_sync_default_admin_role",
         "sort": 1
-      },
-      {
-        "role": null,
-        "sort": null
       }
     ],
     "_syncId": "_sync_default_admin_policy"

echo/frontend/src/components/form/MarkdownWYSIWYG/styles.css

@@ -489,7 +489,7 @@
 	align-items: center;
 	overflow-x: auto;
 	position: sticky;
-	top: 0;
+	top: var(--mdx-toolbar-top, 135px);
 	background-color: var(--baseBg);
 	width: inherit;
 }

echo/frontend/src/components/report/ReportEditor.tsx

@@ -61,8 +61,8 @@ const ReportEditorComponent: React.FC<{
 					: report.project_id;
 
 			await updateReportMutation.mutateAsync({
-				projectId: projectId as string,
 				payload: values,
+				projectId: projectId as string,
 				reportId: report.id,
 			});
 

echo/frontend/src/components/report/ReportRenderer.tsx

@@ -5,12 +5,22 @@ import { cn } from "@/lib/utils";
 import { Logo } from "../common/Logo";
 import { Markdown } from "../common/Markdown";
 import { QRCode } from "../common/QRCode";
-import { useProjectReport } from "./hooks";
+import { useProjectReport, usePublicProjectReport } from "./hooks";
 import { ReportEditor } from "./ReportEditor";
 
-const ContributeToReportCTA = ({ href, fullscreen }: { href: string; fullscreen?: boolean }) => {
+const ContributeToReportCTA = ({
+	href,
+	fullscreen,
+}: {
+	href: string;
+	fullscreen?: boolean;
+}) => {
 	return (
-		<Paper p="xl" className={fullscreen ? "bg-white" : "bg-gray-100"} {...testId("report-contribute-cta")}>
+		<Paper
+			p="xl"
+			className={fullscreen ? "bg-white" : "bg-gray-100"}
+			{...testId("report-contribute-cta")}
+		>
 			<Stack className="text-center text-2xl font-semibold" align="center">
 				<Trans>Do you want to contribute to this project?</Trans>
 
@@ -28,7 +38,13 @@ const ContributeToReportCTA = ({ href, fullscreen }: { href: string; fullscreen?
 					<Trans>Share your voice by scanning the QR code below.</Trans>
 				</div>
 
-				<div className={fullscreen ? "block h-[200px] w-[200px]" : "hidden h-[200px] w-[200px] print:block"}>
+				<div
+					className={
+						fullscreen
+							? "block h-[200px] w-[200px]"
+							: "hidden h-[200px] w-[200px] print:block"
+					}
+				>
 					<QRCode value={href} />
 				</div>
 			</Stack>
@@ -84,7 +100,9 @@ const ReportLayout = ({
 
 			{children}
 
-			{!!contributeLink && <ContributeToReportCTA href={contributeLink} fullscreen={fullscreen} />}
+			{!!contributeLink && (
+				<ContributeToReportCTA href={contributeLink} fullscreen={fullscreen} />
+			)}
 		</Stack>
 	);
 };
@@ -94,13 +112,20 @@ export const ReportRenderer = ({
 	reportId,
 	opts,
 	isEditing,
+	isPublic,
 }: {
 	projectId: string;
 	reportId: number;
 	opts?: ReportLayoutOpts;
 	isEditing?: boolean;
+	isPublic?: boolean;
 }) => {
-	const { data, isLoading } = useProjectReport(projectId, reportId);
+	const authQuery = useProjectReport(projectId, isPublic ? -1 : reportId);
+	const publicQuery = usePublicProjectReport(
+		projectId,
+		isPublic ? reportId : -1,
+	);
+	const { data, isLoading } = isPublic ? publicQuery : authQuery;
 
 	if (isLoading) {
 		return (

echo/frontend/src/components/report/hooks/index.ts

@@ -10,6 +10,9 @@ import {
 	getProjectParticipantCount,
 	getProjectReportDetail,
 	getProjectReportViews,
+	getPublicLatestProjectReport,
+	getPublicProjectReportDetail,
+	getPublicProjectReportViews,
 	listProjectReports,
 	updateProjectReport,
 } from "@/lib/api";
@@ -119,7 +122,10 @@ export const useGetProjectParticipants = (projectId: string) => {
 	});
 };
 
-export const useDoesProjectReportNeedUpdate = (projectId: string, reportId: number) => {
+export const useDoesProjectReportNeedUpdate = (
+	projectId: string,
+	reportId: number,
+) => {
 	return useQuery({
 		enabled: !!projectId && reportId > 0,
 		queryFn: async () => {
@@ -180,7 +186,11 @@ export const useLatestProjectReport = (projectId: string) => {
 		queryKey: ["projects", projectId, "report"],
 		refetchInterval: (query) => {
 			const report = query.state.data;
-			if (report && (report.status === "draft" || report.status === "scheduled")) return 5000;
+			if (
+				report &&
+				(report.status === "draft" || report.status === "scheduled")
+			)
+				return 5000;
 			return 30000;
 		},
 	});
@@ -226,7 +236,8 @@ export const useProjectReportTimelineData = (projectReportId: string) => {
 				}),
 			);
 
-			let conversationChunkAgg: { conversation_id: string; count: number }[] = [];
+			let conversationChunkAgg: { conversation_id: string; count: number }[] =
+				[];
 			if (conversations.length > 0) {
 				const conversationIds = conversations.map((c) => c.id);
 				const chunkCountsAgg = await directus.request<
@@ -241,7 +252,9 @@ export const useProjectReportTimelineData = (projectReportId: string) => {
 				conversationChunkAgg = chunkCountsAgg;
 			}
 
-			const projectReportMetrics = await directus.request<ProjectReportMetric[]>(
+			const projectReportMetrics = await directus.request<
+				ProjectReportMetric[]
+			>(
 				readItems("project_report_metric", {
 					fields: ["id", "date_created", "project_report_id"],
 					filter: {
@@ -279,5 +292,32 @@ export const useProjectReportTimelineData = (projectReportId: string) => {
 	});
 };
 
-export { useReportProgress } from "./useReportProgress";
+export const usePublicLatestProjectReport = (projectId: string) => {
+	return useQuery({
+		enabled: !!projectId,
+		queryFn: () => getPublicLatestProjectReport(projectId),
+		queryKey: ["public", "projects", projectId, "report"],
+		refetchInterval: 30000,
+	});
+};
+
+export const usePublicProjectReport = (projectId: string, reportId: number) => {
+	return useQuery({
+		enabled: !!projectId && reportId > 0,
+		queryFn: () => getPublicProjectReportDetail(projectId, reportId),
+		queryKey: ["public", "reports", reportId],
+		refetchInterval: 30000,
+	});
+};
+
+export const usePublicProjectReportViews = (projectId: string) => {
+	return useQuery({
+		enabled: !!projectId,
+		queryFn: () => getPublicProjectReportViews(projectId),
+		queryKey: ["public", "projects", projectId, "views"],
+		refetchInterval: 30000,
+	});
+};
+
 export type { ReportProgressEvent } from "./useReportProgress";
+export { useReportProgress } from "./useReportProgress";