pigui/task-stream
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: replies to comments

Browse Source 
A comment can answer another one (replyTo), one level deep: answering a
reply joins the same thread, and it must be on the same ticket. Whoever
wrote the comment gets a new REPLIED notification, and the activity says
"respondió a un comentario".

A comment deleted while it has replies stays, without its text
(deleted: true), so the thread still reads; it goes with its last reply
and does not count in commentCount.

The ticket page shows threads with their replies indented and a
"Responder" box; REST, GraphQL and the MCP (add_comment, get_issue) take
and show replyTo. Existing comments are unchanged. Docs, Word and PDF
updated.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Josep Piguillem
2026-10-09 11:14:37 +02:00
parent c2928d2385
commit ea4ef82239
44 changed files with 517 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
libs/api/tracker/application/src/lib/commands/add-comment.command-handler.ts
View File

@@ -1,4 +1,5 @@
import { CommandHandler, EventPublisher, ICommandHandler } from '@nestjs/cqrs';
import { BusinessRuleError } from '@task-stream/api/shared/domain';
import { CommentFactory } from '@task-stream/api/tracker/domain';
import { AddCommentCommand } from './add-comment.command';
import { CommandResult, ack } from './command-result';
@@ -24,10 +25,24 @@ export class AddCommentCommandHandler
projectId: issue.projectId,
authorId: command.actorId,
body: command.body,
replyTo: command.replyTo
? await this.threadOf(command.replyTo, issue.id)
: null,
});
this.eventPublisher.mergeObjectContext(comment);
await comment.commitAndWait();
return ack(comment);
}
/**
* The top-level comment a reply hangs from: one level only, so answering
* a reply joins its thread.
*/
private async threadOf(commentId: string, issueId: string): Promise<string> {
const parent = await this.access.comment(commentId);
if (parent.issueId !== issueId)
throw new BusinessRuleError('A reply must be on the same ticket');
return parent.replyTo ?? parent.id;
}
}

2
libs/api/tracker/application/src/lib/commands/add-comment.command.ts
View File

@@ -6,6 +6,8 @@ export class AddCommentCommand extends Command<CommandResult> {
public readonly actorId: string,
public readonly issueId: string,
public readonly body: string,
/** Comment it answers; a reply to a reply joins the same thread. */
public readonly replyTo: string | null = null,
) {
super();
}

32
libs/api/tracker/application/src/lib/commands/commands.spec.ts
View File

