Claudio/fix hydration

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/controls/[controlId]/page.tsx

@@ -49,7 +49,7 @@ export default async function SingleControlPage({ params }: PageProps) {
 					label: "Controls",
 					href: `/${session.session.activeOrganizationId}/controls`,
 				},
-				{ label: control.name },
+				{ label: control.name, current: true },
 			]}
 		>
 			<SingleControl control={control} controlProgress={controlProgress} />

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/controls/page.tsx

@@ -9,45 +9,45 @@ import { getControls } from "./data/queries";
 import { ControlsTable } from "./components/controls-table";
 
 interface ControlTableProps {
-  params: Promise<{ locale: string }>;
-  searchParams: Promise<SearchParams>;
+	params: Promise<{ locale: string }>;
+	searchParams: Promise<SearchParams>;
 }
 
 export default async function ControlsPage({
-  params,
-  ...props
+	params,
+	...props
 }: ControlTableProps) {
-  const { locale } = await params;
-  const searchParams = await props.searchParams;
-  const search = searchParamsCache.parse(searchParams);
-  const validFilters = getValidFilters(search.filters);
-  setStaticParamsLocale(locale);
+	const { locale } = await params;
+	const searchParams = await props.searchParams;
+	const search = searchParamsCache.parse(searchParams);
+	const validFilters = getValidFilters(search.filters);
+	setStaticParamsLocale(locale);
 
-  const promises = Promise.all([
-    getControls({
-      ...search,
-      filters: validFilters,
-    }),
-  ]);
+	const promises = Promise.all([
+		getControls({
+			...search,
+			filters: validFilters,
+		}),
+	]);
 
-  return (
-    <PageWithBreadcrumb breadcrumbs={[{ label: "Controls" }]}>
-      <ControlsTable promises={promises} />
-    </PageWithBreadcrumb>
-  );
+	return (
+		<PageWithBreadcrumb breadcrumbs={[{ label: "Controls" }]}>
+			<ControlsTable promises={promises} />
+		</PageWithBreadcrumb>
+	);
 }
 
 export async function generateMetadata({
-  params,
+	params,
 }: {
-  params: Promise<{ locale: string }>;
+	params: Promise<{ locale: string }>;
 }): Promise<Metadata> {
-  const { locale } = await params;
+	const { locale } = await params;
 
-  setStaticParamsLocale(locale);
-  const t = await getI18n();
+	setStaticParamsLocale(locale);
+	const t = await getI18n();
 
-  return {
-    title: t("sidebar.policies"),
-  };
-}
+	return {
+		title: t("sidebar.policies"),
+	};
+}

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/(overview)/data/getEvidenceDashboard.ts

@@ -1,12 +1,22 @@
-import type { Departments, Evidence } from "@comp/db/types";
+import type {
+	Departments,
+	Evidence,
+	EvidenceStatus,
+	Member,
+	User,
+	Frequency,
+} from "@comp/db/types";
 import { db } from "@comp/db";
 import { cache } from "react";
 
-export type EvidenceStatus = "empty" | "draft" | "needsReview" | "upToDate";
+// Only define the dashboard-specific status which isn't in DB
+type DashboardStatus = "empty" | "draft" | "needsReview" | "upToDate";
 
-export interface EvidenceWithStatus extends Omit<Evidence, "assignee"> {
-	status: EvidenceStatus;
+// Extend the Evidence type with only what's needed for the dashboard
+interface EvidenceWithStatus extends Omit<Evidence, "status"> {
+	status: DashboardStatus;
 	assigneeEmail?: string;
+	dbStatus?: EvidenceStatus | null;
 }
 
 export interface EvidenceDashboardData {
@@ -35,7 +45,11 @@ export const getEvidenceDashboard = cache(
 				organizationId,
 			},
 			include: {
-				assignee: true,
+				assignee: {
+					include: {
+						user: true,
+					},
+				},
 			},
 		});
 
@@ -82,7 +96,7 @@ export const getEvidenceDashboard = cache(
 
 			const isPastDue = nextReviewDate && nextReviewDate < now;
 
-			let status: EvidenceStatus;
+			let status: DashboardStatus;
 
 			if (!hasContent && !isPublished) {
 				// No files or links
@@ -103,15 +117,13 @@ export const getEvidenceDashboard = cache(
 			}
 
 			// Extract assignee email if available
-			const assigneeEmail = item.assignee?.email || undefined;
-
-			// Create a new object without the assignee property
-			const { assignee, ...evidenceWithoutAssignee } = item;
+			const assigneeEmail = item.assignee?.user?.email || undefined;
 
 			return {
-				...evidenceWithoutAssignee,
+				...item,
 				status,
 				assigneeEmail,
+				dbStatus: item.status,
 			};
 		});
 
