fix: construct invite URL from code on frontend

This commit is contained in:
2026-06-29 15:35:22 -04:00
parent 6a737c3db3
commit 282a436995
+11 -10
View File
@@ -7,17 +7,18 @@ interface InviteModalProps {
onClose: () => void; onClose: () => void;
} }
interface Invite { interface InviteResult {
code: string; code: string;
url: string; server_name: string;
expires_at: string | null;
max_uses: number | null; max_uses: number | null;
use_count: number;
expires_at: string | null;
} }
export function InviteModal({ serverId, serverName, onClose }: InviteModalProps) { export function InviteModal({ serverId, serverName, onClose }: InviteModalProps) {
const [expiresHours, setExpiresHours] = useState(24); const [expiresHours, setExpiresHours] = useState(24);
const [maxUses, setMaxUses] = useState<number | ''>(''); const [maxUses, setMaxUses] = useState<number | ''>('');
const [invite, setInvite] = useState<Invite | null>(null); const [invite, setInvite] = useState<InviteResult | null>(null);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
const [copied, setCopied] = useState(false); const [copied, setCopied] = useState(false);
@@ -32,7 +33,7 @@ export function InviteModal({ serverId, serverName, onClose }: InviteModalProps)
if (maxUses !== '') { if (maxUses !== '') {
payload.max_uses = maxUses; payload.max_uses = maxUses;
} }
const result = await api.post<Invite>(`/servers/${serverId}/invites`, payload); const result = await api.post<InviteResult>(`/servers/${serverId}/invites`, payload);
setInvite(result); setInvite(result);
} catch (err) { } catch (err) {
setError(err instanceof Error ? err.message : 'Failed to create invite'); setError(err instanceof Error ? err.message : 'Failed to create invite');
@@ -41,9 +42,11 @@ export function InviteModal({ serverId, serverName, onClose }: InviteModalProps)
} }
}; };
const inviteUrl = invite ? `${window.location.origin}/invites/${invite.code}` : '';
const copyLink = () => { const copyLink = () => {
if (invite) { if (inviteUrl) {
navigator.clipboard.writeText(invite.url); navigator.clipboard.writeText(inviteUrl);
setCopied(true); setCopied(true);
setTimeout(() => setCopied(false), 2000); setTimeout(() => setCopied(false), 2000);
} }
@@ -58,7 +61,6 @@ export function InviteModal({ serverId, serverName, onClose }: InviteModalProps)
</div> </div>
{!invite ? ( {!invite ? (
<>
<div className="space-y-3"> <div className="space-y-3">
<div> <div>
<label className="text-xs text-gb-fg-f block mb-1">EXPIRES IN:</label> <label className="text-xs text-gb-fg-f block mb-1">EXPIRES IN:</label>
@@ -97,14 +99,13 @@ export function InviteModal({ serverId, serverName, onClose }: InviteModalProps)
{loading ? 'CREATING...' : '[GENERATE LINK]'} {loading ? 'CREATING...' : '[GENERATE LINK]'}
</button> </button>
</div> </div>
</>
) : ( ) : (
<div className="space-y-3"> <div className="space-y-3">
<div className="text-xs text-gb-fg-f">Share this link:</div> <div className="text-xs text-gb-fg-f">Share this link:</div>
<div className="flex gap-2"> <div className="flex gap-2">
<input <input
type="text" type="text"
value={invite.url} value={inviteUrl}
readOnly readOnly
className="flex-1 px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none" className="flex-1 px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none"
/> />