Give every team a page of its own
The Admin tab's team list was growing controls the way the user list did beforeac9af8e: a Rename button behind window.prompt, a Delete beside it, and -- on the Users page, of all places -- an invite form with a team picker in front of it. The picker was the admission that an invite is a fact about a team rather than about the server, and a prompt() is the wrong place to read a 409 about a name already taken. So a team is now a subject with a page, at /admin/teams/{id}, the mirror of /admin/users/{id}: when it was created, how many are in it and how much is open, a field to rename it, the members with their roles, the invites into it, and deletion. The list goes back to being a list, and the name in it is the way in. The member list is the one thing there that needed a new endpoint. GET /api/teams/{id}/members is requireTeamMember and answers 404 to an administrator who is not in the team, and that stays exactly as it is: member means membership and nothing else. Reading a team's shape is a different question from reading its work, so it gets an endpoint of its own under AdminOnly -- GET /api/admin/teams/{id}, returning {"team", "members"} -- rather than an exception carved into that rule. It is a wrapper and not a team with the members hung off it, because "members" already means a count on the list endpoint and one name must not be a number in one answer and an array in the next. The query and its ordering are copied from handleListTeamMembers so the two answers to "who is in this team" cannot disagree. An administrator still sees none of that team's incidents, alerts or rota. Nothing about what the flag may do changed; it could already rename and delete any team, and staff one it is not in. Rename now trims what it is given, as creation has always trimmed. Before this, " " was a legal name to rename a team to but not to create one with, which is one rule stated twice and applied once. Nobody has looked at this in a browser, the caveatac9af8eand07914d5both carried. What is checked is the wiring: admin_test.go covers the new endpoint for an administrator outside the team, the 404 the member-only endpoint still gives that same administrator, the 403 for a member who is not one, a 404 for a team that does not exist, a 400 for an id that is not a number, and the trim; the module graph evaluates at /admin/teams/{id}, and the server serves index.html there, so a reload survives. Claude-Session: https://claude.ai/code/session_01RHPj4ggeFdEjKKfm4SHbD7
This commit is contained in:
@@ -64,9 +64,9 @@ export async function refresh() {
|
||||
render();
|
||||
}
|
||||
|
||||
// Only what the open sub-section shows. Users is the one that needs two: its
|
||||
// invite form has to offer a team to invite somebody into, and the overview
|
||||
// counts both.
|
||||
// Only what the open sub-section shows. Users is the one that needs two: it
|
||||
// only points at Teams for an invite if there is a team to point at, and the
|
||||
// overview counts both.
|
||||
async function load() {
|
||||
if (tab === 'teams') return { teams: await api.adminTeams() };
|
||||
if (tab === 'settings') return { settings: await api.adminSettings() };
|
||||
@@ -148,37 +148,24 @@ function menuItem(href, label, count, note) {
|
||||
function teamsCard() {
|
||||
const rows = data.teams.map((t) =>
|
||||
h('tr', {},
|
||||
h('td', {}, h('strong', { text: t.name })),
|
||||
// The name is the way in: everything about one team lives on its own
|
||||
// page, and this table stays a list rather than becoming a form.
|
||||
h('td', {}, h('a', { class: 'row-link', href: `/admin/teams/${t.id}`, text: t.name })),
|
||||
h('td', { class: 'num', text: String(t.members) }),
|
||||
h('td', { class: 'num', text: String(t.open_incidents) }),
|
||||
h('td', {},
|
||||
h('button', {
|
||||
class: 'btn-sm',
|
||||
type: 'button',
|
||||
text: 'Rename',
|
||||
onclick: () => renameTeam(t),
|
||||
}),
|
||||
// A team with open incidents cannot be deleted, and saying so before
|
||||
// the click is kinder than a 409 afterwards.
|
||||
h('button', {
|
||||
class: 'btn-sm danger',
|
||||
type: 'button',
|
||||
text: 'Delete',
|
||||
disabled: t.open_incidents > 0,
|
||||
title: t.open_incidents > 0 ? 'Resolve its open incidents first' : '',
|
||||
onclick: () => deleteTeam(t),
|
||||
}),
|
||||
),
|
||||
));
|
||||
|
||||
return h('div', { class: 'card' },
|
||||
h('h2', { text: 'Teams' }),
|
||||
h('p', { class: 'muted small' },
|
||||
'Open a team for who is in it, the invites into it, and renaming or ',
|
||||
'deleting it. Deleting takes its alerts, incidents, schedule and ',
|
||||
'integrations with it, and is refused while anything is still open.'),
|
||||
h('table', { class: 'admin-table' },
|
||||
h('thead', {}, h('tr', {},
|
||||
h('th', { text: 'Name' }),
|
||||
h('th', { class: 'num', text: 'Members' }),
|
||||
h('th', { class: 'num', text: 'Open' }),
|
||||
h('th', { text: '' }))),
|
||||
h('th', { class: 'num', text: 'Open' }))),
|
||||
h('tbody', {}, rows)),
|
||||
newTeamForm(),
|
||||
);
|
||||
@@ -206,32 +193,6 @@ function newTeamForm() {
|
||||
return form;
|
||||
}
|
||||
|
||||
async function renameTeam(team) {
|
||||
const next = window.prompt(`Rename ${team.name} to:`, team.name);
|
||||
if (!next || next === team.name) return;
|
||||
try {
|
||||
await api.renameTeam(team.id, next);
|
||||
} catch (err) {
|
||||
error = err.message;
|
||||
}
|
||||
refresh();
|
||||
}
|
||||
|
||||
async function deleteTeam(team) {
|
||||
if (!(await confirm({
|
||||
title: `Delete ${team.name}?`,
|
||||
text: 'Its alerts, incidents, schedule and integrations go with it. This cannot be undone.',
|
||||
confirmLabel: 'Delete',
|
||||
danger: true,
|
||||
}))) return;
|
||||
try {
|
||||
await api.deleteTeam(team.id);
|
||||
} catch (err) {
|
||||
error = err.message;
|
||||
}
|
||||
refresh();
|
||||
}
|
||||
|
||||
// --- users -----------------------------------------------------------------
|
||||
|
||||
function usersCard() {
|
||||
@@ -241,7 +202,7 @@ function usersCard() {
|
||||
h('td', {},
|
||||
// The name is the way in: everything about one person lives on their
|
||||
// own page, and this table stays a list rather than becoming a form.
|
||||
h('a', { class: 'user-link', href: `/admin/users/${u.id}`, text: u.username }),
|
||||
h('a', { class: 'row-link', href: `/admin/users/${u.id}`, text: u.username }),
|
||||
u.disabled_at && h('span', { class: 'row-team', text: 'disabled' }),
|
||||
self && h('span', { class: 'you', text: 'you' })),
|
||||
h('td', { class: 'muted', text: u.email }),
|
||||
@@ -279,57 +240,27 @@ function usersCard() {
|
||||
h('th', { text: '' }),
|
||||
h('th', { text: '' }))),
|
||||
h('tbody', {}, rows)),
|
||||
inviteForm(),
|
||||
invitePointer(),
|
||||
);
|
||||
}
|
||||
|
||||
// Adding a person is minting them an invite, not creating a row. The account
|
||||
// is created by whoever accepts it, so they pick their own password and it
|
||||
// never passes through an administrator — and the link carries the team, which
|
||||
// a bare POST /api/users cannot, leaving an account with nothing to work on.
|
||||
// Adding a person is minting them an invite into a team, not creating a row:
|
||||
// whoever accepts it picks their own password, so one never passes through an
|
||||
// administrator, and the link carries the team, so they do not land on an empty
|
||||
// queue.
|
||||
//
|
||||
// Minting for a team the administrator is not in is allowed: the flag passes
|
||||
// every team-owner check, so a server administrator can staff any team. The
|
||||
// link shows up in that team's own invite list, where an owner can revoke it.
|
||||
function inviteForm() {
|
||||
const team = h('select', {},
|
||||
...data.teams.map((t) => h('option', { value: String(t.id), text: t.name })));
|
||||
const role = h('select', {},
|
||||
h('option', { value: 'member', text: 'member' }),
|
||||
h('option', { value: 'owner', text: 'owner' }));
|
||||
const out = h('p', { class: 'invite-out', hidden: true });
|
||||
|
||||
const form = h('form', { class: 'inline-form' }, team, role,
|
||||
h('button', { class: 'btn', type: 'submit', text: 'Create invite' }));
|
||||
form.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
if (busy) return;
|
||||
busy = true;
|
||||
try {
|
||||
const inv = await api.createInvite(Number(team.value), role.value, 1);
|
||||
// Shown once and never stored, so it is put on the page to be copied
|
||||
// rather than toasted away after three seconds.
|
||||
clear(out, h('strong', { text: 'Send them this link. It is shown once.' }),
|
||||
h('code', { class: 'invite-link', text: inv.url }));
|
||||
out.hidden = false;
|
||||
error = null;
|
||||
} catch (err) {
|
||||
error = err.message;
|
||||
render();
|
||||
return;
|
||||
} finally {
|
||||
busy = false;
|
||||
}
|
||||
});
|
||||
|
||||
// The form for it lives on the team's own page. It always needed a team beside
|
||||
// it, and a picker here was the admission that an invite is a fact about a team
|
||||
// rather than about the server.
|
||||
function invitePointer() {
|
||||
return h('div', { class: 'invite-block' },
|
||||
h('h3', { text: 'Add someone' }),
|
||||
h('p', { class: 'muted small' },
|
||||
'An invite link puts them in a team and lets them choose their own ',
|
||||
'password. It lasts a week and can be used once.'),
|
||||
data.teams.length > 0 ? form
|
||||
data.teams.length > 0
|
||||
? h('p', { class: 'muted small' },
|
||||
'Open the team you want them in, under ',
|
||||
h('a', { class: 'row-link', href: '/admin/teams', text: 'Teams' }),
|
||||
', and mint an invite there.')
|
||||
: h('p', { class: 'muted small', text: 'Create a team first — an invite has to lead somewhere.' }),
|
||||
out,
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user