feat: formatted text, a list view, ticket details, public proposals and votes

Formatted text
- Descriptions, comments, replies and release notes render Markdown,
  sanitised with DOMPurify (tested against scripts, handlers and
  javascript: links). A pasted image is uploaded and written as
  ![name](attachment:<id>); the web fetches it with the reader's session,
  so it works on private projects. Every text box has a preview. The
  attachment upload now answers its attachmentId.

List view
- /p/:key/list: every ticket as rows, sortable by any column, filtered by
  text, open/closed, type, priority and assignee; status, priority and
  assignee change in place; bulk edit (the backlog's bar, now shared).

Ticket details
- Reactions on comments (GitHub's eight), for members and viewers.
- Duplicate a ticket: what it says, not where it stands.
- blockedBy: open tickets it waits for (BLOCKS / DEPENDS_ON), worked out
  when reading with one query per board or page; shown on cards, list
  rows and the ticket.

Public proposals
- A public project can take bug reports and ideas from anyone
  (acceptsProposals): POST /api/explore/projects/{project}/proposals and
  the form at /p/:key/proponer. They become tickets labelled «propuesta»,
  opened by TaskStream; a honeypot field and 5 per address every 15
  minutes keep spam out. No e-mail is asked: it would be public.

Votes
- Anyone signed in votes on a public project's tickets, members on a
  private one (voteIssue, PUT/DELETE /api/issues/{issue}/vote): votes and
  voted on each ticket, buttons on the ticket and the roadmap, a column
  in the list. The showcase carries votes and the open proposals.

MCP: vote_issue, duplicate_issue, react_to_comment; listings show
blockers and votes. Docs, Word and PDF updated; chat notifications
(Discord, Slack, Telegram) noted for later.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-09 21:36:11 +02:00
parent 298766ad1a
commit f2001aca88
116 changed files with 17997 additions and 650 deletions

View File

@@ -6,6 +6,7 @@ export const epicsPageEvents = eventGroup({
source: 'Epics Page',
events: {
opened: type<{ projectId: string }>(),
voteRequested: type<{ issueId: string; on: boolean }>(),
},
});
@@ -14,5 +15,7 @@ export const epicsApiEvents = eventGroup({
events: {
loaded: type<Epic[]>(),
loadFailed: type<string>(),
voted: type<void>(),
voteFailed: type<string>(),
},
});

View File

@@ -69,6 +69,10 @@ export const issuePageEvents = eventGroup({
attachmentId: string;
}>(),
commentEditRequested: type<{ commentId: string; body: string }>(),
reactRequested: type<{ commentId: string; emoji: string; on: boolean }>(),
voteRequested: type<{ issueId: string; on: boolean }>(),
/** An image pasted into a text was uploaded (it joins the ticket's files). */
imagePasted: type<{ issueId: string }>(),
commentDeleteRequested: type<{ commentId: string }>(),
},
});

View File

@@ -0,0 +1,38 @@
import { type } from '@ngrx/signals';
import { eventGroup } from '@ngrx/signals/events';
import {
BulkChange,
BulkResult,
IssueListFilter,
IssuePage,
IssuePriority,
} from '@task-stream/web/tracker/domain';
/** What the list shows, beyond the project. */
export type ListCriteria = Omit<IssueListFilter, 'projectId' | 'limit'>;
export const listPageEvents = eventGroup({
source: 'List Page',
events: {
opened: type<{ projectId: string }>(),
filtered: type<ListCriteria>(),
statusChangeRequested: type<{ issueId: string; status: string }>(),
priorityChangeRequested: type<{
issueId: string;
priority: IssuePriority;
}>(),
assignRequested: type<{ issueId: string; assigneeId: string | null }>(),
bulkRequested: type<{ issueIds: string[]; change: BulkChange }>(),
},
});
export const listApiEvents = eventGroup({
source: 'List API',
events: {
loaded: type<IssuePage>(),
loadFailed: type<string>(),
changed: type<void>(),
changeFailed: type<string>(),
bulkDone: type<BulkResult>(),
},
});

View File

@@ -48,6 +48,10 @@ export const projectPageEvents = eventGroup({
analyticsRequested: type<{ projectId: string; days: number }>(),
burnupRequested: type<{ releaseId: string }>(),
visibilityChangeRequested: type<{ projectId: string; isPublic: boolean }>(),
proposalsChangeRequested: type<{
projectId: string;
acceptsProposals: boolean;
}>(),
deleteRequested: type<{ projectId: string; confirmKey: string }>(),
},
});

View File

