yusufipek/OpenFrame
1
0
Fork 0
mirror of https://github.com/yusufipk/OpenFrame.git synced 2026-09-12 09:56:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(invitations): guide invited users without an account through sign-up

Browse Source 
Clicking an invitation link while signed out dropped the visitor on a bare login form,
even though most invitees have no account yet and nothing on screen told them to create one.

Signed-out visitors now get the invitation itself: who invited them, which workspace/project,
which role, and which address it was sent to. The primary call to action follows whether an
account already exists for that address — "Create your account" when it does not, "Sign in to
accept" when it does.

The sign-up path carries the invitation forward, so a new account lands back on the invitation
and from there on the shared workspace/project instead of the onboarding wizard:
- the register link passes invitationToken, the invited email and a callbackUrl
- the register form locks the email to the invited address and shows what is being joined
- the verification email round-trips the destination through a sanitized `next` parameter
- login and verify-email keep the pending destination in their sign-in links

Signing in with a different address than the one invited now explains the mismatch instead of
silently redirecting to the dashboard.

Callback sanitization moves to lib/safe-redirect.ts so login, register, verify-email and the
verification route share one open-redirect guard.
This commit is contained in:
yusufipk
2026-07-25 18:44:02 +07:00
parent a14eb9fb84
commit 9c75ce91e1
11 changed files with 424 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/(auth)/register/register-page-client.tsx
+56 -8
View File
@@ -9,24 +9,49 @@ import { Button } from '@/components/ui/button';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { getSafeCallbackUrl } from '@/lib/safe-redirect';
export interface RegisterInvitation {
email: string;
inviterName: string;
roleLabel: string;
scopeLabel: string;
targetName: string | null;
}
interface RegisterPageClientProps {
requireInviteCode: boolean;
googleEnabled: boolean;
githubEnabled: boolean;
invitation?: RegisterInvitation | null;
}
export default function RegisterPageClient({
requireInviteCode,
googleEnabled,
githubEnabled,
invitation = null,
}: RegisterPageClientProps) {
const router = useRouter();
const searchParams = useSearchParams();
const invitationToken = useMemo(() => searchParams.get('invitationToken') || '', [searchParams]);
const invitedEmail = useMemo(() => searchParams.get('email') || '', [searchParams]);
const invitedEmail = useMemo(
() => invitation?.email || searchParams.get('email') || '',
[invitation, searchParams]
);
// Where to send the user once they are signed in — for invitations this points back
// at /invitations/accept so they land on the workspace/project they were invited to
// instead of the onboarding wizard.
const callbackUrl = useMemo(
() => getSafeCallbackUrl(searchParams.get('callbackUrl')),
[searchParams]
);
const isInvitationFlow = invitationToken.length > 0;
const shouldShowInviteCode = requireInviteCode && !isInvitationFlow;
const loginHref =
callbackUrl === '/dashboard'
? '/login'
: `/login?callbackUrl=${encodeURIComponent(callbackUrl)}`;
const [isLoading, setIsLoading] = useState(false);
const [oauthLoading, setOauthLoading] = useState<string | null>(null);
const [error, setError] = useState('');
@@ -91,10 +116,11 @@ export default function RegisterPageClient({
return;
}
const callbackParam = `&callbackUrl=${encodeURIComponent(callbackUrl)}`;
if (data.data?.emailVerificationRequired) {
router.push(`/verify-email?email=${encodeURIComponent(formData.email)}`);
router.push(`/verify-email?email=${encodeURIComponent(formData.email)}${callbackParam}`);
} else {
router.push('/login?registered=true');
router.push(`/login?registered=true${callbackParam}`);
}
} catch {
setError('Something went wrong. Please try again.');
@@ -106,7 +132,7 @@ export default function RegisterPageClient({
const handleOAuthSignUp = async (provider: string) => {
setOauthLoading(provider);
setError('');
await signIn(provider, { callbackUrl: '/dashboard' });
await signIn(provider, { callbackUrl });
};
const hasOAuth = googleEnabled || githubEnabled;
@@ -204,9 +230,24 @@ export default function RegisterPageClient({
)}
<form onSubmit={handleRegister} className="space-y-4">
{isInvitationFlow ? (
<div className="p-3 rounded-md bg-primary/10 text-sm">
You are registering via an invitation link.
{isInvitationFlow && invitation ? (
<div className="p-3 rounded-md bg-primary/10 text-sm space-y-1">
<p>
{invitation.inviterName} invited you to{' '}
<strong>
{invitation.targetName
? `${invitation.targetName} (${invitation.scopeLabel})`
: `a ${invitation.scopeLabel}`}
</strong>{' '}
as {invitation.roleLabel}.
</p>
<p className="text-muted-foreground">
Create your account below — you&apos;ll be taken straight to it.
</p>
</div>
) : isInvitationFlow ? (
<div className="p-3 rounded-md bg-amber-500/10 text-sm">
This invitation link is no longer valid. Ask whoever invited you for a new one.
</div>
) : shouldShowInviteCode ? (
<>
@@ -261,7 +302,14 @@ export default function RegisterPageClient({
onChange={handleChange}
required
disabled={isLoading}
readOnly={Boolean(invitation)}
className={invitation ? 'bg-muted text-muted-foreground' : undefined}
/>
{invitation && (
<p className="text-xs text-muted-foreground">
The invitation is tied to this address.
</p>
)}
</div>
<div className="space-y-2">
@@ -307,7 +355,7 @@ export default function RegisterPageClient({
<p className="text-center text-sm text-muted-foreground mt-6">
Already have an account?{' '}
<Link href="/login" className="text-primary hover:underline">
<Link href={loginHref} className="text-primary hover:underline">
Sign in
</Link>
</p>