LobotomyLabs/dumpsterChat
2
0
Fork 0
Code Issues Pull Requests Actions Packages Releases 1 Wiki Activity

fix: construct invite URL from code on frontend

Browse Source
This commit is contained in:
Dustin Newkirk
2026-06-29 15:35:22 -04:00
parent 6a737c3db3
commit 282a436995
1 changed files with 47 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/components/InviteModal.tsx
+47 -46
View File
@@ -7,17 +7,18 @@ interface InviteModalProps {
onClose: () => void;
}
interface Invite {
interface InviteResult {
code: string;
url: string;
expires_at: string | null;
server_name: string;
max_uses: number | null;
use_count: number;
expires_at: string | null;
}
export function InviteModal({ serverId, serverName, onClose }: InviteModalProps) {
const [expiresHours, setExpiresHours] = useState(24);
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 [error, setError] = useState<string | null>(null);
const [copied, setCopied] = useState(false);
@@ -32,7 +33,7 @@ export function InviteModal({ serverId, serverName, onClose }: InviteModalProps)
if (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);
} catch (err) {
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 = () => {
if (invite) {
navigator.clipboard.writeText(invite.url);
if (inviteUrl) {
navigator.clipboard.writeText(inviteUrl);
setCopied(true);
setTimeout(() => setCopied(false), 2000);
}
@@ -58,53 +61,51 @@ export function InviteModal({ serverId, serverName, onClose }: InviteModalProps)
</div>
{!invite ? (
<>
<div className="space-y-3">
<div>
<label className="text-xs text-gb-fg-f block mb-1">EXPIRES IN:</label>
<select
value={expiresHours}
onChange={(e) => setExpiresHours(Number(e.target.value))}
className="w-full px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none"
>
<option value={1}>1 hour</option>
<option value={6}>6 hours</option>
<option value={12}>12 hours</option>
<option value={24}>24 hours</option>
<option value={168}>7 days</option>
<option value={0}>Never</option>
</select>
</div>
<div>
<label className="text-xs text-gb-fg-f block mb-1">MAX USES:</label>
<input
type="number"
value={maxUses}
onChange={(e) => setMaxUses(e.target.value === '' ? '' : Number(e.target.value))}
placeholder="unlimited"
min={1}
className="w-full px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none"
/>
</div>
{error && (
<div className="text-xs text-gb-red">{error}</div>
)}
<button
onClick={createInvite}
disabled={loading}
className="w-full px-3 py-1.5 bg-gb-orange text-gb-bg text-xs font-mono hover:bg-gb-yellow transition-colors disabled:opacity-50"
<div className="space-y-3">
<div>
<label className="text-xs text-gb-fg-f block mb-1">EXPIRES IN:</label>
<select
value={expiresHours}
onChange={(e) => setExpiresHours(Number(e.target.value))}
className="w-full px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none"
>
{loading ? 'CREATING...' : '[GENERATE LINK]'}
</button>
<option value={1}>1 hour</option>
<option value={6}>6 hours</option>
<option value={12}>12 hours</option>
<option value={24}>24 hours</option>
<option value={168}>7 days</option>
<option value={0}>Never</option>
</select>
</div>
</>
<div>
<label className="text-xs text-gb-fg-f block mb-1">MAX USES:</label>
<input
type="number"
value={maxUses}
onChange={(e) => setMaxUses(e.target.value === '' ? '' : Number(e.target.value))}
placeholder="unlimited"
min={1}
className="w-full px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none"
/>
</div>
{error && (
<div className="text-xs text-gb-red">{error}</div>
)}
<button
onClick={createInvite}
disabled={loading}
className="w-full px-3 py-1.5 bg-gb-orange text-gb-bg text-xs font-mono hover:bg-gb-yellow transition-colors disabled:opacity-50"
>
{loading ? 'CREATING...' : '[GENERATE LINK]'}
</button>
</div>
) : (
<div className="space-y-3">
<div className="text-xs text-gb-fg-f">Share this link:</div>
<div className="flex gap-2">
<input
type="text"
value={invite.url}
value={inviteUrl}
readOnly
className="flex-1 px-2 py-1 bg-gb-bg-s text-gb-fg text-xs border-none outline-none"
/>