Rephl3x/Magent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Build 2602261409: unify invite management controls

Browse Source
This commit is contained in:
Zak Bearman
2026-02-26 14:10:18 +13:00
parent f78382c019
commit ec408df2a1
6 changed files with 516 additions and 586 deletions
Download Patch File Download Diff File Expand all files Collapse all files

576
frontend/app/admin/invites/page.tsx
View File

@@ -5,9 +5,24 @@ import { useRouter } from 'next/navigation'
import AdminShell from '../../ui/AdminShell'
import { authFetch, clearToken, getApiBase, getToken } from '../../lib/auth'
type ProfileOption = {
type AdminUserLite = {
id: number
username: string
role: string
profile_id?: number | null
expires_at?: string | null
}
type Profile = {
id: number
name: string
description?: string | null
role: 'user' | 'admin'
auto_search_enabled: boolean
account_expires_days?: number | null
is_active: boolean
assigned_users?: number
assigned_invites?: number
}
type Invite = {
@@ -16,7 +31,7 @@ type Invite = {
label?: string | null
description?: string | null
profile_id?: number | null
profile?: ProfileOption | null
profile?: { id: number; name: string } | null
role?: 'user' | 'admin' | null
max_uses?: number | null
use_count: number
@@ -39,7 +54,16 @@ type InviteForm = {
expires_at: string
}
const defaultForm = (): InviteForm => ({
type ProfileForm = {
name: string
description: string
role: 'user' | 'admin'
auto_search_enabled: boolean
account_expires_days: string
is_active: boolean
}
const defaultInviteForm = (): InviteForm => ({
code: '',
label: '',
description: '',
@@ -50,6 +74,15 @@ const defaultForm = (): InviteForm => ({
expires_at: '',
})
const defaultProfileForm = (): ProfileForm => ({
name: '',
description: '',
role: 'user',
auto_search_enabled: true,
account_expires_days: '',
is_active: true,
})
const formatDate = (value?: string | null) => {
if (!value) return 'Never'
const date = new Date(value)
@@ -57,16 +90,29 @@ const formatDate = (value?: string | null) => {
return date.toLocaleString()
}
export default function AdminInvitesPage() {
export default function AdminInviteManagementPage() {
const router = useRouter()
const [invites, setInvites] = useState<Invite[]>([])
const [profiles, setProfiles] = useState<ProfileOption[]>([])
const [profiles, setProfiles] = useState<Profile[]>([])
const [users, setUsers] = useState<AdminUserLite[]>([])
const [loading, setLoading] = useState(true)
const [saving, setSaving] = useState(false)
const [inviteSaving, setInviteSaving] = useState(false)
const [profileSaving, setProfileSaving] = useState(false)
const [bulkProfileBusy, setBulkProfileBusy] = useState(false)
const [bulkExpiryBusy, setBulkExpiryBusy] = useState(false)
const [error, setError] = useState<string | null>(null)
const [status, setStatus] = useState<string | null>(null)
const [editingId, setEditingId] = useState<number | null>(null)
const [form, setForm] = useState<InviteForm>(defaultForm())
const [inviteEditingId, setInviteEditingId] = useState<number | null>(null)
const [inviteForm, setInviteForm] = useState<InviteForm>(defaultInviteForm())
const [profileEditingId, setProfileEditingId] = useState<number | null>(null)
const [profileForm, setProfileForm] = useState<ProfileForm>(defaultProfileForm())
const [bulkProfileId, setBulkProfileId] = useState('')
const [bulkExpiryDays, setBulkExpiryDays] = useState('')
const signupBaseUrl = useMemo(() => {
if (typeof window === 'undefined') return '/signup'
@@ -95,9 +141,10 @@ export default function AdminInvitesPage() {
setError(null)
try {
const baseUrl = getApiBase()
const [inviteRes, profileRes] = await Promise.all([
const [inviteRes, profileRes, usersRes] = await Promise.all([
authFetch(`${baseUrl}/admin/invites`),
authFetch(`${baseUrl}/admin/profiles`),
authFetch(`${baseUrl}/admin/users`),
])
if (!inviteRes.ok) {
if (handleAuthResponse(inviteRes)) return
@@ -107,18 +154,21 @@ export default function AdminInvitesPage() {
if (handleAuthResponse(profileRes)) return
throw new Error(`Failed to load profiles (${profileRes.status})`)
}
const [inviteData, profileData] = await Promise.all([inviteRes.json(), profileRes.json()])
if (!usersRes.ok) {
if (handleAuthResponse(usersRes)) return
throw new Error(`Failed to load users (${usersRes.status})`)
}
const [inviteData, profileData, usersData] = await Promise.all([
inviteRes.json(),
profileRes.json(),
usersRes.json(),
])
setInvites(Array.isArray(inviteData?.invites) ? inviteData.invites : [])
const profileRows = Array.isArray(profileData?.profiles) ? profileData.profiles : []
setProfiles(
profileRows.map((profile: any) => ({
id: Number(profile.id ?? 0),
name: String(profile.name ?? 'Unnamed'),
}))
)
setProfiles(Array.isArray(profileData?.profiles) ? profileData.profiles : [])
setUsers(Array.isArray(usersData?.users) ? usersData.users : [])
} catch (err) {
console.error(err)
setError('Could not load invites.')
setError('Could not load invite management data.')
} finally {
setLoading(false)
}
@@ -128,14 +178,14 @@ export default function AdminInvitesPage() {
void loadData()
}, [])
const resetEditor = () => {
setEditingId(null)
setForm(defaultForm())
const resetInviteEditor = () => {
setInviteEditingId(null)
setInviteForm(defaultInviteForm())
}
const editInvite = (invite: Invite) => {
setEditingId(invite.id)
setForm({
setInviteEditingId(invite.id)
setInviteForm({
code: invite.code ?? '',
label: invite.label ?? '',
description: invite.description ?? '',
@@ -154,25 +204,27 @@ export default function AdminInvitesPage() {
const saveInvite = async (event: React.FormEvent) => {
event.preventDefault()
setSaving(true)
setInviteSaving(true)
setError(null)
setStatus(null)
try {
const baseUrl = getApiBase()
const payload = {
code: form.code || null,
label: form.label || null,
description: form.description || null,
profile_id: form.profile_id || null,
role: form.role || null,
max_uses: form.max_uses || null,
enabled: form.enabled,
expires_at: form.expires_at || null,
code: inviteForm.code || null,
label: inviteForm.label || null,
description: inviteForm.description || null,
profile_id: inviteForm.profile_id || null,
role: inviteForm.role || null,
max_uses: inviteForm.max_uses || null,
enabled: inviteForm.enabled,
expires_at: inviteForm.expires_at || null,
}
const url =
editingId == null ? `${baseUrl}/admin/invites` : `${baseUrl}/admin/invites/${editingId}`
inviteEditingId == null
? `${baseUrl}/admin/invites`
: `${baseUrl}/admin/invites/${inviteEditingId}`
const response = await authFetch(url, {
method: editingId == null ? 'POST' : 'PUT',
method: inviteEditingId == null ? 'POST' : 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(payload),
})
@@ -181,14 +233,14 @@ export default function AdminInvitesPage() {
const text = await response.text()
throw new Error(text || 'Save failed')
}
setStatus(editingId == null ? 'Invite created.' : 'Invite updated.')
resetEditor()
setStatus(inviteEditingId == null ? 'Invite created.' : 'Invite updated.')
resetInviteEditor()
await loadData()
} catch (err) {
console.error(err)
setError(err instanceof Error ? err.message : 'Could not save invite.')
} finally {
setSaving(false)
setInviteSaving(false)
}
}
@@ -206,7 +258,7 @@ export default function AdminInvitesPage() {
const text = await response.text()
throw new Error(text || 'Delete failed')
}
if (editingId === invite.id) resetEditor()
if (inviteEditingId === invite.id) resetInviteEditor()
setStatus(`Deleted invite ${invite.code}.`)
await loadData()
} catch (err) {
@@ -230,27 +282,412 @@ export default function AdminInvitesPage() {
}
}
const resetProfileEditor = () => {
setProfileEditingId(null)
setProfileForm(defaultProfileForm())
}
const editProfile = (profile: Profile) => {
setProfileEditingId(profile.id)
setProfileForm({
name: profile.name ?? '',
description: profile.description ?? '',
role: profile.role ?? 'user',
auto_search_enabled: Boolean(profile.auto_search_enabled),
account_expires_days:
typeof profile.account_expires_days === 'number' ? String(profile.account_expires_days) : '',
is_active: profile.is_active !== false,
})
setStatus(null)
setError(null)
}
const saveProfile = async (event: React.FormEvent) => {
event.preventDefault()
setProfileSaving(true)
setError(null)
setStatus(null)
try {
const baseUrl = getApiBase()
const payload = {
name: profileForm.name,
description: profileForm.description || null,
role: profileForm.role,
auto_search_enabled: profileForm.auto_search_enabled,
account_expires_days: profileForm.account_expires_days || null,
is_active: profileForm.is_active,
}
const url =
profileEditingId == null
? `${baseUrl}/admin/profiles`
: `${baseUrl}/admin/profiles/${profileEditingId}`
const response = await authFetch(url, {
method: profileEditingId == null ? 'POST' : 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(payload),
})
if (!response.ok) {
if (handleAuthResponse(response)) return
const text = await response.text()
throw new Error(text || 'Save failed')
}
setStatus(profileEditingId == null ? 'Profile created.' : 'Profile updated.')
resetProfileEditor()
await loadData()
} catch (err) {
console.error(err)
setError(err instanceof Error ? err.message : 'Could not save profile.')
} finally {
setProfileSaving(false)
}
}
const deleteProfile = async (profile: Profile) => {
if (!window.confirm(`Delete profile "${profile.name}"?`)) return
setError(null)
setStatus(null)
try {
const baseUrl = getApiBase()
const response = await authFetch(`${baseUrl}/admin/profiles/${profile.id}`, {
method: 'DELETE',
})
if (!response.ok) {
if (handleAuthResponse(response)) return
const text = await response.text()
throw new Error(text || 'Delete failed')
}
if (profileEditingId === profile.id) resetProfileEditor()
if (bulkProfileId === String(profile.id)) setBulkProfileId('')
setStatus(`Deleted profile "${profile.name}".`)
await loadData()
} catch (err) {
console.error(err)
setError(err instanceof Error ? err.message : 'Could not delete profile.')
}
}
const bulkApplyProfile = async () => {
setBulkProfileBusy(true)
setStatus(null)
setError(null)
try {
const baseUrl = getApiBase()
const response = await authFetch(`${baseUrl}/admin/users/profile/bulk`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
profile_id: bulkProfileId || null,
scope: 'non-admin-users',
}),
})
if (!response.ok) {
if (handleAuthResponse(response)) return
const text = await response.text()
throw new Error(text || 'Bulk profile update failed')
}
const data = await response.json()
setStatus(
bulkProfileId
? `Applied profile ${bulkProfileId} to ${data?.updated ?? 0} non-admin users.`
: `Cleared profile assignment for ${data?.updated ?? 0} non-admin users.`
)
await loadData()
} catch (err) {
console.error(err)
setError(err instanceof Error ? err.message : 'Could not apply profile to all users.')
} finally {
setBulkProfileBusy(false)
}
}
const bulkSetExpiryDays = async () => {
if (!bulkExpiryDays.trim()) {
setError('Enter expiry days before applying bulk expiry.')
return
}
setBulkExpiryBusy(true)
setStatus(null)
setError(null)
try {
const baseUrl = getApiBase()
const response = await authFetch(`${baseUrl}/admin/users/expiry/bulk`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ days: bulkExpiryDays, scope: 'non-admin-users' }),
})
if (!response.ok) {
if (handleAuthResponse(response)) return
const text = await response.text()
throw new Error(text || 'Bulk expiry update failed')
}
const data = await response.json()
setStatus(`Set expiry for ${data?.updated ?? 0} non-admin users (${bulkExpiryDays} days).`)
await loadData()
} catch (err) {
console.error(err)
setError(err instanceof Error ? err.message : 'Could not set expiry for all users.')
} finally {
setBulkExpiryBusy(false)
}
}
const bulkClearExpiry = async () => {
setBulkExpiryBusy(true)
setStatus(null)
setError(null)
try {
const baseUrl = getApiBase()
const response = await authFetch(`${baseUrl}/admin/users/expiry/bulk`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ clear: true, scope: 'non-admin-users' }),
})
if (!response.ok) {
if (handleAuthResponse(response)) return
const text = await response.text()
throw new Error(text || 'Bulk expiry clear failed')
}
const data = await response.json()
setStatus(`Cleared expiry for ${data?.updated ?? 0} non-admin users.`)
await loadData()
} catch (err) {
console.error(err)
setError(err instanceof Error ? err.message : 'Could not clear expiry for all users.')
} finally {
setBulkExpiryBusy(false)
}
}
const nonAdminUsers = users.filter((user) => user.role !== 'admin')
const profiledUsers = nonAdminUsers.filter((user) => user.profile_id != null).length
const expiringUsers = nonAdminUsers.filter((user) => Boolean(user.expires_at)).length
return (
<AdminShell
title="Invites"
subtitle="Create invite-based sign-up links for Magent accounts."
title="Invite management"
subtitle="Manage invite links, reusable profiles, and blanket invite-related defaults."
actions={
<div className="admin-inline-actions">
<button type="button" onClick={loadData} disabled={loading}>
{loading ? 'Loading…' : 'Reload'}
</button>
<button type="button" className="ghost-button" onClick={resetEditor}>
<button type="button" className="ghost-button" onClick={resetInviteEditor}>
New invite
</button>
<button type="button" className="ghost-button" onClick={resetProfileEditor}>
New profile
</button>
</div>
}
>
<section className="admin-section">
{error && <div className="error-banner">{error}</div>}
{status && <div className="status-banner">{status}</div>}
<div className="admin-panel">
<h2>Blanket controls</h2>
<p className="lede">
Apply invite profile defaults or expiry to all non-admin users. Individual users can still be edited from their user page.
</p>
<div className="admin-meta-row">
<span>Non-admin users: {nonAdminUsers.length}</span>
<span>Profile assigned: {profiledUsers}</span>
<span>Custom expiry set: {expiringUsers}</span>
</div>
<div className="user-bulk-groups">
<div className="user-bulk-group">
<label className="admin-select">
<span>Profile</span>
<select
value={bulkProfileId}
onChange={(e) => setBulkProfileId(e.target.value)}
disabled={bulkProfileBusy}
>
<option value="">None / clear assignment</option>
{profiles.map((profile) => (
<option key={profile.id} value={profile.id}>
{profile.name}{profile.is_active === false ? ' (disabled)' : ''}
</option>
))}
</select>
</label>
<button type="button" onClick={bulkApplyProfile} disabled={bulkProfileBusy}>
{bulkProfileBusy ? 'Applying…' : 'Apply profile to all users'}
</button>
</div>
<div className="user-bulk-group">
<label>
<span className="user-bulk-label">Expiry days</span>
<input
value={bulkExpiryDays}
onChange={(e) => setBulkExpiryDays(e.target.value)}
inputMode="numeric"
placeholder="e.g. 30"
disabled={bulkExpiryBusy}
/>
</label>
<button type="button" onClick={bulkSetExpiryDays} disabled={bulkExpiryBusy}>
{bulkExpiryBusy ? 'Working…' : 'Set expiry for all users'}
</button>
<button
type="button"
className="ghost-button"
onClick={bulkClearExpiry}
disabled={bulkExpiryBusy}
>
{bulkExpiryBusy ? 'Working…' : 'Clear expiry for all users'}
</button>
</div>
</div>
</div>
<div className="admin-split-grid">
<div className="admin-panel">
<h2>{editingId == null ? 'Create invite' : 'Edit invite'}</h2>
<h2>{profileEditingId == null ? 'Create profile' : 'Edit profile'}</h2>
<p className="lede">
Profiles define defaults applied when a user signs up using an invite.
</p>
<form onSubmit={saveProfile} className="admin-form compact-form">
<label>
Profile name
<input
value={profileForm.name}
onChange={(e) =>
setProfileForm((current) => ({ ...current, name: e.target.value }))
}
placeholder="Standard users"
required
/>
</label>
<label>
Description
<textarea
rows={3}
value={profileForm.description}
onChange={(e) =>
setProfileForm((current) => ({ ...current, description: e.target.value }))
}
placeholder="Default invite settings for normal users"
/>
</label>
<div className="admin-fields-grid">
<label>
Role
<select
value={profileForm.role}
onChange={(e) =>
setProfileForm((current) => ({
...current,
role: e.target.value as 'user' | 'admin',
}))
}
>
<option value="user">User</option>
<option value="admin">Admin</option>
</select>
</label>
<label>
Account expiry (days)
<input
value={profileForm.account_expires_days}
onChange={(e) =>
setProfileForm((current) => ({
...current,
account_expires_days: e.target.value,
}))
}
inputMode="numeric"
placeholder="Blank = no expiry"
/>
</label>
</div>
<label className="inline-checkbox">
<input
type="checkbox"
checked={profileForm.auto_search_enabled}
onChange={(e) =>
setProfileForm((current) => ({
...current,
auto_search_enabled: e.target.checked,
}))
}
/>
Allow auto search/download by default
</label>
<label className="inline-checkbox">
<input
type="checkbox"
checked={profileForm.is_active}
onChange={(e) =>
setProfileForm((current) => ({ ...current, is_active: e.target.checked }))
}
/>
Profile is active
</label>
<div className="admin-inline-actions">
<button type="submit" disabled={profileSaving}>
{profileSaving ? 'Saving…' : profileEditingId == null ? 'Create profile' : 'Save profile'}
</button>
{profileEditingId != null && (
<button type="button" className="ghost-button" onClick={resetProfileEditor}>
Cancel edit
</button>
)}
</div>
</form>
</div>
<div className="admin-panel">
<h2>Profiles</h2>
<p className="lede">Assign these to invites or apply them to all users using the blanket controls above.</p>
{loading ? (
<div className="status-banner">Loading profiles…</div>
) : profiles.length === 0 ? (
<div className="status-banner">No profiles created yet.</div>
) : (
<div className="admin-list">
{profiles.map((profile) => (
<div key={profile.id} className="admin-list-item">
<div className="admin-list-item-main">
<div className="admin-list-item-title-row">
<strong>{profile.name}</strong>
<span className={`small-pill ${profile.is_active ? '' : 'is-muted'}`}>
{profile.is_active ? 'Active' : 'Disabled'}
</span>
<span className="small-pill">{profile.role}</span>
</div>
{profile.description && (
<p className="admin-list-item-text">{profile.description}</p>
)}
<div className="admin-meta-row">
<span>Auto search: {profile.auto_search_enabled ? 'On' : 'Off'}</span>
<span>
Account expiry:{' '}
{typeof profile.account_expires_days === 'number'
? `${profile.account_expires_days} days`
: 'Never'}
</span>
<span>Users: {profile.assigned_users ?? 0}</span>
<span>Invites: {profile.assigned_invites ?? 0}</span>
</div>
</div>
<div className="admin-inline-actions">
<button type="button" className="ghost-button" onClick={() => editProfile(profile)}>
Edit
</button>
<button type="button" onClick={() => deleteProfile(profile)}>
Delete
</button>
</div>
</div>
))}
</div>
)}
</div>
</div>
<div className="admin-split-grid">
<div className="admin-panel">
<h2>{inviteEditingId == null ? 'Create invite' : 'Edit invite'}</h2>
<p className="lede">
Link an invite to a profile to apply account defaults at sign-up.
</p>
@@ -259,16 +696,20 @@ export default function AdminInvitesPage() {
<label>
Code (optional)
<input
value={form.code}
onChange={(e) => setForm((current) => ({ ...current, code: e.target.value }))}
value={inviteForm.code}
onChange={(e) =>
setInviteForm((current) => ({ ...current, code: e.target.value }))
}
placeholder="Leave blank to auto-generate"
/>
</label>
<label>
Label
<input
value={form.label}
onChange={(e) => setForm((current) => ({ ...current, label: e.target.value }))}
value={inviteForm.label}
onChange={(e) =>
setInviteForm((current) => ({ ...current, label: e.target.value }))
}
placeholder="Staff invite batch"
/>
</label>
@@ -277,9 +718,9 @@ export default function AdminInvitesPage() {
Description
<textarea
rows={3}
value={form.description}
value={inviteForm.description}
onChange={(e) =>
setForm((current) => ({ ...current, description: e.target.value }))
setInviteForm((current) => ({ ...current, description: e.target.value }))
}
placeholder="Optional note shown on the signup page"
/>
@@ -288,15 +729,15 @@ export default function AdminInvitesPage() {
<label>
Profile
<select
value={form.profile_id}
value={inviteForm.profile_id}
onChange={(e) =>
setForm((current) => ({ ...current, profile_id: e.target.value }))
setInviteForm((current) => ({ ...current, profile_id: e.target.value }))
}
>
<option value="">None</option>
{profiles.map((profile) => (
<option key={profile.id} value={profile.id}>
{profile.name}
{profile.name}{profile.is_active === false ? ' (disabled)' : ''}
</option>
))}
</select>
@@ -304,9 +745,9 @@ export default function AdminInvitesPage() {
<label>
Role override
<select
value={form.role}
value={inviteForm.role}
onChange={(e) =>
setForm((current) => ({
setInviteForm((current) => ({
...current,
role: e.target.value as '' | 'user' | 'admin',
}))
@@ -322,9 +763,9 @@ export default function AdminInvitesPage() {
<label>
Max uses
<input
value={form.max_uses}
value={inviteForm.max_uses}
onChange={(e) =>
setForm((current) => ({ ...current, max_uses: e.target.value }))
setInviteForm((current) => ({ ...current, max_uses: e.target.value }))
}
inputMode="numeric"
placeholder="Blank = unlimited"
@@ -333,9 +774,9 @@ export default function AdminInvitesPage() {
<label>
Invite expiry (ISO datetime)
<input
value={form.expires_at}
value={inviteForm.expires_at}
onChange={(e) =>
setForm((current) => ({ ...current, expires_at: e.target.value }))
setInviteForm((current) => ({ ...current, expires_at: e.target.value }))
}
placeholder="2026-03-01T12:00:00+00:00"
/>
@@ -344,19 +785,19 @@ export default function AdminInvitesPage() {
<label className="inline-checkbox">
<input
type="checkbox"
checked={form.enabled}
checked={inviteForm.enabled}
onChange={(e) =>
setForm((current) => ({ ...current, enabled: e.target.checked }))
setInviteForm((current) => ({ ...current, enabled: e.target.checked }))
}
/>
Invite is enabled
</label>
<div className="admin-inline-actions">
<button type="submit" disabled={saving}>
{saving ? 'Saving…' : editingId == null ? 'Create invite' : 'Save invite'}
<button type="submit" disabled={inviteSaving}>
{inviteSaving ? 'Saving…' : inviteEditingId == null ? 'Create invite' : 'Save invite'}
</button>
{editingId != null && (
<button type="button" className="ghost-button" onClick={resetEditor}>
{inviteEditingId != null && (
<button type="button" className="ghost-button" onClick={resetInviteEditor}>
Cancel edit
</button>
)}
@@ -364,8 +805,8 @@ export default function AdminInvitesPage() {
</form>
</div>
<div className="admin-panel">
<h2>Existing invites</h2>
<p className="lede">Each invite can be copied as a direct sign-up link.</p>
<h2>Invite links</h2>
<p className="lede">Copy and share invite links. Profiles can be applied per invite.</p>
{loading ? (
<div className="status-banner">Loading invites…</div>
) : invites.length === 0 ? (
@@ -389,7 +830,10 @@ export default function AdminInvitesPage() {
</p>
)}
<div className="admin-meta-row">
<span>Uses: {invite.use_count}{typeof invite.max_uses === 'number' ? ` / ${invite.max_uses}` : ''}</span>
<span>
Uses: {invite.use_count}
{typeof invite.max_uses === 'number' ? ` / ${invite.max_uses}` : ''}
</span>
<span>Remaining: {invite.remaining_uses ?? 'Unlimited'}</span>
<span>Expires: {formatDate(invite.expires_at)}</span>
<span>Created: {formatDate(invite.created_at)}</span>