@@ -173,7 +185,7 @@ export const getEvidenceDashboard = cache(
 		if (firstAssigneeEmail) {
 			const firstAssigneeItems = byAssignee[firstAssigneeEmail];
 			// Count items by status for the first assignee
-			const statusCounts = {
+			const statusCounts: Record<DashboardStatus, number> = {
 				empty: 0,
 				draft: 0,
 				needsReview: 0,

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[id]/PathProvider.tsx → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[evidenceId]/PathProvider.tsx

@@ -55,7 +55,7 @@ export function PathProvider({
 				},
 			]}
 			showBackButton={showBackButton}
-			backButtonHref={`/${organizationId}/evidence/list`}
+			backButtonHref={`/${organizationId}/evidence/all`}
 			backButtonLabel={translationBackButton}
 		/>
 	);

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[id]/components/EditEvidenceForm.tsx → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[evidenceId]/components/EditEvidenceForm.tsx

@@ -9,8 +9,8 @@ import { UrlSection } from "./UrlSection";
 import { useEvidence } from "../hooks/useEvidence";
 
 export function EditEvidenceForm() {
-	const { id } = useParams<{ id: string }>();
-	const { data, isLoading, error, mutate } = useEvidence({ id });
+	const { evidenceId } = useParams<{ evidenceId: string }>();
+	const { data, isLoading, error, mutate } = useEvidence({ id: evidenceId });
 	const t = useI18n();
 
 	if (isLoading) {
@@ -46,13 +46,13 @@ export function EditEvidenceForm() {
 			</CardHeader>
 			<CardContent className="space-y-6">
 				<FileSection
-					evidenceId={id}
+					evidenceId={evidenceId}
 					fileUrls={evidence.fileUrls}
 					onSuccess={handleMutate}
 				/>
 
 				<UrlSection
-					evidenceId={id}
+					evidenceId={evidenceId}
 					additionalUrls={evidence.additionalUrls}
 					onSuccess={handleMutate}
 				/>

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[id]/components/EvidenceDetails.tsx → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[evidenceId]/components/EvidenceDetails.tsx

@@ -5,6 +5,7 @@ import { FileIcon } from "lucide-react";
 import type { EvidenceDetailsProps } from "../types";
 import { EditEvidenceForm } from "./EditEvidenceForm";
 import { ReviewSection } from "./ReviewSection";
+import PageWithBreadcrumb from "@/components/pages/PageWithBreadcrumb";
 
 export function EvidenceDetails({ assignees, evidence }: EvidenceDetailsProps) {
 	return (

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[id]/components/ReviewSection.tsx → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[evidenceId]/components/ReviewSection.tsx

@@ -25,9 +25,11 @@ import { SelectAssignee } from "../../../components/SelectAssignee";
 
 interface ReviewSectionProps {
 	evidence: Evidence & {
-		assignee: Member & {
-			user: User;
-		};
+		assignee?:
+			| (Member & {
+					user: User;
+			  })
+			| null;
 	};
 	lastPublishedAt: Date | null;
 	frequency: Frequency | null;

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[id]/page.tsx → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[evidenceId]/page.tsx

@@ -1,21 +1,31 @@
+import { auth } from "@comp/auth";
 import { db } from "@comp/db";
-import { EvidenceDetails } from "./components/EvidenceDetails";
 import { headers } from "next/headers";
-import { auth } from "@comp/auth";
-
+import { EvidenceDetails } from "./components/EvidenceDetails";
+import PageWithBreadcrumb from "@/components/pages/PageWithBreadcrumb";
 interface EvidencePageProps {
 	params: Promise<{
-		id: string;
+		evidenceId: string;
+		orgId: string;
 	}>;
 }
 
 export default async function EvidencePage({ params }: EvidencePageProps) {
-	const { id } = await params;
+	const { evidenceId, orgId } = await params;
 
 	const assignees = await getAssignees();
-	const evidence = await getEvidence(id);
+	const evidence = await getEvidence(evidenceId);
 
-	return <EvidenceDetails assignees={assignees} evidence={evidence} />;
+	return (
+		<PageWithBreadcrumb
+			breadcrumbs={[
+				{ label: "Evidence", href: `/${orgId}/evidence/all` },
+				{ label: evidence.name, current: true },
+			]}
+		>
+			<EvidenceDetails assignees={assignees} evidence={evidence} />
+		</PageWithBreadcrumb>
+	);
 }
 
 const getAssignees = async () => {
@@ -50,7 +60,11 @@ const getEvidence = async (id: string) => {
 			id,
 		},
 		include: {
-			assignee: true,
+			assignee: {
+				include: {
+					user: true,
+				},
+			},
 		},
 	});
 

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[id]/types.ts → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/[evidenceId]/types.ts

@@ -21,12 +21,12 @@ export interface UploadFileResponse
 	}> {}
 
 export interface EvidenceDetailsProps {
-	assignees: (Member & {
-		user: User;
-	})[];
 	evidence: Evidence & {
-		assignee: Member & {
-			user: User;
-		};
+		assignee?:
+			| (Member & {
+					user: User;
+			  })
+			| null;
 	};
+	assignees: Array<Member & { user: User }>;
 }

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/list/page.tsx → apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/evidence/all/page.tsx

@@ -1,10 +1,12 @@
 import { EvidenceList } from "./components/EvidenceList";
 import { EvidenceTableProvider } from "./hooks/useEvidenceTableContext";
-
+import PageWithBreadcrumb from "@/components/pages/PageWithBreadcrumb";
 export default function EvidencePage() {
 	return (
 		<EvidenceTableProvider>
-			<EvidenceList />
+			<PageWithBreadcrumb breadcrumbs={[{ label: "Evidence", current: true }]}>
+				<EvidenceList />
+			</PageWithBreadcrumb>
 		</EvidenceTableProvider>
 	);
 }