diff --git a/src/app/core-ui/side-nav/side-nav.component.html b/src/app/core-ui/side-nav/side-nav.component.html index 7deb3faf89..ecdc440cb5 100644 --- a/src/app/core-ui/side-nav/side-nav.component.html +++ b/src/app/core-ui/side-nav/side-nav.component.html @@ -153,7 +153,7 @@ (keydown)="checkFocusTag($event)" [workContext]="tag" [type]="WorkContextType.TAG" - [defaultIcon]="'style'" + [defaultIcon]="'label'" [activeWorkContextId]="activeWorkContextId" > } diff --git a/src/app/features/tasks/task/task.component.html b/src/app/features/tasks/task/task.component.html index 1cc198c985..68ab25bfe8 100644 --- a/src/app/features/tasks/task/task.component.html +++ b/src/app/features/tasks/task/task.component.html @@ -45,6 +45,11 @@ [matMenuTriggerFor]="projectMenu" style="visibility: hidden" > +
@@ -347,3 +352,33 @@ } + + + + @for (tag of toggleTagList(); track $index) { + + } + + + + + + diff --git a/src/app/features/tasks/task/task.component.scss b/src/app/features/tasks/task/task.component.scss index a246018375..922b598702 100644 --- a/src/app/features/tasks/task/task.component.scss +++ b/src/app/features/tasks/task/task.component.scss @@ -873,3 +873,13 @@ $min-badge-size: $s * 2.25; margin-right: -29px !important; } } + +.tag-ico { + font-size: 20px; + line-height: 20px; + height: 20px; + width: 20px; + display: inline-block; + vertical-align: middle; + margin-right: 4px; +} diff --git a/src/app/features/tasks/task/task.component.ts b/src/app/features/tasks/task/task.component.ts index 55e766db07..e3bd809cbd 100644 --- a/src/app/features/tasks/task/task.component.ts +++ b/src/app/features/tasks/task/task.component.ts @@ -48,7 +48,6 @@ import { MatMenuTrigger, } from '@angular/material/menu'; import { TODAY_TAG } from '../../tag/tag.const'; -import { DialogEditTagsForTaskComponent } from '../../tag/dialog-edit-tags/dialog-edit-tags-for-task.component'; import { WorkContextService } from '../../work-context/work-context.service'; import { throttle } from 'helpful-decorators'; import { TaskRepeatCfgService } from '../../task-repeat-cfg/task-repeat-cfg.service'; @@ -83,6 +82,7 @@ import { IssueIconPipe } from '../../issue/issue-icon/issue-icon.pipe'; import { SubTaskTotalTimeSpentPipe } from '../pipes/sub-task-total-time-spent.pipe'; import { TagListComponent } from '../../tag/tag-list/tag-list.component'; import { ShortDate2Pipe } from '../../../ui/pipes/short-date2.pipe'; +import { TagService } from '../../tag/tag.service'; @Component({ selector: 'task', @@ -133,6 +133,7 @@ export class TaskComponent implements OnDestroy, AfterViewInit { private readonly _elementRef = inject(ElementRef); private readonly _renderer = inject(Renderer2); private readonly _projectService = inject(ProjectService); + private readonly _tagService = inject(TagService); readonly plannerService = inject(PlannerService); readonly workContextService = inject(WorkContextService); @@ -175,6 +176,9 @@ export class TaskComponent implements OnDestroy, AfterViewInit { readonly projectMenuTrigger = viewChild('projectMenuTriggerEl', { read: MatMenuTrigger, }); + readonly tagMenuTrigger = viewChild('tagMenuTriggerEl', { + read: MatMenuTrigger, + }); readonly taskContextMenu = viewChild('taskContextMenu', { read: TaskContextMenuComponent, }); @@ -189,6 +193,8 @@ export class TaskComponent implements OnDestroy, AfterViewInit { ), ); + toggleTagList = toSignal(this._tagService.tagsNoMyDayAndNoList$, { initialValue: [] }); + parentTask = toSignal( this._task$.pipe( switchMap((task) => @@ -412,14 +418,26 @@ export class TaskComponent implements OnDestroy, AfterViewInit { } async editTags(): Promise { - this._matDialog - .open(DialogEditTagsForTaskComponent, { - data: { - task: this.task(), - }, - }) - .afterClosed() - .subscribe(() => this.focusSelf()); + this.tagMenuTrigger()?.openMenu(); + console.log('OPEN', this.tagMenuTrigger()); + + // this._matDialog + // .open(DialogEditTagsForTaskComponent, { + // data: { + // task: this.task(), + // }, + // }) + // .afterClosed() + // .subscribe(() => this.focusSelf()); + } + + toggleTag(tagId: string): void { + const task = this.task(); + const tagIds = task.tagIds.includes(tagId) + ? task.tagIds.filter((id) => id !== tagId) + : [...task.tagIds, tagId]; + + this.onTagsUpdated(tagIds); } addToMyDay(): void {