diff --git a/packages/streamwall-control-server/src/index.ts b/packages/streamwall-control-server/src/index.ts
index c0c5a91..503310a 100644
--- a/packages/streamwall-control-server/src/index.ts
+++ b/packages/streamwall-control-server/src/index.ts
@@ -372,12 +372,12 @@ async function initApp({ baseURL, clientStaticPath }: AppOptions) {
 
           if (msg.type === 'create-invite') {
             console.debug('Creating invite for role:', msg.role)
-            const { secret } = await auth.createToken({
+            const { tokenId, secret } = await auth.createToken({
               kind: 'invite',
               role: msg.role as StreamwallRole,
               name: msg.name,
             })
-            respond({ name: msg.name, secret })
+            respond({ name: msg.name, secret, tokenId })
           } else if (msg.type === 'delete-token') {
             console.debug('Deleting token:', msg.tokenId)
             auth.deleteToken(msg.tokenId)
diff --git a/packages/streamwall-control-ui/src/index.tsx b/packages/streamwall-control-ui/src/index.tsx
index 837e313..373f51e 100644
--- a/packages/streamwall-control-ui/src/index.tsx
+++ b/packages/streamwall-control-ui/src/index.tsx
@@ -48,6 +48,7 @@ export interface ViewInfo {
 }
 
 interface Invite {
+  tokenId: string
   name: string
   secret: string
 }
@@ -803,7 +804,7 @@ export function ControlUI({
                     <StyledNewInviteBox>
                       Invite link created:{' '}
                       <a
-                        href={`/invite/${newInvite.secret}`}
+                        href={`/invite/${newInvite.tokenId}?token=${newInvite.secret}`}
                         onClick={preventLinkClick}
                       >
                         "{newInvite.name}"