v3 : liens d'équipe, publication sur git.open.us.org, huitième relecture
Liens d'équipe (Yvv, 2026-10-21) : un lien réutilisable jusqu'à une date
et pour un nombre de personnes, révocable. Chaque ouverture demande un nom
et crée sa propre identité d'invitation, jamais administratrice ; un nom
déjà pris est refusé ; une personne déjà connectée reçoit les groupes.
trustinWallet montre par quel lien chaque identité est venue, et donne un
nouveau lien de connexion à une personne invitée (autre appareil).
Migration additive 0002 (table team_links, colonne identities.team_link).
Publication : yvv/libredecision-textes sur git.open.us.org, pour
l'instant (un dépôt pour l'ouverture, puis le dépôt officiel, viendront).
Huitième relecture (c3d6bf8 : ok), points corrigés :
- une négation n'est jamais coupée ni formée par collage (« ja mais ») ;
- caractères invisibles : tout l'ensemble Unicode des ignorables et les
contrôles autres que saut de ligne et tabulation ;
- sauts de ligne et indentation font partie de la forme (listes) ;
- un titre tient sur une ligne.
Boucle : 65 tests Rust, svelte-check, 9 vitest, e2e 13/13 (C12 ajouté).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -155,3 +155,27 @@ test('C11 — une personne, une voix : dans Monnaie libre, seuls les membres de
|
||||
await invited.locator('ul.deep button.row', { hasText: 'Connaissance suffisante' }).first().click();
|
||||
await expect(invited.locator('aside.panel').getByRole('button', { name: 'Pour', exact: true })).toBeVisible();
|
||||
});
|
||||
|
||||
test('C12 — lien d’équipe : chaque personne qui l’ouvre a sa propre identité', async ({ browser }) => {
|
||||
const yvv = await person(browser, 'Yvv', true);
|
||||
await yvv.goto('/acces');
|
||||
const team = yvv.locator('section', { has: yvv.getByRole('heading', { name: "Liens d'équipe" }) });
|
||||
await team.getByLabel('Pour quelle équipe').fill('Équipe de test');
|
||||
await team.getByLabel("Groupe d'essai").check();
|
||||
await team.getByRole('button', { name: "Créer le lien d'équipe" }).click();
|
||||
const link = (await team.locator('.link code').textContent()) ?? '';
|
||||
expect(link).toContain('/equipe#');
|
||||
for (const name of ['Luna', 'Paul']) {
|
||||
const ctx = await browser.newContext({ locale: 'fr-FR' });
|
||||
const page = await ctx.newPage();
|
||||
await page.goto(`/equipe#${link.split('#')[1]}`);
|
||||
await expect(page.getByText('« Équipe de test » t’ouvre', { exact: false })).toBeVisible();
|
||||
await page.getByLabel('Ton nom').fill(name);
|
||||
await page.getByRole('button', { name: 'Rejoindre' }).click();
|
||||
await expect(page).toHaveURL(/\/groupes$/);
|
||||
await ctx.close();
|
||||
}
|
||||
await yvv.reload();
|
||||
await expect(team.getByText('2 / 30 personnes', { exact: false })).toBeVisible();
|
||||
await expect(yvv.getByText('venue par « Équipe de test »')).toHaveCount(2);
|
||||
});
|
||||
|
||||
@@ -0,0 +1,38 @@
|
||||
<script lang="ts">
|
||||
// A link shown once, right after it was made: the server keeps only its hash.
|
||||
import { t } from '$lib/i18n/index.svelte';
|
||||
import { toasts } from '$lib/toast.svelte';
|
||||
|
||||
let { link, note }: { link: string; note: string } = $props();
|
||||
|
||||
async function copy() {
|
||||
await navigator.clipboard.writeText(link);
|
||||
toasts.show(t('access.invite.copied'));
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="link">
|
||||
<p class="small">{note}</p>
|
||||
<code>{link}</code>
|
||||
<button class="btn small" type="button" onclick={copy}>{t('access.invite.copy')}</button>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.link {
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
padding: 0.8rem;
|
||||
border-radius: var(--r-input);
|
||||
background: var(--water-wash);
|
||||
}
|
||||
code {
|
||||
word-break: break-all;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.btn {
|
||||
justify-self: start;
|
||||
}
|
||||
.small {
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,130 @@
|
||||
<script lang="ts">
|
||||
// trustinWallet — team links: one link shared with a team, one identity per person.
|
||||
import { api } from '$lib/api';
|
||||
import { i18n, t } from '$lib/i18n/index.svelte';
|
||||
import LinkReveal from './LinkReveal.svelte';
|
||||
|
||||
export interface TeamLink {
|
||||
id: string;
|
||||
label: string;
|
||||
groups: string[];
|
||||
expiresAt: string;
|
||||
maxUses: number;
|
||||
uses: number;
|
||||
}
|
||||
|
||||
let {
|
||||
groups,
|
||||
links,
|
||||
act,
|
||||
}: {
|
||||
groups: { slug: string; name: string }[];
|
||||
links: TeamLink[];
|
||||
act: (fn: () => Promise<unknown>) => Promise<void>;
|
||||
} = $props();
|
||||
|
||||
let label = $state('');
|
||||
let chosen = $state<string[]>([]);
|
||||
let days = $state(30);
|
||||
let maxUses = $state(30);
|
||||
let link = $state('');
|
||||
|
||||
const nameOf = (slug: string) => groups.find((g) => g.slug === slug)?.name ?? slug;
|
||||
|
||||
async function create(e: SubmitEvent) {
|
||||
e.preventDefault();
|
||||
await act(async () => {
|
||||
const r = await api.post<{ link: string }>('/access/team-links', { label, groups: chosen, days, maxUses });
|
||||
link = r.link;
|
||||
label = '';
|
||||
chosen = [];
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<section>
|
||||
<h2 class="eyebrow">{t('access.team')}</h2>
|
||||
<p class="muted small">{t('access.team.intro')}</p>
|
||||
<form class="card block" onsubmit={create}>
|
||||
<label class="field"><span>{t('access.team.label')}</span><input class="input" bind:value={label} maxlength="60" required /></label>
|
||||
<fieldset>
|
||||
<legend>{t('access.invite.groups')}</legend>
|
||||
{#each groups as g (g.slug)}
|
||||
<label class="check"><input type="checkbox" value={g.slug} bind:group={chosen} /> {g.name}</label>
|
||||
{/each}
|
||||
</fieldset>
|
||||
<div class="row">
|
||||
<label class="field"><span>{t('access.team.days')}</span><input class="input" type="number" min="1" max="90" bind:value={days} required /></label>
|
||||
<label class="field"><span>{t('access.team.uses')}</span><input class="input" type="number" min="1" max="500" bind:value={maxUses} required /></label>
|
||||
</div>
|
||||
<button class="btn primary small" type="submit">{t('access.team.create')}</button>
|
||||
{#if link}<LinkReveal {link} note={t('access.team.link')} />{/if}
|
||||
</form>
|
||||
{#if links.length}
|
||||
<ul class="list">
|
||||
{#each links as l (l.id)}
|
||||
<li>
|
||||
<span>
|
||||
<b>{l.label}</b> · {l.groups.map(nameOf).join(', ')}<br />
|
||||
<span class="faint small">{t('access.team.state', { uses: l.uses, max: l.maxUses, date: i18n.date(l.expiresAt) })}</span>
|
||||
</span>
|
||||
<button class="btn quiet small" type="button" onclick={() => act(() => api.del(`/access/team-links/${l.id}`))}>{t('access.team.revoke')}</button>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
<style>
|
||||
section {
|
||||
display: grid;
|
||||
gap: 0.7rem;
|
||||
}
|
||||
.block {
|
||||
padding: 1.1rem 1.2rem;
|
||||
display: grid;
|
||||
gap: 0.6rem;
|
||||
}
|
||||
.block > .btn {
|
||||
justify-self: start;
|
||||
}
|
||||
fieldset {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: grid;
|
||||
gap: 0.35rem;
|
||||
}
|
||||
legend {
|
||||
font-size: 0.82rem;
|
||||
font-weight: 700;
|
||||
color: var(--ink-soft);
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.check {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
.row {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
|
||||
gap: 0.6rem;
|
||||
}
|
||||
.list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.list li {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
}
|
||||
.small {
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
</style>
|
||||
@@ -55,6 +55,17 @@ export const en: Messages = {
|
||||
'invite.working': 'Signing in…',
|
||||
'invite.invalid': 'This invitation link is no longer valid: it has already been used or it has expired. Ask the person who sent it to you for a new link.',
|
||||
'invite.missing': 'This link is incomplete. Open the whole invitation link, exactly as you received it.',
|
||||
'team.title': 'Join a team',
|
||||
'team.working': 'Reading the link…',
|
||||
'team.invalid': 'This team link is no longer valid: it has expired, it has been revoked or all its places are taken. Ask the person who sent it to you for a new link.',
|
||||
'team.missing': 'This link is incomplete. Open the whole team link, exactly as you received it.',
|
||||
'team.opens': '“{label}” opens for you: {groups}.',
|
||||
'team.until': 'Link valid until {date}.',
|
||||
'team.name': 'Your name',
|
||||
'team.name.hint': 'The name the group will see you under. One person, one identity: if you have already joined, come back in the browser where your session is open.',
|
||||
'team.join': 'Join',
|
||||
'team.signed': 'Your session is open under the name {name}: these groups are added to your identity.',
|
||||
'team.add': 'Add these groups',
|
||||
|
||||
'groups.title': 'My groups',
|
||||
'groups.same.key': 'Groups that use the same key',
|
||||
@@ -275,10 +286,22 @@ export const en: Messages = {
|
||||
'access.invite.copied': 'Link copied.',
|
||||
'access.invite.cancel': 'Cancel',
|
||||
'access.invite.pending': 'Pending',
|
||||
'access.team': 'Team links',
|
||||
'access.team.intro': 'A link to share with a team, until a date. Each person who opens it gives their name and receives their own identity, never the administrator role.',
|
||||
'access.team.label': 'For which team',
|
||||
'access.team.days': 'Valid for how many days',
|
||||
'access.team.uses': 'How many people at most',
|
||||
'access.team.create': 'Create the team link',
|
||||
'access.team.link': 'Team link, to share: it works until its date or its last place. It will not be shown again: copy it now.',
|
||||
'access.team.state': '{uses} / {max} people · until {date}',
|
||||
'access.team.revoke': 'Revoke',
|
||||
'access.team.via': 'came through “{label}”',
|
||||
'access.identities': 'Identities',
|
||||
'access.admin': 'administrator',
|
||||
'access.admin.give': 'Make administrator',
|
||||
'access.admin.take': 'Remove role',
|
||||
'access.relink': 'New sign-in link',
|
||||
'access.relink.link': 'Sign-in link for {name}, single use, valid for 14 days — to open their session on another device. It will not be shown again: copy it now.',
|
||||
'access.kind.g1': 'Ğ1',
|
||||
'access.kind.invite': 'invitation',
|
||||
'access.kind.dev': 'dev',
|
||||
@@ -314,6 +337,11 @@ export const en: Messages = {
|
||||
'error.hidden_characters': 'The text contains invisible characters (writing-direction overrides, zero-width spaces): remove them.',
|
||||
'error.changed': 'The text has changed in the meantime: reload it, then try again.',
|
||||
'error.wot_members_only': 'Here, only members of the Ğ1 web of trust vote.',
|
||||
'error.label': 'The name is empty or too long (60 characters at most).',
|
||||
'error.name': 'Your name has 2 to 60 characters, with no invisible character.',
|
||||
'error.name_taken': 'This name is already taken. Choose another one, adding an initial for instance.',
|
||||
'error.team_limits': 'A team link lasts 1 to 90 days, for 1 to 500 people.',
|
||||
'error.groups': 'Choose at least one group.',
|
||||
'error.retry': 'Try again',
|
||||
|
||||
'common.cancel': 'Cancel',
|
||||
|
||||
@@ -55,6 +55,17 @@ export const es: Messages = {
|
||||
'invite.working': 'Conectando…',
|
||||
'invite.invalid': 'Este enlace de invitación ya no es válido: ya se ha usado o ha caducado. Pide un enlace nuevo a la persona que te lo envió.',
|
||||
'invite.missing': 'Este enlace está incompleto. Abre el enlace de invitación completo, tal como lo recibiste.',
|
||||
'team.title': 'Unirte a un equipo',
|
||||
'team.working': 'Leyendo el enlace…',
|
||||
'team.invalid': 'Este enlace de equipo ya no es válido: ha caducado, ha sido revocado o todas sus plazas están ocupadas. Pide un enlace nuevo a la persona que te lo envió.',
|
||||
'team.missing': 'Este enlace está incompleto. Abre el enlace de equipo completo, tal como lo recibiste.',
|
||||
'team.opens': '«{label}» te abre: {groups}.',
|
||||
'team.until': 'Enlace válido hasta el {date}.',
|
||||
'team.name': 'Tu nombre',
|
||||
'team.name.hint': 'El nombre con el que el grupo te verá. Una persona, una identidad: si ya te uniste, vuelve en el navegador donde tienes la sesión abierta.',
|
||||
'team.join': 'Unirme',
|
||||
'team.signed': 'Tu sesión está abierta con el nombre {name}: estos grupos se añaden a tu identidad.',
|
||||
'team.add': 'Añadir estos grupos',
|
||||
|
||||
'groups.title': 'Mis grupos',
|
||||
'groups.same.key': 'Grupos que usan la misma clave',
|
||||
@@ -275,10 +286,22 @@ export const es: Messages = {
|
||||
'access.invite.copied': 'Enlace copiado.',
|
||||
'access.invite.cancel': 'Cancelar',
|
||||
'access.invite.pending': 'Pendiente',
|
||||
'access.team': 'Enlaces de equipo',
|
||||
'access.team.intro': 'Un enlace para compartir con un equipo, hasta una fecha. Cada persona que lo abre da su nombre y recibe su propia identidad, nunca el rol de administrador.',
|
||||
'access.team.label': 'Para qué equipo',
|
||||
'access.team.days': 'Válido cuántos días',
|
||||
'access.team.uses': 'Cuántas personas como máximo',
|
||||
'access.team.create': 'Crear el enlace de equipo',
|
||||
'access.team.link': 'Enlace de equipo, para compartir: sirve hasta su fecha o su última plaza. No se volverá a mostrar: cópialo ahora.',
|
||||
'access.team.state': '{uses} / {max} personas · hasta el {date}',
|
||||
'access.team.revoke': 'Revocar',
|
||||
'access.team.via': 'llegó por «{label}»',
|
||||
'access.identities': 'Identidades',
|
||||
'access.admin': 'administrador',
|
||||
'access.admin.give': 'Nombrar administrador',
|
||||
'access.admin.take': 'Retirar el rol',
|
||||
'access.relink': 'Nuevo enlace de conexión',
|
||||
'access.relink.link': 'Enlace de conexión para {name}, de un solo uso, válido 14 días — para abrir su sesión en otro dispositivo. No se volverá a mostrar: cópialo ahora.',
|
||||
'access.kind.g1': 'Ğ1',
|
||||
'access.kind.invite': 'invitación',
|
||||
'access.kind.dev': 'dev',
|
||||
@@ -314,6 +337,11 @@ export const es: Messages = {
|
||||
'error.hidden_characters': 'El texto contiene caracteres invisibles (inversión del sentido de escritura, espacios de ancho cero): quítalos.',
|
||||
'error.changed': 'El texto ha cambiado mientras tanto: vuelve a cargarlo y empieza de nuevo.',
|
||||
'error.wot_members_only': 'Aquí solo votan los miembros de la red de confianza Ğ1.',
|
||||
'error.label': 'El nombre está vacío o es demasiado largo (60 caracteres como máximo).',
|
||||
'error.name': 'Tu nombre tiene de 2 a 60 caracteres, sin caracteres invisibles.',
|
||||
'error.name_taken': 'Este nombre ya está ocupado. Elige otro, añadiendo una inicial por ejemplo.',
|
||||
'error.team_limits': 'Un enlace de equipo vale de 1 a 90 días, para 1 a 500 personas.',
|
||||
'error.groups': 'Elige al menos un grupo.',
|
||||
'error.retry': 'Reintentar',
|
||||
|
||||
'common.cancel': 'Cancelar',
|
||||
|
||||
@@ -58,6 +58,17 @@ export const fr = {
|
||||
'invite.working': 'Connexion en cours…',
|
||||
'invite.invalid': "Ce lien d'invitation n'est plus valable : il a déjà servi ou il a expiré. Demande un nouveau lien à la personne qui te l'a envoyé.",
|
||||
'invite.missing': "Ce lien est incomplet. Ouvre le lien d'invitation entier, tel que tu l'as reçu.",
|
||||
'team.title': 'Rejoindre une équipe',
|
||||
'team.working': 'Lecture du lien…',
|
||||
'team.invalid': "Ce lien d'équipe n'est plus valable : il a expiré, il a été révoqué ou toutes ses places sont prises. Demande un nouveau lien à la personne qui te l'a envoyé.",
|
||||
'team.missing': "Ce lien est incomplet. Ouvre le lien d'équipe entier, tel que tu l'as reçu.",
|
||||
'team.opens': '« {label} » t’ouvre : {groups}.',
|
||||
'team.until': "Lien valable jusqu'au {date}.",
|
||||
'team.name': 'Ton nom',
|
||||
'team.name.hint': 'Le nom sous lequel le groupe te verra. Une personne, une identité : si tu as déjà rejoint, reviens dans le navigateur où ta session est ouverte.',
|
||||
'team.join': 'Rejoindre',
|
||||
'team.signed': 'Ta session est ouverte sous le nom {name} : ces groupes s’ajoutent à ton identité.',
|
||||
'team.add': 'Ajouter ces groupes',
|
||||
|
||||
'groups.title': 'Mes groupes',
|
||||
'groups.same.key': 'Groupes qui utilisent la même clé',
|
||||
@@ -278,10 +289,22 @@ export const fr = {
|
||||
'access.invite.copied': 'Lien copié.',
|
||||
'access.invite.cancel': 'Annuler',
|
||||
'access.invite.pending': 'En attente',
|
||||
'access.team': "Liens d'équipe",
|
||||
'access.team.intro': "Un lien à partager avec une équipe, jusqu'à une date. Chaque personne qui l'ouvre donne son nom et reçoit sa propre identité, jamais le rôle d'administrateur.",
|
||||
'access.team.label': 'Pour quelle équipe',
|
||||
'access.team.days': 'Valable combien de jours',
|
||||
'access.team.uses': 'Combien de personnes au plus',
|
||||
'access.team.create': "Créer le lien d'équipe",
|
||||
'access.team.link': "Lien d'équipe, à partager : il sert jusqu'à sa date ou à sa dernière place. Il ne s'affichera plus : copie-le maintenant.",
|
||||
'access.team.state': '{uses} / {max} personnes · jusqu’au {date}',
|
||||
'access.team.revoke': 'Révoquer',
|
||||
'access.team.via': 'venue par « {label} »',
|
||||
'access.identities': 'Identités',
|
||||
'access.admin': 'administrateur',
|
||||
'access.admin.give': 'Rendre administrateur',
|
||||
'access.admin.take': 'Retirer le rôle',
|
||||
'access.relink': 'Nouveau lien de connexion',
|
||||
'access.relink.link': "Lien de connexion pour {name}, à usage unique, valable 14 jours — pour ouvrir sa session sur un autre appareil. Il ne s'affichera plus : copie-le maintenant.",
|
||||
'access.kind.g1': 'Ğ1',
|
||||
'access.kind.invite': 'invitation',
|
||||
'access.kind.dev': 'dev',
|
||||
@@ -317,6 +340,11 @@ export const fr = {
|
||||
'error.hidden_characters': 'Le texte contient des caractères invisibles (inversion du sens d\'écriture, espaces de largeur nulle) : retire-les.',
|
||||
'error.changed': 'Le texte a changé entre-temps : recharge-le, puis recommence.',
|
||||
'error.wot_members_only': 'Ici, seuls les membres de la toile de confiance Ğ1 votent.',
|
||||
'error.label': 'Le nom est vide ou trop long (60 signes au plus).',
|
||||
'error.name': 'Ton nom fait de 2 à 60 signes, sans caractère invisible.',
|
||||
'error.name_taken': 'Ce nom est déjà pris. Choisis-en un autre, en ajoutant une initiale par exemple.',
|
||||
'error.team_limits': "Un lien d'équipe vaut de 1 à 90 jours, pour 1 à 500 personnes.",
|
||||
'error.groups': 'Choisis au moins un groupe.',
|
||||
'error.retry': 'Réessayer',
|
||||
|
||||
'common.cancel': 'Annuler',
|
||||
|
||||
@@ -2,16 +2,18 @@
|
||||
import { onMount } from 'svelte';
|
||||
import { api, ApiError } from '$lib/api';
|
||||
import Guard from '$lib/components/Guard.svelte';
|
||||
import LinkReveal from '$lib/components/LinkReveal.svelte';
|
||||
import TeamLinks, { type TeamLink } from '$lib/components/TeamLinks.svelte';
|
||||
import { i18n, t, type Key } from '$lib/i18n/index.svelte';
|
||||
import { Remote } from '$lib/load.svelte';
|
||||
import { session } from '$lib/session.svelte';
|
||||
import { toasts } from '$lib/toast.svelte';
|
||||
|
||||
interface Overview {
|
||||
publication: { remote: string | null; publicKey: string | null };
|
||||
groups: { slug: string; name: string; policy: string; hidden: boolean; members: { identityId: string; grantedAt: string }[] }[];
|
||||
identities: { id: string; kind: 'g1' | 'invite' | 'dev'; displayName: string; g1Member: boolean; admin: boolean; lastSeenAt: string | null }[];
|
||||
identities: { id: string; kind: 'g1' | 'invite' | 'dev'; displayName: string; g1Member: boolean; admin: boolean; lastSeenAt: string | null; teamLink: string | null }[];
|
||||
invitations: { id: string; label: string; admin: boolean; groups: string[]; expiresAt: string }[];
|
||||
teamLinks: TeamLink[];
|
||||
}
|
||||
interface Feedback {
|
||||
feedback: { id: number; author: string | null; route: string; body: string; createdAt: string; status: 'new' | 'seen' | 'done' }[];
|
||||
@@ -29,6 +31,7 @@
|
||||
let groups = $state<string[]>([]);
|
||||
let admin = $state(false);
|
||||
let link = $state('');
|
||||
let relinked = $state<{ id: string; name: string; link: string } | null>(null);
|
||||
let error = $state('');
|
||||
|
||||
const nameOf = (id: string) => data.value?.identities.find((i) => i.id === id)?.displayName ?? id;
|
||||
@@ -54,9 +57,12 @@
|
||||
});
|
||||
}
|
||||
|
||||
async function copy() {
|
||||
await navigator.clipboard.writeText(link);
|
||||
toasts.show(t('access.invite.copied'));
|
||||
// A new sign-in link for an invited person (another device, a lost session).
|
||||
async function relink(id: string, name: string) {
|
||||
await act(async () => {
|
||||
const r = await api.post<{ link: string }>('/access/invitations', { label: name, identityId: id });
|
||||
relinked = { id, name, link: r.link };
|
||||
});
|
||||
}
|
||||
|
||||
async function status(id: number, s: 'seen' | 'done') {
|
||||
@@ -118,13 +124,7 @@
|
||||
<label class="check"><input type="checkbox" bind:checked={admin} /> {t('access.invite.admin')}</label>
|
||||
</fieldset>
|
||||
<button class="btn primary small" type="submit">{t('access.invite.create')}</button>
|
||||
{#if link}
|
||||
<div class="link">
|
||||
<p class="small">{t('access.invite.link')}</p>
|
||||
<code>{link}</code>
|
||||
<button class="btn small" type="button" onclick={copy}>{t('access.invite.copy')}</button>
|
||||
</div>
|
||||
{/if}
|
||||
{#if link}<LinkReveal {link} note={t('access.invite.link')} />{/if}
|
||||
</form>
|
||||
{#if data.value.invitations.length}
|
||||
<ul class="list">
|
||||
@@ -138,6 +138,8 @@
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
<TeamLinks groups={data.value.groups} links={data.value.teamLinks} {act} />
|
||||
|
||||
<section>
|
||||
<h2 class="eyebrow">{t('access.identities')}</h2>
|
||||
<ul class="list">
|
||||
@@ -147,9 +149,14 @@
|
||||
<b>{i.displayName}</b> · {t(`access.kind.${i.kind}`)}
|
||||
{#if i.g1Member} · {t('access.member')}{/if}
|
||||
{#if i.admin} · <span class="tag water">{t('access.admin')}</span>{/if}
|
||||
{#if i.teamLink} · <span class="faint small">{t('access.team.via', { label: i.teamLink })}</span>{/if}
|
||||
</span>
|
||||
<span class="row">
|
||||
{#if i.kind === 'invite'}<button class="btn quiet small" type="button" onclick={() => relink(i.id, i.displayName)}>{t('access.relink')}</button>{/if}
|
||||
<button class="btn quiet small" type="button" onclick={() => act(() => api.post(`/access/identities/${encodeURIComponent(i.id)}/admin`, { admin: !i.admin }))}>{i.admin ? t('access.admin.take') : t('access.admin.give')}</button>
|
||||
</span>
|
||||
<button class="btn quiet small" type="button" onclick={() => act(() => api.post(`/access/identities/${encodeURIComponent(i.id)}/admin`, { admin: !i.admin }))}>{i.admin ? t('access.admin.take') : t('access.admin.give')}</button>
|
||||
</li>
|
||||
{#if relinked?.id === i.id}<li class="reveal"><LinkReveal link={relinked.link} note={t('access.relink.link', { name: relinked.name })} /></li>{/if}
|
||||
{/each}
|
||||
</ul>
|
||||
</section>
|
||||
@@ -253,19 +260,8 @@
|
||||
.block > .btn {
|
||||
justify-self: start;
|
||||
}
|
||||
.link {
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
padding: 0.8rem;
|
||||
border-radius: var(--r-input);
|
||||
background: var(--water-wash);
|
||||
}
|
||||
.link code {
|
||||
word-break: break-all;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.link .btn {
|
||||
justify-self: start;
|
||||
.list li.reveal {
|
||||
display: block;
|
||||
}
|
||||
.small {
|
||||
font-size: 0.84rem;
|
||||
|
||||
@@ -0,0 +1,112 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import { onMount } from 'svelte';
|
||||
import { api, ApiError } from '$lib/api';
|
||||
import { i18n, t, type Key } from '$lib/i18n/index.svelte';
|
||||
import { session } from '$lib/session.svelte';
|
||||
import type { Me } from '$lib/types';
|
||||
|
||||
interface Peek {
|
||||
label: string;
|
||||
groups: string[];
|
||||
expiresAt: string;
|
||||
signedInAs: string | null;
|
||||
}
|
||||
|
||||
let phase = $state<'working' | 'invalid' | 'missing' | 'ready'>('working');
|
||||
let link = $state<Peek | null>(null);
|
||||
let token = '';
|
||||
let name = $state('');
|
||||
let error = $state('');
|
||||
let busy = $state(false);
|
||||
|
||||
onMount(async () => {
|
||||
// The token travels in the fragment: it never reaches a server log.
|
||||
token = location.hash.slice(1).trim();
|
||||
history.replaceState(null, '', '/equipe');
|
||||
if (!/^[0-9a-f]{64}$/.test(token)) {
|
||||
phase = 'missing';
|
||||
return;
|
||||
}
|
||||
try {
|
||||
link = await api.post<Peek>('/auth/team/peek', { token });
|
||||
phase = 'ready';
|
||||
} catch {
|
||||
phase = 'invalid';
|
||||
}
|
||||
});
|
||||
|
||||
async function join(e: SubmitEvent) {
|
||||
e.preventDefault();
|
||||
error = '';
|
||||
busy = true;
|
||||
try {
|
||||
const r = await api.post<{ me: Me }>('/auth/team', link?.signedInAs ? { token } : { token, name });
|
||||
session.me = r.me;
|
||||
await goto('/groupes', { replaceState: true });
|
||||
} catch (err) {
|
||||
const code = err instanceof ApiError ? err.code : 'internal';
|
||||
if (code === 'invitation_invalid') phase = 'invalid';
|
||||
else error = t(`error.${code}` as Key);
|
||||
} finally {
|
||||
busy = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="page">
|
||||
<h1>{t('team.title')}</h1>
|
||||
{#if phase === 'ready' && link}
|
||||
<p class="lead">{t('team.opens', { label: link.label, groups: link.groups.join(', ') })}</p>
|
||||
<p class="faint small">{t('team.until', { date: i18n.date(link.expiresAt) })}</p>
|
||||
<form class="card block" onsubmit={join}>
|
||||
{#if link.signedInAs}
|
||||
<p>{t('team.signed', { name: link.signedInAs })}</p>
|
||||
<button class="btn primary" type="submit" disabled={busy}>{t('team.add')}</button>
|
||||
{:else}
|
||||
<label class="field">
|
||||
<span>{t('team.name')}</span>
|
||||
<input class="input" bind:value={name} minlength="2" maxlength="60" autocomplete="name" required />
|
||||
</label>
|
||||
<p class="faint small">{t('team.name.hint')}</p>
|
||||
<button class="btn primary" type="submit" disabled={busy}>{t('team.join')}</button>
|
||||
{/if}
|
||||
{#if error}<p class="warn" role="alert">{error}</p>{/if}
|
||||
</form>
|
||||
{:else}
|
||||
<p class="muted" role="status">{t(`team.${phase}` as Key)}</p>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.page {
|
||||
max-width: 34rem;
|
||||
margin: 0 auto;
|
||||
padding: clamp(2.5rem, 9vh, 6rem) 1.4rem;
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
}
|
||||
h1 {
|
||||
font-family: var(--font-text);
|
||||
font-weight: 500;
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
.lead {
|
||||
font-size: 1.08rem;
|
||||
}
|
||||
.block {
|
||||
padding: 1.1rem 1.2rem;
|
||||
display: grid;
|
||||
gap: 0.7rem;
|
||||
}
|
||||
.block > .btn {
|
||||
justify-self: start;
|
||||
}
|
||||
.small {
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
.warn {
|
||||
color: var(--ochre);
|
||||
font-weight: 700;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user