diff --git a/.intent/tests-intent/invite-owner.spec.ts/should-invite-a-teammate-as-an-owner/invite-email-to-the-team-as-an-owner.ts b/.intent/tests-intent/invite-owner.spec.ts/should-invite-a-teammate-as-an-owner/invite-email-to-the-team-as-an-owner.ts index c19f885..cca9c06 100644 --- a/.intent/tests-intent/invite-owner.spec.ts/should-invite-a-teammate-as-an-owner/invite-email-to-the-team-as-an-owner.ts +++ b/.intent/tests-intent/invite-owner.spec.ts/should-invite-a-teammate-as-an-owner/invite-email-to-the-team-as-an-owner.ts @@ -6,5 +6,6 @@ export default async function ({ page, context, request, expect, vars }: StepCon await page.getByRole('textbox', { name: 'Email' }).fill(vars.email); await page.getByRole('radio', { name: 'Owner' }).check(); await page.getByRole('button', { name: 'Invite Member' }).click(); + await page.getByRole('button', { name: 'Yes, invite as owner' }).click(); await expect(page.getByText('Invitation sent successfully')).toBeVisible(); } diff --git a/app/(dashboard)/dashboard/page.tsx b/app/(dashboard)/dashboard/page.tsx index bb8fa1b..374fc9c 100644 --- a/app/(dashboard)/dashboard/page.tsx +++ b/app/(dashboard)/dashboard/page.tsx @@ -1,7 +1,14 @@ "use client"; import { Loader2, PlusCircle } from "lucide-react"; -import { Suspense, useActionState, useEffect } from "react"; +import { + type FormEvent, + Suspense, + startTransition, + useActionState, + useEffect, + useState, +} from "react"; import useSWR from "swr"; import { inviteTeamMember, removeTeamMember } from "@/app/(login)/actions"; import { Avatar, AvatarFallback } from "@/components/ui/avatar"; @@ -249,6 +256,7 @@ function InviteTeamMember() { ActionState, FormData >(inviteTeamMember, {}); + const [ownerInvite, setOwnerInvite] = useState(null); useEffect(() => { if (inviteState?.id) { @@ -256,13 +264,30 @@ function InviteTeamMember() { } }, [inviteState]); + const sendInvite = (formData: FormData) => { + setOwnerInvite(null); + startTransition(() => inviteAction(formData)); + }; + + // Owners can change the plan and remove members, so inviting one takes a + // second, deliberate click. + const handleSubmit = (event: FormEvent) => { + event.preventDefault(); + const formData = new FormData(event.currentTarget); + if (formData.get("role") === "owner") { + setOwnerInvite(formData); + } else { + sendInvite(formData); + } + }; + return ( Invite Team Member -
+
+ {ownerInvite && ( +
+

+ Invite {String(ownerInvite.get("email"))} as an owner? +

+

+ Owners can change the plan, manage billing and remove team + members. +

+
+ + +
+
+ )} {inviteState?.error && (

{inviteState.error}

)}