@@ -19,6 +19,11 @@ export class EpicsFacade {
open(projectId: string): void {
this.dispatch.opened({ projectId });
}
/** Votes for an epic (`on`) or takes the vote back. */
vote(issueId: string, on: boolean): void {
this.dispatch.voteRequested({ issueId, on });
}
}
/** Store + facade of the epics view, for its route component. */

View File

@@ -4,10 +4,11 @@ import {
Attachment,
AttachmentsGateway,
IssueLink,
IssuesGateway,
IssueLinkType,
UpdateIssueInput,
} from '@task-stream/web/tracker/domain';
import { Observable } from 'rxjs';
import { map, Observable } from 'rxjs';
import { issuePageEvents } from '../events/issue.events';
import { IssueStore } from '../stores/issue.store';
@@ -20,6 +21,7 @@ export class IssueFacade {
private readonly store = inject(IssueStore);
private readonly dispatch = injectDispatch(issuePageEvents);
private readonly files = inject(AttachmentsGateway);
private readonly issues = inject(IssuesGateway);
readonly issue = this.store.issue;
readonly comments = this.store.comments;
@@ -178,6 +180,43 @@ export class IssueFacade {
return this.files.download(issueId, attachment);
}
/** A file's bytes by id alone (an image inside a description or comment). */
fileById(attachmentId: string): Observable<Blob> {
return this.fileOf({ id: attachmentId } as Attachment);
}
/**
* Uploads an image pasted into a text and answers its id, to write
* `![name](attachment:<id>)`. It also shows among the ticket's files.
*/
uploadImage(file: File): Observable<string> {
const issueId = this.store.issue()?.id ?? '';
return this.files.upload(issueId, file).pipe(
map((uploaded) => {
this.dispatch.imagePasted({ issueId });
return uploaded.attachmentId;
}),
);
}
/** Votes for the open ticket (`on`) or takes the vote back. */
vote(on: boolean): void {
this.withIssue((issueId) => this.dispatch.voteRequested({ issueId, on }));
}
/** Adds (`on`) or takes back the signed-in person's reaction. */
react(commentId: string, emoji: string, on: boolean): void {
this.dispatch.reactRequested({ commentId, emoji, on });
}
/** A copy of what the open ticket says; answers its key. */
duplicate(): Observable<string | null> {
const issueId = this.store.issue()?.id ?? '';
return this.issues
.duplicate(issueId)
.pipe(map((result) => result.key ?? null));
}
editComment(commentId: string, body: string): void {
this.dispatch.commentEditRequested({ commentId, body });
}

View File

@@ -0,0 +1,51 @@
import { inject, Injectable, Provider } from '@angular/core';
import { injectDispatch } from '@ngrx/signals/events';
import { BulkChange, IssuePriority } from '@task-stream/web/tracker/domain';
import { ListCriteria, listPageEvents } from '../events/list.events';
import { LIST_LIMIT, ListStore } from '../stores/list.store';
/** The list view of a project, for presenters. */
@Injectable()
export class ListFacade {
private readonly store = inject(ListStore);
private readonly dispatch = injectDispatch(listPageEvents);
/** Most recently updated first (the first LIST_LIMIT). */
readonly issues = this.store.issues;
readonly total = this.store.total;
readonly criteria = this.store.criteria;
readonly limit = LIST_LIMIT;
/** False until the first load: show skeletons, not empty states. */
readonly loaded = this.store.loaded;
readonly error = this.store.error;
open(projectId: string): void {
this.dispatch.opened({ projectId });
}
filter(criteria: ListCriteria): void {
this.dispatch.filtered(criteria);
}
changeStatus(issueId: string, status: string): void {
this.dispatch.statusChangeRequested({ issueId, status });
}
changePriority(issueId: string, priority: IssuePriority): void {
this.dispatch.priorityChangeRequested({ issueId, priority });
}
assign(issueId: string, assigneeId: string | null): void {
this.dispatch.assignRequested({ issueId, assigneeId });
}
/** The same change on several tickets (each may refuse on its own). */
bulkUpdate(issueIds: string[], change: BulkChange): void {
if (issueIds.length) this.dispatch.bulkRequested({ issueIds, change });
}
}
/** Store + facade of the list view, for its route component. */
export function provideListFacade(): Provider[] {
return [ListStore, ListFacade];
}

View File

@@ -161,6 +161,13 @@ export class ProjectFacade {
this.dispatch.visibilityChangeRequested({ projectId, isPublic });
}
/** Take bug reports and ideas from anyone (while public). Owners and admins. */
setAcceptsProposals(acceptsProposals: boolean): void {
const projectId = this.projectId();
if (projectId)
this.dispatch.proposalsChangeRequested({ projectId, acceptsProposals });
}
/**
* Owner only, typing the key to confirm. Tickets, comments and releases go
* too; on success it navigates home.

View File

@@ -0,0 +1,20 @@
import { inject, Injectable } from '@angular/core';
import {
ProposalInput,
ProposalResult,
ProposalsGateway,
} from '@task-stream/web/tracker/domain';
import { Observable } from 'rxjs';
/** The public form of a project: anyone reports a bug or proposes an idea. */
@Injectable({ providedIn: 'root' })
export class ProposeFacade {
private readonly proposals = inject(ProposalsGateway);
submit(
projectKey: string,
proposal: ProposalInput,
): Observable<ProposalResult> {
return this.proposals.submit(projectKey, proposal);
}
}

View File

@@ -12,9 +12,9 @@ import {
IssuesGateway,
TrackerRealtimeGateway,
} from '@task-stream/web/tracker/domain';
import { debounceTime, startWith, switchMap } from 'rxjs';
import { debounceTime, merge, mergeMap, startWith, switchMap, tap } from 'rxjs';
import { epicsApiEvents, epicsPageEvents } from '../events/epics.events';
import { describeError } from '../notifications';
import { describeError, Notifications } from '../notifications';
interface EpicsState {
epics: Epic[];
@@ -42,11 +42,16 @@ export const EpicsStore = signalStore(
events = inject(Events),
issues = inject(IssuesGateway),
realtime = inject(TrackerRealtimeGateway),
notifications = inject(Notifications),
) => ({
// Any ticket of the project may move an epic's progress: reload, calmly.
load$: events.on(epicsPageEvents.opened).pipe(
switchMap(({ payload }) =>
realtime.issueChanges(payload.projectId).pipe(
merge(
realtime.issueChanges(payload.projectId),
// One's own vote, without waiting for the live update.
events.on(epicsApiEvents.voted),
).pipe(
debounceTime(500),
startWith(null),
switchMap(() =>
@@ -61,6 +66,19 @@ export const EpicsStore = signalStore(
),
),
),
vote$: events.on(epicsPageEvents.voteRequested).pipe(
mergeMap(({ payload }) =>
issues.vote(payload.issueId, payload.on).pipe(
mapResponse({
next: () => epicsApiEvents.voted(),
error: (error) => epicsApiEvents.voteFailed(describeError(error)),
}),
),
),
),
voteFeedback$: events
.on(epicsApiEvents.voteFailed)
.pipe(tap(({ payload }) => notifications.error(payload))),
}),
),
);

View File

@@ -244,7 +244,11 @@ export const IssueStore = signalStore(
* ticket, its comments and its subtasks are asked for twice.
*/
catchUp$: events
.on(issueApiEvents.commandSucceeded, issueApiEvents.checklistSaved)
.on(
issueApiEvents.commandSucceeded,
issueApiEvents.checklistSaved,
issuePageEvents.imagePasted,
)
.pipe(
map(() => store.issue()),
filter((issue): issue is Issue => !!issue),
@@ -391,6 +395,30 @@ export const IssueStore = signalStore(
),
),
),
events.on(issuePageEvents.voteRequested).pipe(
mergeMap(({ payload }) =>
issues.vote(payload.issueId, payload.on).pipe(
// The count is the feedback.
mapResponse({
next: () => issueApiEvents.checklistSaved(),
error: (error) =>
issueApiEvents.commandFailed(describeError(error)),
}),
),
),
),
events.on(issuePageEvents.reactRequested).pipe(
mergeMap(({ payload }) =>
comments.react(payload.commentId, payload.emoji, payload.on).pipe(
// A reaction is not worth a toast either.
mapResponse({
next: () => issueApiEvents.checklistSaved(),
error: (error) =>
issueApiEvents.commandFailed(describeError(error)),
}),
),
),
),
events.on(issuePageEvents.checklistUpdateRequested).pipe(
mergeMap(({ payload }) =>
issues

View File

@@ -0,0 +1,183 @@
import { inject } from '@angular/core';
import { mapResponse } from '@ngrx/operators';
import { signalStore, withState } from '@ngrx/signals';
import {
Events,
on,
withEventHandlers,
withReducer,
} from '@ngrx/signals/events';
import {
IssuesGateway,
IssueSummary,
TrackerRealtimeGateway,
} from '@task-stream/web/tracker/domain';
import {
combineLatest,
concatMap,
debounceTime,
map,
merge,
mergeMap,
startWith,
switchMap,
tap,
} from 'rxjs';
import {
ListCriteria,
listApiEvents,
listPageEvents,
} from '../events/list.events';
import { describeError, Notifications } from '../notifications';
/** The list asks for this many at most; past that, the filters narrow it. */
export const LIST_LIMIT = 200;
interface ListState {
projectId: string | null;
criteria: ListCriteria;
issues: IssueSummary[];
total: number;
loaded: boolean;
error: string | null;
}
/** Every ticket of a project that fits the filters, as rows. Live. */
export const ListStore = signalStore(
withState<ListState>({
projectId: null,
criteria: {},
issues: [],
total: 0,
loaded: false,
error: null,
}),
withReducer(
on(listPageEvents.opened, ({ payload }) => ({
projectId: payload.projectId,
loaded: false,
error: null,
})),
on(listPageEvents.filtered, ({ payload }) => ({ criteria: payload })),
on(listApiEvents.loaded, ({ payload }) => ({
issues: payload.items,
total: payload.total,
loaded: true,
error: null,
})),
on(listApiEvents.loadFailed, ({ payload }) => ({
loaded: true,
error: payload,
})),
),
withEventHandlers(
(
store,
events = inject(Events),
issues = inject(IssuesGateway),
realtime = inject(TrackerRealtimeGateway),
notifications = inject(Notifications),
) => {
const command = (request: ReturnType<IssuesGateway['assign']>) =>
request.pipe(
mapResponse({
next: () => listApiEvents.changed(),
error: (error) => listApiEvents.changeFailed(describeError(error)),
}),
);
return {
/**
* Reloads on opening, on each filter and on anyone's change (calmly);
* also after this page's own changes, not to wait for the live one.
*/
load$: events.on(listPageEvents.opened).pipe(
switchMap(({ payload }) =>
combineLatest([
events.on(listPageEvents.filtered).pipe(
map(({ payload: criteria }) => criteria),
startWith(store.criteria()),
debounceTime(250),
),
merge(
realtime.issueChanges(payload.projectId),
events.on(
listApiEvents.changed,
listApiEvents.changeFailed,
listApiEvents.bulkDone,
),
).pipe(debounceTime(400), startWith(null)),
]).pipe(
switchMap(([criteria]) =>
issues
.list({
...criteria,
projectId: payload.projectId,
limit: LIST_LIMIT,
})
.pipe(
mapResponse({
next: (page) => listApiEvents.loaded(page),
error: (error) =>
listApiEvents.loadFailed(describeError(error)),
}),
),
),
),
),
),
status$: events.on(listPageEvents.statusChangeRequested).pipe(
mergeMap(({ payload }) =>
command(
issues.changeStatus({
issueId: payload.issueId,
status: payload.status,
}),
),
),
),
priority$: events.on(listPageEvents.priorityChangeRequested).pipe(
mergeMap(({ payload }) =>
command(
issues.update({
issueId: payload.issueId,
priority: payload.priority,
}),
),
),
),
assign$: events
.on(listPageEvents.assignRequested)
.pipe(
mergeMap(({ payload }) =>
command(issues.assign(payload.issueId, payload.assigneeId)),
),
),
bulk$: events.on(listPageEvents.bulkRequested).pipe(
concatMap(({ payload }) =>
issues.bulkUpdate(payload.issueIds, payload.change).pipe(
mapResponse({
next: (result) => listApiEvents.bulkDone(result),
error: (error) =>
listApiEvents.changeFailed(describeError(error)),
}),
),
),
),
bulkFeedback$: events.on(listApiEvents.bulkDone).pipe(
tap(({ payload }) => {
const refused = payload.results.filter((r) => !r.ok);
if (!refused.length)
notifications.success(`${payload.updated} tickets actualizados`);
else
notifications.error(
`${payload.updated} actualizados; ${refused.length} no: ${refused[0].error}`,
);
}),
),
feedback$: events
.on(listApiEvents.changeFailed)
.pipe(tap(({ payload }) => notifications.error(payload))),
};
},
),
);

View File

@@ -419,6 +419,20 @@ export const ProjectStore = signalStore(
),
),
),
events
.on(projectPageEvents.proposalsChangeRequested)
.pipe(
mergeMap(({ payload }) =>
runCommand(
projects.update(payload),
payload.acceptsProposals
? 'Formulario público abierto: cualquiera puede proponer'
: 'Formulario público cerrado',
projectApiEvents.commandSucceeded,
projectApiEvents.commandFailed,
),
),
),
events
.on(projectPageEvents.releaseCreateRequested)
.pipe(