@@ -832,6 +832,38 @@ describe('tracker commands (event sourced)', () => {
expect(rebuilt.deleted).toBe(true);
});
it('answers comments one level deep, on the same ticket', async () => {
const { run, rehydrator } = await setup();
const projectId = await projectWithTeam(run);
const spike = await run(
new CreateIssueCommand('dev', projectId, IssueType.TASK, 'Spike', {}),
);
const other = await run(
new CreateIssueCommand('dev', projectId, IssueType.TASK, 'Other', {}),
);
const root = await run(new AddCommentCommand('dev', spike.id, 'Redis?'));
const reply = await run(
new AddCommentCommand('qa', spike.id, 'Sí', root.id),
);
// Answering a reply joins the same thread.
const again = await run(
new AddCommentCommand('dev', spike.id, 'Vale', reply.id),
);
const replyTo = async (id: string) =>
(await rehydrator.rehydrate(id, Comment)).replyTo;
expect(await replyTo(root.id)).toBeNull();
expect(await replyTo(reply.id)).toBe(root.id);
expect(await replyTo(again.id)).toBe(root.id);
await expect(
run(new AddCommentCommand('dev', other.id, 'Aquí no', root.id)),
).rejects.toThrow(BusinessRuleError);
await run(new DeleteCommentCommand('qa', reply.id));
await expect(
run(new AddCommentCommand('dev', spike.id, 'Tarde', reply.id)),
).rejects.toThrow(NotFoundError);
});
it('detects concurrent modifications through stream positions', async () => {
const { run, rehydrator } = await setup();
const projectId = await projectWithTeam(run);

9
libs/api/tracker/application/src/lib/comments.service.ts
View File

@@ -15,9 +15,14 @@ export class CommentsService {
private readonly queryBus: QueryBus,
) {}
add(actorId: string, issueId: string, body: string): Promise<CommandResult> {
add(
actorId: string,
issueId: string,
body: string,
replyTo: string | null = null,
): Promise<CommandResult> {
return this.commandBus.execute(
new AddCommentCommand(actorId, issueId, body),
new AddCommentCommand(actorId, issueId, body, replyTo),
);
}

4
libs/api/tracker/application/src/lib/event-handlers/activity-summary.ts
View File

@@ -200,7 +200,9 @@ export function describeEvent(
return `${actor} quitó «${event.text}» de la lista de ${issueKey}`;
if (event instanceof CommentAddedEvent)
return `${actor} comentó en ${issueKey}`;
return event.comment.replyTo
? `${actor} respondió a un comentario en ${issueKey}`
: `${actor} comentó en ${issueKey}`;
if (event instanceof CommentEditedEvent)
return `${actor} editó un comentario en ${issueKey}`;
if (event instanceof CommentDeletedEvent)

2
libs/api/tracker/application/src/lib/event-handlers/comment-added.event-handler.ts
View File

@@ -27,6 +27,8 @@ export class CommentAddedEventHandler
projectId: comment.projectId,
author: users.of(comment.authorId),
body: comment.body,
replyTo: comment.replyTo ?? null,
deleted: false,
createdAt: comment.createdAt,
editedAt: null,
version: versionOf(event),

29
libs/api/tracker/application/src/lib/event-handlers/comment-deleted.event-handler.ts
View File

@@ -3,7 +3,7 @@ import { CommentDeletedEvent } from '@task-stream/api/tracker/domain';
import { FindCommentsRepository } from '../ports/find-comments.repository';
import { UpsertMaterializedCommentRepository } from '../ports/upsert-materialized-comment.repository';
import { UpsertMaterializedIssueRepository } from '../ports/upsert-materialized-issue.repository';
import { ReadModelNotifier } from './read-model-notifier';
import { ReadModelNotifier, versionOf } from './read-model-notifier';
@EventsHandler(CommentDeletedEvent)
export class CommentDeletedEventHandler
@@ -17,12 +17,35 @@ export class CommentDeletedEventHandler
) {}
async handle(event: CommentDeletedEvent) {
await this.upsertMaterializedCommentRepository.remove(event.aggregateId);
const comment = await this.findComments.findById(event.aggregateId);
await this.vanishOrKeep(event.aggregateId, event);
// The last reply under a deleted comment takes it along.
const parent = comment?.replyTo
? await this.findComments.findById(comment.replyTo)
: null;
if (parent?.deleted) await this.vanishOrKeep(parent.id, event);
await this.upsertMaterializedIssueRepository.setCommentCount(
event.issueId,
await this.findComments.countByIssue(event.issueId),
);
await this.notifier.comment(event.aggregateId, event.issueId, event);
await this.notifier.issue(event.issueId, event);
}
/**
* A comment with replies stays, without its text, so the conversation
* under it still reads; one without them goes.
*/
private async vanishOrKeep(id: string, event: CommentDeletedEvent) {
if (await this.findComments.countReplies(id)) {
await this.upsertMaterializedCommentRepository.upsert({
id,
version: versionOf(event),
body: '',
deleted: true,
});
} else {
await this.upsertMaterializedCommentRepository.remove(id);
}
await this.notifier.comment(id, event.issueId, event);
}
}

12
libs/api/tracker/application/src/lib/notifications/notifications.event-handler.ts
View File

@@ -11,6 +11,7 @@ import {
TrackerEvent,
withoutMentionMarkup,
} from '@task-stream/api/tracker/domain';
import { FindCommentsRepository } from '../ports/find-comments.repository';
import { FindIssuesRepository } from '../ports/find-issues.repository';
import { FindProjectsRepository } from '../ports/find-projects.repository';
import { UserDirectory } from '../ports/user-directory';
@@ -43,6 +44,7 @@ export class NotificationsEventHandler implements IEventHandler<TrackerEvent> {
private readonly findIssues: FindIssuesRepository,
private readonly findProjects: FindProjectsRepository,
private readonly users: UserDirectory,
private readonly findComments: FindCommentsRepository,
) {}
async handle(event: TrackerEvent): Promise<void> {
@@ -154,6 +156,16 @@ export class NotificationsEventHandler implements IEventHandler<TrackerEvent> {
summary: `${actor} te mencionó en ${issue.key}: ${said}`,
});
}
const answered = event.comment.replyTo
? await this.findComments.findById(event.comment.replyTo)
: null;
if (answered && !answered.deleted) {
drafts.push({
userId: answered.author.id,
kind: NotificationKind.REPLIED,
summary: `${actor} respondió a tu comentario en ${issue.key}: ${said}`,
});
}
for (const userId of [assigneeId, reporterId]) {
if (!userId) continue;
drafts.push({

36
libs/api/tracker/application/src/lib/notifications/notifications.spec.ts
View File

@@ -12,6 +12,7 @@ import {
} from '@task-stream/api/tracker/domain';
import { FakeUserDirectory } from '../../testing/in-memory';
import { ChangeFeed } from '../ports/change-feed';
import { FindCommentsRepository } from '../ports/find-comments.repository';
import { FindIssuesRepository } from '../ports/find-issues.repository';
import { FindProjectsRepository } from '../ports/find-projects.repository';
import { NotificationMailer } from '../ports/notification-mailer';
@@ -100,6 +101,13 @@ function setup(mailEnabled = false) {
}),
} as unknown as FindProjectsRepository,
users,
{
// A comment of the PM's, that others answer.
findById: async (id: string) =>
id === 'c-pm'
? { id, author: { id: 'pm', name: 'PM' }, deleted: false }
: null,
} as unknown as FindCommentsRepository,
);
return { repo, published, mailed, handler };
}
@@ -163,6 +171,7 @@ describe('notifications', () => {
projectId: 'p-1',
authorId: 'bob',
body: 'Ya está arreglado',
replyTo: null,
deleted: false,
createdAt: '2026-10-08T10:00:00.000Z',
editedAt: null,
@@ -185,6 +194,7 @@ describe('notifications', () => {
projectId: 'p-1',
authorId: 'bob',
body: '@[PM](pm) mira esto, y @[Fuera](stranger) también',
replyTo: null,
deleted: false,
createdAt: '2026-10-08T10:00:00.000Z',
editedAt: null,
@@ -200,6 +210,32 @@ describe('notifications', () => {
expect(repo.all[0].summary).toContain('«@PM mira esto');
});
it('tells whoever wrote a comment that someone answered it', async () => {
const { handler, repo } = setup();
await handler.handle(
at(
new CommentAddedEvent('bob', {
id: 'c-3',
issueId: 'i-1',
projectId: 'p-1',
authorId: 'bob',
body: 'Lo miro',
replyTo: 'c-pm',
deleted: false,
createdAt: '2026-10-08T10:00:00.000Z',
editedAt: null,
}),
1,
),
);
expect(repo.all.map((n) => [n.userId, n.kind])).toEqual([
['pm', NotificationKind.REPLIED],
['qa', NotificationKind.COMMENTED],
]);
expect(repo.all[0].summary).toContain('respondió a tu comentario');
});
it('copies by e-mail only to whoever asked for it, when mail is configured', async () => {
const { handler, repo, mailed } = setup(true);
repo.emailOn.add('bob');

2
libs/api/tracker/application/src/lib/ports/find-comments.repository.ts
View File

@@ -8,5 +8,7 @@ export abstract class FindCommentsRepository {
limit: number,
offset: number,
): Promise<Page<CommentReadModel>>;
/** Comments still standing (deleted ones kept for their replies do not count). */
abstract countByIssue(issueId: string): Promise<number>;
abstract countReplies(commentId: string): Promise<number>;
}

1
libs/api/tracker/application/src/lib/sagas/commenters-follow.saga.spec.ts
View File

@@ -11,6 +11,7 @@ describe('CommentersFollowSaga', () => {
projectId: 'p-1',
authorId: 'ana',
body: 'Lo miro',
replyTo: null,
deleted: false,
createdAt: '2026-10-08T10:00:00.000Z',
editedAt: null,

9
libs/api/tracker/domain/src/lib/comment/comment.ts
View File

@@ -15,6 +15,12 @@ export interface CommentProps {
projectId: string;
authorId: string;
body: string;
/**
* The comment this one answers; always a top-level one (one level of
* replies). Null for a top-level comment, and on comments made before
* there were replies.
*/
replyTo: string | null;
deleted: boolean;
createdAt: string;
editedAt: string | null;
@@ -22,12 +28,13 @@ export interface CommentProps {
const MAX_BODY = 20_000;
/** Decisions and explanations inside a ticket. */
/** Decisions and explanations inside a ticket, and the replies to them. */
export class Comment extends VersionedAggregateRoot implements CommentProps {
public issueId!: string;
public projectId!: string;
public authorId!: string;
public body!: string;
public replyTo: string | null = null;
public deleted = false;
public createdAt!: string;
public editedAt: string | null = null;

3
libs/api/tracker/domain/src/lib/factories/comment.factory.ts
View File

@@ -10,6 +10,8 @@ export class CommentFactory {
projectId: string;
authorId: string;
body: string;
/** Top-level comment it answers. */
replyTo?: string | null;
}): Comment {
const data: CommentProps = {
id: newId(),
@@ -17,6 +19,7 @@ export class CommentFactory {
projectId: props.projectId,
authorId: props.authorId,
body: validCommentBody(props.body),
replyTo: props.replyTo ?? null,
deleted: false,
createdAt: new Date().toISOString(),
editedAt: null,

7
libs/api/tracker/domain/src/lib/read-models/comment.read-model.ts
View File

@@ -6,6 +6,13 @@ export class CommentReadModel {
projectId!: string;
author!: UserRefReadModel;
body!: string;
/** Top-level comment it answers; null for a top-level one. */
replyTo!: string | null;
/**
* Deleted while it had replies: kept, without its text, so the
* conversation under it still makes sense. Gone with its last reply.
*/
deleted!: boolean;
createdAt!: string;
editedAt!: string | null;
version!: number;

2
libs/api/tracker/domain/src/lib/read-models/notification.read-model.ts
View File

@@ -12,6 +12,8 @@ export enum NotificationKind {
COMMENTED = 'COMMENTED',
/** Someone wrote @you. */
MENTIONED = 'MENTIONED',
/** Someone answered a comment of yours. */
REPLIED = 'REPLIED',
/** A ticket you follow changed. */
WATCHED = 'WATCHED',
/** You were added to a project. */

17
libs/api/tracker/infrastructure/src/lib/mongo/find.repositories.ts
View File

@@ -45,6 +45,13 @@ import {
/* Query-side adapters (MongoDB). */
/** Comments projected before there were replies have neither field. */
const commentFromDoc = (doc: CommentDoc): CommentReadModel => ({
...fromDoc(doc),
replyTo: doc.replyTo ?? null,
deleted: doc.deleted ?? false,
});
const escapeRegex = (text: string) =>
text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
@@ -446,7 +453,7 @@ export class MongoFindCommentsRepository extends FindCommentsRepository {
async findById(id: string): Promise<CommentReadModel | null> {
const doc = await this.comments.findById(id).lean<CommentDoc>();
return doc ? fromDoc(doc) : null;
return doc ? commentFromDoc(doc) : null;
}
async findByIssue(
@@ -463,11 +470,15 @@ export class MongoFindCommentsRepository extends FindCommentsRepository {
.lean<CommentDoc[]>(),
this.comments.countDocuments({ issueId }),
]);
return { items: docs.map(fromDoc), total };
return { items: docs.map(commentFromDoc), total };
}
countByIssue(issueId: string): Promise<number> {
return this.comments.countDocuments({ issueId });
return this.comments.countDocuments({ issueId, deleted: { $ne: true } });
}
countReplies(commentId: string): Promise<number> {
return this.comments.countDocuments({ replyTo: commentId });
}
}

1
libs/api/tracker/infrastructure/src/lib/mongo/read-model.schemas.ts
View File

@@ -151,6 +151,7 @@ export const CommentSchema = new Schema<CommentDoc>(
{
_id: String,
issueId: { type: String, index: true },
replyTo: { type: String, index: true },
author: userRef,
version: Number,
},

9
libs/api/tracker/presenters/src/lib/graphql/comment.resolver.ts
View File

@@ -8,13 +8,18 @@ import { CommandResultGql, CommentGql } from './types';
export class CommentResolver {
constructor(private readonly comments: CommentsService) {}
@Mutation(() => CommandResultGql)
@Mutation(() => CommandResultGql, {
description:
'Comment on a ticket, or answer a comment (replyTo; one level of replies)',
})
addComment(
@CurrentUser() me: User,
@Args('issueId', { type: () => ID }) issueId: string,
@Args('body') body: string,
@Args('replyTo', { type: () => ID, nullable: true })
replyTo: string | null,
) {
return this.comments.add(me.id, issueId, body);
return this.comments.add(me.id, issueId, body, replyTo ?? null);
}
@Mutation(() => CommandResultGql)

12
libs/api/tracker/presenters/src/lib/graphql/types.ts
View File

@@ -445,7 +445,17 @@ export class CommentGql {
@Field(() => ID) id!: string;
@Field(() => ID) issueId!: string;
@Field(() => UserRefGql) author!: UserRefGql;
@Field() body!: string;
@Field({ description: 'Empty on a deleted comment kept for its replies' })
body!: string;
@Field(() => ID, {
nullable: true,
description: 'The top-level comment it answers; null for a top-level one',
})
replyTo!: string | null;
@Field({
description: 'Deleted, but kept (without its text) while it has replies',
})
deleted!: boolean;
@Field() createdAt!: string;
@Field(() => String, { nullable: true }) editedAt!: string | null;
@Field(() => Int) version!: number;

11
libs/api/tracker/presenters/src/lib/http/dto/requests.dto.ts
View File

@@ -955,6 +955,17 @@ export class CommentBodyDto {
body!: string;
}
export class AddCommentDto extends CommentBodyDto {
@ApiPropertyOptional({
format: 'uuid',
description:
'Comment it answers (one level: answering a reply joins its thread)',
})
@IsOptional()
@IsUUID()
replyTo?: string;
}
// ---- Releases ---------------------------------------------------------------
export class CreateReleaseDto {

16
libs/api/tracker/presenters/src/lib/http/dto/responses.dto.ts
View File

@@ -466,7 +466,21 @@ export class CommentDto {
@ApiProperty({ format: 'uuid' }) id!: string;
@ApiProperty({ format: 'uuid' }) issueId!: string;
@ApiProperty({ type: UserRefDto }) author!: UserRefDto;
@ApiProperty() body!: string;
@ApiProperty({
description: 'Empty on a deleted comment kept for its replies',
})
body!: string;
@ApiProperty({
type: String,
nullable: true,
format: 'uuid',
description: 'The top-level comment it answers; null for a top-level one',
})
replyTo!: string | null;
@ApiProperty({
description: 'Deleted, but kept (without its text) while it has replies',
})
deleted!: boolean;
@ApiProperty({ format: 'date-time' }) createdAt!: string;
@ApiProperty({ type: String, nullable: true, format: 'date-time' })
editedAt!: string | null;

9
libs/api/tracker/presenters/src/lib/http/issues.controller.ts
View File

@@ -39,7 +39,7 @@ import {
BulkUpdateIssuesDto,
ChangeStatusDto,
ChecklistItemBodyDto,
CommentBodyDto,
AddCommentDto,
CreateIssueDto,
IssueSearchQueryDto,
LinkIssueDto,
@@ -529,18 +529,21 @@ export class IssuesController {
@Post('issues/:issue/comments')
@ISSUE
@ApiOperation({ summary: 'Comment on the ticket' })
@ApiOperation({
summary: 'Comment on the ticket, or answer a comment (replyTo)',
})
@ApiCreatedResponse({ type: CommandResultDto })
@ApiCommandErrors()
async addComment(
@CurrentUser() me: User,
@Param('issue') issue: string,
@Body() body: CommentBodyDto,
@Body() body: AddCommentDto,
) {
return this.comments.add(
me.id,
await this.refs.issueId(me.id, issue),
body.body,
body.replyTo ?? null,
);
}

2
libs/web/tracker/application/src/lib/events/issue.events.ts
View File

@@ -39,6 +39,8 @@ export const issuePageEvents = eventGroup({
body: string;
/** Uploaded under the new comment once it exists. */
files?: File[];
/** Comment it answers (one level of replies). */
replyTo?: string | null;
}>(),
watchRequested: type<{ issueId: string; watching: boolean }>(),
trashRequested: type<{ issueId: string; trashed: boolean }>(),

10
libs/web/tracker/application/src/lib/facades/issue.facade.ts
View File

@@ -92,10 +92,14 @@ export class IssueFacade {
);
}
/** `files` are attached under the new comment. */
addComment(body: string, files: File[] = []): void {
/** `files` are attached under the new comment; `replyTo` answers one. */
addComment(
body: string,
files: File[] = [],
replyTo: string | null = null,
): void {
this.withIssue((issueId) =>
this.dispatch.commentAddRequested({ issueId, body, files }),
this.dispatch.commentAddRequested({ issueId, body, files, replyTo }),
);
}

6
libs/web/tracker/application/src/lib/stores/issue.store.ts
View File

@@ -460,7 +460,7 @@ export const IssueStore = signalStore(
mergeMap(({ payload }) =>
runCommand(
comments
.add(payload.issueId, payload.body)
.add(payload.issueId, payload.body, payload.replyTo ?? null)
.pipe(
concatMap((comment) =>
payload.files?.length
@@ -474,7 +474,9 @@ export const IssueStore = signalStore(
),
payload.files?.length
? 'Comentario y adjuntos añadidos'
: 'Comentario añadido',
: payload.replyTo
? 'Respuesta añadida'
: 'Comentario añadido',
done,
failed,
),

1
libs/web/tracker/domain/src/lib/models/enums.ts
View File

@@ -53,6 +53,7 @@ export enum NotificationKind {
QA_FAILED = 'QA_FAILED',
COMMENTED = 'COMMENTED',
MENTIONED = 'MENTIONED',
REPLIED = 'REPLIED',
WATCHED = 'WATCHED',
ADDED_TO_PROJECT = 'ADDED_TO_PROJECT',
REMINDER = 'REMINDER',

5
libs/web/tracker/domain/src/lib/models/models.ts
View File

@@ -269,7 +269,12 @@ export interface Comment {
id: string;
issueId: string;
author: UserRef;
/** Empty on a deleted comment kept for its replies. */
body: string;
/** The top-level comment it answers; null for a top-level one. */
replyTo: string | null;
/** Deleted, but kept (without its text) while it has replies. */
deleted: boolean;
createdAt: string;
editedAt: string | null;
}

6
libs/web/tracker/domain/src/lib/ports/gateways.ts
View File

@@ -230,7 +230,11 @@ export abstract class SavedFiltersGateway {
export abstract class CommentsGateway {
abstract list(issueId: string): Observable<Comment[]>;
abstract add(issueId: string, body: string): Observable<CommandResult>;
abstract add(
issueId: string,
body: string,
replyTo?: string | null,
): Observable<CommandResult>;
abstract edit(commentId: string, body: string): Observable<CommandResult>;
abstract remove(commentId: string): Observable<CommandResult>;
}

8
libs/web/tracker/infrastructure/src/lib/adapters/graphql-collaboration.gateways.ts
View File

@@ -42,9 +42,13 @@ export class GraphqlCommentsGateway extends CommentsGateway {
.pipe(map((d) => d.issue.comments.items.map(toComment)));
}
add(issueId: string, body: string): Observable<CommandResult> {
add(
issueId: string,
body: string,
replyTo: string | null = null,
): Observable<CommandResult> {
return this.gql
.mutate(AddCommentDocument, { issueId, body })
.mutate(AddCommentDocument, { issueId, body, replyTo })
.pipe(map((d) => toCommandResult(d.addComment)));
}

2
libs/web/tracker/infrastructure/src/lib/graphql/fragments.graphql
View File

@@ -141,6 +141,8 @@ fragment CommentFields on Comment {
id
issueId
body
replyTo
deleted
createdAt
editedAt
author {

30
libs/web/tracker/infrastructure/src/lib/graphql/generated.ts
View File

@@ -212,6 +212,7 @@ export type NotificationKind =
| 'MENTIONED'
| 'QA_FAILED'
| 'REMINDER'
| 'REPLIED'
| 'STATUS_CHANGED'
| 'WATCHED';
@@ -554,6 +555,8 @@ export type CommentFieldsFragment = {
id: string;
issueId: string;
body: string;
replyTo: string | null;
deleted: boolean;
createdAt: string;
editedAt: string | null;
author: { id: string; name: string };
@@ -875,6 +878,8 @@ export type IssueCommentsQuery = {
id: string;
issueId: string;
body: string;
replyTo: string | null;
deleted: boolean;
createdAt: string;
editedAt: string | null;
author: { id: string; name: string };
@@ -886,6 +891,7 @@ export type IssueCommentsQuery = {
export type AddCommentMutationVariables = Exact<{
issueId: string;
body: string;
replyTo?: string | null | undefined;
}>;
export type AddCommentMutation = {
@@ -1853,6 +1859,8 @@ export type CommentChangedSubscription = {
id: string;
issueId: string;
body: string;
replyTo: string | null;
deleted: boolean;
createdAt: string;
editedAt: string | null;
author: { id: string; name: string };
@@ -2698,6 +2706,8 @@ export const CommentFieldsFragmentDoc = {
{ kind: 'Field', name: { kind: 'Name', value: 'id' } },
{ kind: 'Field', name: { kind: 'Name', value: 'issueId' } },
{ kind: 'Field', name: { kind: 'Name', value: 'body' } },
{ kind: 'Field', name: { kind: 'Name', value: 'replyTo' } },
{ kind: 'Field', name: { kind: 'Name', value: 'deleted' } },
{ kind: 'Field', name: { kind: 'Name', value: 'createdAt' } },
{ kind: 'Field', name: { kind: 'Name', value: 'editedAt' } },
{
@@ -5477,6 +5487,8 @@ export const IssueCommentsDocument = {
{ kind: 'Field', name: { kind: 'Name', value: 'id' } },
{ kind: 'Field', name: { kind: 'Name', value: 'issueId' } },
{ kind: 'Field', name: { kind: 'Name', value: 'body' } },
{ kind: 'Field', name: { kind: 'Name', value: 'replyTo' } },
{ kind: 'Field', name: { kind: 'Name', value: 'deleted' } },
{ kind: 'Field', name: { kind: 'Name', value: 'createdAt' } },
{ kind: 'Field', name: { kind: 'Name', value: 'editedAt' } },
{
@@ -5527,6 +5539,14 @@ export const AddCommentDocument = {
},
},
},
{
kind: 'VariableDefinition',
variable: {
kind: 'Variable',
name: { kind: 'Name', value: 'replyTo' },
},
type: { kind: 'NamedType', name: { kind: 'Name', value: 'ID' } },
},
],
selectionSet: {
kind: 'SelectionSet',
@@ -5551,6 +5571,14 @@ export const AddCommentDocument = {
name: { kind: 'Name', value: 'body' },
},
},
{
kind: 'Argument',
name: { kind: 'Name', value: 'replyTo' },
value: {
kind: 'Variable',
name: { kind: 'Name', value: 'replyTo' },
},
},
],
selectionSet: {
kind: 'SelectionSet',
@@ -11232,6 +11260,8 @@ export const CommentChangedDocument = {
{ kind: 'Field', name: { kind: 'Name', value: 'id' } },
{ kind: 'Field', name: { kind: 'Name', value: 'issueId' } },
{ kind: 'Field', name: { kind: 'Name', value: 'body' } },
{ kind: 'Field', name: { kind: 'Name', value: 'replyTo' } },
{ kind: 'Field', name: { kind: 'Name', value: 'deleted' } },
{ kind: 'Field', name: { kind: 'Name', value: 'createdAt' } },
{ kind: 'Field', name: { kind: 'Name', value: 'editedAt' } },
{

4
libs/web/tracker/infrastructure/src/lib/graphql/issues.graphql
View File

@@ -112,8 +112,8 @@ query IssueComments($idOrKey: String!) {
}
}
mutation AddComment($issueId: ID!, $body: String!) {
addComment(issueId: $issueId, body: $body) {
mutation AddComment($issueId: ID!, $body: String!, $replyTo: ID) {
addComment(issueId: $issueId, body: $body, replyTo: $replyTo) {
...CommandResultFields
}
}

29
libs/web/tracker/presenters/src/lib/pages/issue.page.scss
View File

@@ -531,3 +531,32 @@ a.ts-key {
border-radius: 0.5rem;
background: color-mix(in srgb, var(--ts-c-red, #dc2626) 12%, transparent);
}
// One level of replies under each comment.
.ts-replies {
display: grid;
gap: 0.75rem;
margin: -0.25rem 0 0.5rem 2.75rem;
padding-left: 0.875rem;
border-left: 2px solid var(--ts-line);
&:empty {
display: none;
}
}
.ts-comment__gone {
margin: 0;
font-style: italic;
}
.ts-reply__open {
justify-self: start;
font-size: 0.8125rem;
}
.ts-reply__actions {
display: flex;
gap: 0.75rem;
align-items: center;
}

104
libs/web/tracker/presenters/src/lib/pages/issue.page.ts
View File

@@ -1,3 +1,4 @@
import { NgTemplateOutlet } from '@angular/common';
import {
ChangeDetectionStrategy,
Component,
@@ -71,6 +72,7 @@ const MAX_FILE_BYTES = 25 * 1024 * 1024;
selector: 'ts-issue-page',
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [
NgTemplateOutlet,
RouterLink,
FormField,
AttachmentItem,
@@ -512,22 +514,24 @@ const MAX_FILE_BYTES = 25 * 1024 * 1024;
<article class="ts-block">
<h2 class="ts-section">
Comentarios
<span class="ts-mono">{{ facade.comments().length }}</span>
<span class="ts-mono">{{ commentCount() }}</span>
</h2>
@for (comment of facade.comments(); track comment.id) {
<ng-template #commentView let-comment>
<div class="ts-comment">
<span class="ts-comment__avatar" aria-hidden="true">{{
initialsOf(comment.author.name)
}}</span>
<div class="ts-comment__body">
<div class="ts-comment__head">
<strong>{{ comment.author.name }}</strong>
<strong>{{
comment.deleted ? '—' : comment.author.name
}}</strong>
<span class="ts-comment__when"
>{{ ago(comment.createdAt)
}}{{ comment.editedAt ? ' · editado' : '' }}</span
>
<span class="ts-spacer"></span>
@if (comment.author.id === facade.me()) {
@if (!comment.deleted && comment.author.id === facade.me()) {
<pi-icon-button
icon="edit"
color="grey"
@@ -537,7 +541,8 @@ const MAX_FILE_BYTES = 25 * 1024 * 1024;
/>
}
@if (
comment.author.id === facade.me() || project.canManage()
!comment.deleted &&
(comment.author.id === facade.me() || project.canManage())
) {
<pi-icon-button
icon="trash"
@@ -548,6 +553,9 @@ const MAX_FILE_BYTES = 25 * 1024 * 1024;
/>
}
</div>
@if (comment.deleted) {
<p class="ts-muted ts-comment__gone">Comentario borrado</p>
} @else {
<p class="ts-prewrap">
@for (part of segments(comment.body); track $index) {
@if ('mention' in part) {
@@ -561,7 +569,8 @@ const MAX_FILE_BYTES = 25 * 1024 * 1024;
}
}
</p>
@if (filesOf(comment).length) {
}
@if (!comment.deleted && filesOf(comment).length) {
<div class="ts-attachments">
@for (file of filesOf(comment); track file.id) {
<ts-attachment
@@ -573,6 +582,57 @@ const MAX_FILE_BYTES = 25 * 1024 * 1024;
}
</div>
</div>
</ng-template>
@for (thread of threads(); track thread.comment.id) {
<ng-container
*ngTemplateOutlet="commentView; context: { $implicit: thread.comment }"
/>
<div class="ts-replies">
@for (reply of thread.replies; track reply.id) {
<ng-container
*ngTemplateOutlet="commentView; context: { $implicit: reply }"
/>
}
@if (replyingTo() === thread.comment.id) {
<form
class="ts-form ts-reply"
(submit)="$event.preventDefault(); reply(thread.comment)"
novalidate
>
<pi-textarea
[placeholder]="'Responde a ' + thread.comment.author.name + '…'"
[(value)]="replyBody"
/>
<div class="ts-reply__actions">
<pi-action-button
color="primary"
text="Responder"
[disabled]="!replyBody().trim()"
(execute)="reply(thread.comment)"
/>
<button
type="button"
class="ts-plain-link"
(click)="replyingTo.set(null)"
>
Cancelar
</button>
</div>
</form>
} @else if (project.canContribute() && !thread.comment.deleted) {
<button
type="button"
class="ts-plain-link ts-reply__open"
(click)="startReply(thread.comment)"
>
Responder{{
thread.replies.length
? ' (' + thread.replies.length + ')'
: ''
}}
</button>
}
</div>
}
@if (project.canContribute()) {
<form
@@ -934,6 +994,25 @@ export class IssuePage {
protected readonly linkType = signal<string | null>(IssueLinkType.RELATES_TO);
protected readonly linkTarget = signal('');
protected readonly commentBody = signal('');
/** The comment being answered, and the answer being written. */
protected readonly replyingTo = signal<string | null>(null);
protected readonly replyBody = signal('');
/** Top-level comments, each with its replies (oldest first). */
protected readonly threads = computed(() => {
const comments = this.facade.comments();
const ids = new Set(comments.map((c) => c.id));
const replies = new Map<string, Comment[]>();
for (const c of comments)
if (c.replyTo && ids.has(c.replyTo))
replies.set(c.replyTo, [...(replies.get(c.replyTo) ?? []), c]);
// A reply whose comment did not load stands on its own.
return comments
.filter((c) => !c.replyTo || !ids.has(c.replyTo))
.map((comment) => ({ comment, replies: replies.get(comment.id) ?? [] }));
});
protected readonly commentCount = computed(
() => this.facade.comments().filter((c) => !c.deleted).length,
);
protected readonly commentFiles = signal<File[]>([]);
protected readonly segments = mentionSegments;
/** Members matching what is typed after an `@` at the end of the comment. */
@@ -1126,6 +1205,19 @@ export class IssuePage {
this.commentFiles.set([]);
}
protected startReply(comment: Comment): void {
this.replyBody.set('');
this.replyingTo.set(comment.id);
}
protected reply(comment: Comment): void {
const body = this.replyBody().trim();
if (!body) return;
this.facade.addComment(body, [], comment.id);
this.replyBody.set('');
this.replyingTo.set(null);
}
protected mention(user: { id: string; name: string }): void {
this.commentBody.update((text) => insertMention(text, user));
}

1
libs/web/tracker/presenters/src/lib/ui/notifications-bell.ts
View File

@@ -27,6 +27,7 @@ const ICON: Record<NotificationKind, string> = {
[NotificationKind.QA_FAILED]: 'exclamation',
[NotificationKind.COMMENTED]: 'chat',
[NotificationKind.MENTIONED]: 'chat',
[NotificationKind.REPLIED]: 'chat',
[NotificationKind.WATCHED]: 'focus',
[NotificationKind.ADDED_TO_PROJECT]: 'briefcase',
[NotificationKind.REMINDER]: 'calendar',