feat(notes): opgaven viser de noter, der nævner den — og har fået en adresse
Den anden vej af samme forbindelse. En note, der nævner en opgave, viste den; nu
viser opgaven noten. Uden det virker forbindelsen kun, hvis man tilfældigvis
sidder og læser noten, og det er den halvdel, ingen har brug for hjælp til.
Undervejs viste det sig, at en opgave slet ikke havde en adresse. Skuffen åbner
over den liste, man står på, og ændrer ingenting i URL'en — hvilket er rigtigt for
et klik og ubrugeligt for et link: man kan ikke sende nogen en opgave, og en note,
der nævner en, har ingen steder at sende dem hen. Min egen henvisningsform pegede
altså på noget, der ikke fandtes.
/opgave/{id} findes nu. Den åbner skuffen og træder til side — erstatter sig selv
med opgavens eget projekt, så man lander hvor opgaven bor, med den åben, og
tilbage-knappen ikke går gennem en side, der kun nogensinde viderestillede.
Prøven henter opgavens id fra API'et frem for fra adresselinjen, netop fordi den
ikke står der.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
f6c60bdaf9
commit
6e83291444
@@ -2211,3 +2211,50 @@ test('et tag finder sit projekt uanset store og små bogstaver', async ({ page }
|
||||
|
||||
expect(trouble).toEqual([]);
|
||||
});
|
||||
|
||||
test('en opgave viser de noter, der nævner den, og linket åbner noten', async ({ page }) => {
|
||||
const trouble = watchForTrouble(page);
|
||||
await page.goto('/');
|
||||
|
||||
const box = page.getByLabel('Ny opgave');
|
||||
await box.fill('ring til leverandøren i dag');
|
||||
await box.press('Enter');
|
||||
await expect(page.getByText('ring til leverandøren', { exact: true })).toBeVisible();
|
||||
|
||||
// Asked for rather than read off the address bar: opening a task shows a drawer
|
||||
// without navigating, so the URL is still the list's.
|
||||
const taskId = await page.evaluate(async () => {
|
||||
const r = await fetch('/api/v1/tasks?limit=100', {
|
||||
credentials: 'include',
|
||||
headers: { 'Sec-Fetch-Site': 'same-origin' }
|
||||
});
|
||||
const j = await r.json();
|
||||
return (j.tasks ?? []).find((t) => t.content === 'ring til leverandøren')?.id;
|
||||
});
|
||||
expect(taskId, 'opgaven blev ikke oprettet').toBeTruthy();
|
||||
|
||||
const sidebar = page.getByRole('navigation', { name: 'Hovedmenu' });
|
||||
await sidebar.getByRole('link', { name: 'Noter', exact: true }).click();
|
||||
await page.getByRole('button', { name: 'Ny note' }).click();
|
||||
const ed = page.getByRole('textbox', { name: 'Notens tekst' });
|
||||
await ed.click();
|
||||
await page.keyboard.type('Referat fra tirsdag');
|
||||
await page.keyboard.press('Enter');
|
||||
await page.keyboard.type('Aftalt at han ringer, se /opgave/' + taskId);
|
||||
await ed.blur();
|
||||
|
||||
// Back on the task: the other direction of the same link. Without it the
|
||||
// connection only works if you happen to be reading the note, which is the half
|
||||
// nobody needs help with.
|
||||
await page.goto('/opgave/' + taskId);
|
||||
const linked = page.locator('.linked-notes').getByRole('link', { name: /Referat fra tirsdag/ });
|
||||
await expect(linked).toBeVisible();
|
||||
|
||||
// And it opens the note rather than dropping you on a list to find it again.
|
||||
await linked.click();
|
||||
await expect(page.getByRole('textbox', { name: 'Notens tekst' })).toContainText(
|
||||
'Aftalt at han ringer'
|
||||
);
|
||||
|
||||
expect(trouble).toEqual([]);
|
||||
});
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
let subtasks = $state([]);
|
||||
let comments = $state([]);
|
||||
let attachments = $state([]);
|
||||
let notes = $state([]);
|
||||
let reminders = $state([]);
|
||||
|
||||
let newSubtask = $state('');
|
||||
@@ -80,6 +81,7 @@
|
||||
subtasks = [];
|
||||
comments = [];
|
||||
attachments = [];
|
||||
notes = [];
|
||||
reminders = [];
|
||||
|
||||
const id = task.id;
|
||||
@@ -96,6 +98,11 @@
|
||||
api.listReminders(id)
|
||||
.then((r) => id === seededId && (reminders = r.reminders))
|
||||
.catch(() => {});
|
||||
// Quietly, because a task with no notes is the ordinary case and a failure
|
||||
// here must not put an error in front of somebody reading a task.
|
||||
api.notesLinking('task', id)
|
||||
.then((r) => id === seededId && (notes = r.notes ?? []))
|
||||
.catch(() => {});
|
||||
});
|
||||
|
||||
/**
|
||||
@@ -540,6 +547,22 @@
|
||||
</form>
|
||||
</section>
|
||||
|
||||
<!-- What has been written about this task.
|
||||
The other direction of the same link: a note that mentions a task shows
|
||||
it, and this is the task showing the note. Without it the connection only
|
||||
works if you happen to be reading the note — which is the half nobody
|
||||
needs help with. -->
|
||||
{#if notes.length}
|
||||
<section class="linked-notes">
|
||||
<h3>{t('notes.title')}</h3>
|
||||
{#each notes as note (note.id)}
|
||||
<a class="linked-note" href="/noter?note={note.id}">
|
||||
<strong>{note.title || t('notes.untitled')}</strong>
|
||||
</a>
|
||||
{/each}
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
<section>
|
||||
<h3>{t('detail.comments')}</h3>
|
||||
|
||||
@@ -582,6 +605,24 @@
|
||||
</aside>
|
||||
|
||||
<style>
|
||||
.linked-note {
|
||||
display: block;
|
||||
padding: var(--s2);
|
||||
border-radius: var(--radius);
|
||||
color: var(--ink-muted);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.linked-note:hover {
|
||||
background: var(--surface);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.linked-note strong {
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 560;
|
||||
}
|
||||
|
||||
.scrim {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
|
||||
@@ -469,6 +469,7 @@ export const da = {
|
||||
'auth.forgot': 'Glemt adgangskode?',
|
||||
|
||||
// --- a task, opened ---------------------------------------------------------------
|
||||
'detail.notFound': 'Opgaven findes ikke, eller den er ikke din.',
|
||||
'detail.task': 'Opgave',
|
||||
'detail.close': 'Luk',
|
||||
'detail.text': 'Opgavens tekst',
|
||||
|
||||
@@ -465,6 +465,7 @@ export const en = {
|
||||
'auth.forgot': 'Forgotten your password?',
|
||||
|
||||
// --- a task, opened ---------------------------------------------------------------
|
||||
'detail.notFound': 'That task does not exist, or it is not yours.',
|
||||
'detail.task': 'Task',
|
||||
'detail.close': 'Close',
|
||||
'detail.text': 'The task’s text',
|
||||
|
||||
@@ -13,6 +13,7 @@
|
||||
*/
|
||||
import { api, humanMessage } from '$lib/api.js';
|
||||
import { app } from '$lib/stores.svelte.js';
|
||||
import { page } from '$app/stores';
|
||||
import { t } from '$lib/i18n.svelte.js';
|
||||
import NoteEditor from '$lib/components/NoteEditor.svelte';
|
||||
|
||||
@@ -31,6 +32,16 @@
|
||||
load(query);
|
||||
});
|
||||
|
||||
// Arriving from somewhere that names a note — a task's panel, a project's page —
|
||||
// opens it rather than dropping the person on a list to find it again.
|
||||
let asked = $derived($page.url.searchParams.get('note'));
|
||||
$effect(() => {
|
||||
if (!asked || selected?.id === asked) return;
|
||||
const found = notes.find((n) => n.id === asked);
|
||||
if (found) open(found);
|
||||
else api.note(asked).then(open).catch(() => {});
|
||||
});
|
||||
|
||||
async function load(q) {
|
||||
try {
|
||||
notes = (await api.notes(q ? { q } : {})).notes ?? [];
|
||||
|
||||
@@ -0,0 +1,50 @@
|
||||
<script>
|
||||
/**
|
||||
* A task, by address.
|
||||
*
|
||||
* There was no such thing until a note wanted to point at one. Opening a task
|
||||
* shows a drawer over whatever list you were on and changes nothing in the URL,
|
||||
* which is right for a click and useless for a link — you cannot send somebody a
|
||||
* task, and a note that mentions one has nowhere to send them either.
|
||||
*
|
||||
* So this opens the drawer and then steps aside, replacing itself with the
|
||||
* task's own project. The person lands where the task lives, with it open, and
|
||||
* the back button does not walk them through a page that only ever redirected.
|
||||
*/
|
||||
import { page } from '$app/stores';
|
||||
import { goto } from '$app/navigation';
|
||||
import { api } from '$lib/api.js';
|
||||
import { app } from '$lib/stores.svelte.js';
|
||||
import { t } from '$lib/i18n.svelte.js';
|
||||
|
||||
let status = $state('loading');
|
||||
|
||||
$effect(() => {
|
||||
open($page.params.id);
|
||||
});
|
||||
|
||||
async function open(id) {
|
||||
if (!id) return;
|
||||
try {
|
||||
const task = await api.getTask(id);
|
||||
app.openDetail(id);
|
||||
// replaceState, so Back goes where they came from rather than here.
|
||||
await goto(task.project_id ? `/projekt/${task.project_id}` : '/', { replaceState: true });
|
||||
} catch {
|
||||
// 404 for both "no such task" and "not yours", so an id tells a stranger
|
||||
// nothing about whether it exists.
|
||||
status = 'missing';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if status === 'missing'}
|
||||
<p class="clear">{t('detail.notFound')}</p>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
.clear {
|
||||
padding: var(--s4);
|
||||
color: var(--ink-faint);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user