apps/dashboard/src/app/(main)/(protected)/(outside-dashboard)/projects/actions.ts (3)

24-29: Ensure action return is safely serializable across boundaries.

expiresAt may be a Date; return a string to avoid ambiguity and timezone issues.

   const invitations = await team.listInvitations();
   return invitations.map(invite => ({
     id: invite.id,
     recipientEmail: invite.recipientEmail,
-    expiresAt: invite.expiresAt,
+    expiresAt: invite.expiresAt ? new Date(invite.expiresAt).toISOString() : null,
   }));

---

5-5: Redundant "use server" inside a server-marked module.

Module already has "use server" at Line 1; the inner directive is unnecessary noise.

 export async function revokeInvitation(teamId: string, invitationId: string) {
-  "use server";

---

11-15: Avoid O(n) scan if a direct revoke API exists.

If team exposes getInvitation(id) or revokeInvitation(id), prefer it over list+find for clarity and efficiency.

If not available, current approach is acceptable.

apps/dashboard/src/app/(main)/(protected)/(outside-dashboard)/projects/page-client.tsx (4)

199-201: Use inline alerts for blocking errors; avoid error toasts in dashboard.

Per app guidelines, replace destructive toasts with inline error messaging in the dialog.

Apply minimal changes using existing formError:

-      } else {
-        const message = error instanceof Error ? error.message : "Unknown error";
-        toast({ variant: "destructive", title: "Failed to send invitation", description: message });
-      }
+      } else {
+        const message = error instanceof Error ? error.message : "Unknown error";
+        setFormError(message);
+      }
@@
-    } catch (error) {
-      const message = error instanceof Error ? error.message : "Unknown error";
-      toast({ variant: "destructive", title: "Failed to start upgrade", description: message });
-    };
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Unknown error";
+      setFormError(message);
+    };

If stack-ui provides an Alert component, we can switch to that instead of the label. Based on coding guidelines.

Also applies to: 213-215

---

87-93: Remove artificial 2s delay after Create Project.

Delay hurts UX and provides no benefit here.

-          <Button
-            onClick={async () => {
-              router.push('/new-project');
-              return await wait(2000);
-            }}
-          >Create Project
-          </Button>
+          <Button onClick={() => router.push('/new-project')}>
+            Create Project
+          </Button>

---

146-152: Suspense fallback won’t show (no suspension).

TeamAddUserDialogContent doesn’t suspend; the Suspense wrapper is redundant.

-          <Suspense fallback={<TeamAddUserDialogContentSkeleton />}>
-            <TeamAddUserDialogContent
-              team={props.team}
-              onClose={() => setOpen(false)}
-            />
-          </Suspense>
+          <TeamAddUserDialogContent
+            team={props.team}
+            onClose={() => setOpen(false)}
+          />

---

179-183: Guard against missing or transient seatLimit.

Avoid crashes if admins or admins.quantity are undefined during load.

-  const activeSeats = users.length + (invitations?.length ?? 0);
-  const seatLimit = admins.quantity;
-  const atCapacity = activeSeats >= seatLimit;
+  const activeSeats = users.length + (invitations?.length ?? 0);
+  const seatLimit = admins?.quantity ?? Infinity;
+  const atCapacity = Number.isFinite(seatLimit) ? activeSeats >= seatLimit : false;

Confirm that users refers to “dashboard admins” and that invitations are only for admin seats; otherwise counting may be inflated.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

apps/dashboard/src/app/(main)/(protected)/(outside-dashboard)/projects/page-client.tsx (3)

164-167: Add error handling to fetchInvitations.

The fetchInvitations callback lacks error handling. If listInvitations fails, the error propagates to callers (lines 203, 281) without handling, potentially leaving the UI in an inconsistent state or causing unhandled promise rejections.

Apply this diff to add error handling:

 const fetchInvitations = useCallback(async () => {
-  const invitations = await listInvitations(props.team.id);
-  setInvitations(invitations);
+  try {
+    const invitations = await listInvitations(props.team.id);
+    setInvitations(invitations);
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Unknown error";
+    alert("Failed to load invitations: " + message);
+    setInvitations([]);
+  }
 }, [props.team.id]);

---

200-200: Remove client-side callbackUrl parameter for security.

Passing window.location.origin from the client is a security risk as it can be spoofed. The server should compute a safe callback URL based on the request origin or a configured whitelist.

However, the server action signature in actions.ts still expects three parameters. First update the server action to compute the callback URL safely, then apply this diff:

-      await inviteUser(props.team.id, values.email, window.location.origin);
+      await inviteUser(props.team.id, values.email);

---

279-282: Use runAsynchronouslyWithAlert for async button handler.

The revoke button's onClick handler is an async arrow function without error handling, which can cause unhandled promise rejections if revokeInvitation fails. According to codebase learnings, async button click handlers should use runAsynchronouslyWithAlert to automatically handle errors and show alerts to users.

Based on learnings

Apply this diff:

                   <Button
                     variant="ghost"
                     size="sm"
-                    onClick={async () => {
+                    onClick={() => runAsynchronouslyWithAlert(async () => {
                       await revokeInvitation(props.team.id, invitation.id);
                       await fetchInvitations();
-                    }}
+                    })}
                   >

apps/dashboard/src/app/(main)/(protected)/(outside-dashboard)/projects/page-client.tsx (2)

301-307: Consider using runAsynchronouslyWithAlert directly in button handlers.

The button onClick handlers currently call async functions with manual try/catch blocks. According to codebase learnings, async button click handlers should use runAsynchronouslyWithAlert to automatically handle errors and show alerts. This would simplify the code and ensure consistent error handling.

Based on learnings

Example for the Invite button:

-        <Button onClick={handleInvite}>
+        <Button onClick={() => runAsynchronouslyWithAlert(async () => {
+          setFormError(null);
+          const values = await inviteFormSchema.validate({ email: email.trim() });
+          await inviteUser(props.team.id, values.email);
+          setEmail("");
+          await fetchInvitations();
+        })}>
           Invite
         </Button>

Note: You would need to handle validation errors separately with a try/catch around the validate call, or use runAsynchronouslyWithAlert's error handler option.

---

88-93: Clarify or remove the 2-second wait after navigation.

The await wait(2000) after router.push('/new-project') seems unusual. If this is intentional (e.g., to show a loading state), please add a comment explaining why. Otherwise, consider removing it.

           <Button
             onClick={async () => {
               router.push('/new-project');
-              return await wait(2000);
             }}
           >Create Project

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Learnt from: N2D4
PR: stack-auth/stack-auth#943
File: examples/convex/app/action/page.tsx:23-28
Timestamp: 2025-10-11T04:13:19.308Z
Learning: In the stack-auth codebase, use `runAsynchronouslyWithAlert` from `stackframe/stack-shared/dist/utils/promises` for async button click handlers and form submissions instead of manual try/catch blocks. This utility automatically handles errors and shows alerts to users.

Learnt from: CR
PR: stack-auth/stack-auth#0
File: AGENTS.md:0-0
Timestamp: 2025-10-20T22:25:40.427Z
Learning: Applies to packages/{stack-ui,react}/**/*.{tsx,jsx} : For blocking alerts and errors in shared/UI packages, never use toast; use alerts instead

Learnt from: CR
PR: stack-auth/stack-auth#0
File: AGENTS.md:0-0
Timestamp: 2025-10-20T22:25:40.427Z
Learning: Applies to apps/{dashboard,dev-launchpad}/**/*.{tsx,jsx} : For blocking alerts and errors in the UI, never use toast; use alerts instead