Merge pull request #1013 from aneoconsulting/fix/table-cell-performan…

…ce-issues fix: table-cell performance issues
aneoconsulting · Mar 27, 2024 · 2ec2945 · 2ec2945 · github-actions · Mar 27, 2024
2 parents d34daad + ae48aed
commit 2ec2945
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 12 deletions.
diff --git a/src/app/components/count-tasks-by-status.component.spec.ts b/src/app/components/count-tasks-by-status.component.spec.ts
@@ -43,9 +43,4 @@ describe('CountTasksByStatusComponent', () => {
   it('Should run', () => {
     expect(component).toBeTruthy();
   });
-
-  it('Should unsubscribe when destroyed', () => {
-    component.ngOnDestroy();
-    expect(refresh$.closed).toBeTruthy();
-  });
 });
diff --git a/src/app/components/count-tasks-by-status.component.ts b/src/app/components/count-tasks-by-status.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnDestroy, inject } from '@angular/core';
+import { Component, Input, inject } from '@angular/core';
 import { Subject, Subscription, switchMap } from 'rxjs';
 import { TasksFiltersService } from '@app/tasks/services/tasks-filters.service';
 import { TasksGrpcService } from '@app/tasks/services/tasks-grpc.service';
@@ -28,7 +28,7 @@ import { ViewTasksByStatusComponent } from '@components/view-tasks-by-status.com
     ViewTasksByStatusComponent,
   ]
 })
-export class CountTasksByStatusComponent implements OnDestroy {
+export class CountTasksByStatusComponent {
   @Input({ required: true }) statuses: TaskStatusColored[] = [];
   @Input({ required: true }) queryParams: Record<string, string> = {};
   @Input({ required: true }) refresh: Subject<void>;
@@ -57,8 +57,4 @@ export class CountTasksByStatusComponent implements OnDestroy {
     });
     this.refresh.next();
   }
-
-  ngOnDestroy(): void {
-    this.refresh.unsubscribe();
-  }
 }
diff --git a/src/app/components/table/table-cell.component.ts b/src/app/components/table/table-cell.component.ts
@@ -36,6 +36,9 @@ export class TableCellComponent<T extends ArmonikData<DataRaw>, K extends RawCol
 
   @Input({ required: true }) set column(entry: TableColumn<K>) {
     this._column = entry;
+    if (entry.key === 'count') {
+      this.refreshStatuses = new Subject<void>();
+    }
   }
 
   @Input({ required: true }) set element(entry: T) {
@@ -68,7 +71,7 @@ export class TableCellComponent<T extends ArmonikData<DataRaw>, K extends RawCol
 
   private _link: string;
   private _queryParams: Params | undefined;
-  refreshStatuses = new Subject<void>();
+  refreshStatuses: Subject<void>;
 
   get column() {
     return this._column;
File	% Stmts	% Branch	% Funcs	% Lines	Uncovered Line #s
All files	90.06	73.18	82.58	90.53
applications	100	100	100	100
index.component.ts	100	100	100	100
applications/components	92.3	82.6	81.81	95.16
table.component.ts	92.3	82.6	81.81	95.16	134, 190, 204
applications/services	87.5	77.77	76.19	88.23
applications-filters.service.ts	79.16	100	62.5	81.81	75–81
applications-grpc.service.ts	92	71.42	100	91.66	76–82
applications-index.service.ts	91.3	66.66	80	90.9	70–74
components	96.19	91.3	92.48	96.67
actions-toolbar-group.component.ts	100	100	100	100
actions-toolbar.component.ts	100	100	100	100
auto-refresh-button.component.html	100	100	100	100
auto-refresh-button.component.ts	100	60	100	100	36, 59
auto-refresh-dialog.component.html	100	100	100	100
auto-refresh-dialog.component.ts	100	100	100	100
columns-button.component.ts	100	100	100	100
columns-modify-dialog.component.html	100	100	100	100
columns-modify-dialog.component.ts	94.59	90	89.47	100	50
count-tasks-by-status.component.ts	100	50	100	100	56
icon-picker-dialog.component.html	100	100	100	100
icon-picker-dialog.component.ts	92.85	50	100	92.59	58, 71
page-header.component.html	100	100	100	100
page-header.component.ts	80	100	0	80	33
page-section-header.component.ts	80	100	0	80	31
page-section.component.ts	100	100	100	100
refresh-button.component.ts	100	100	100	100
share-url.component.ts	92.85	100	75	92.3	37
show-action-area.component.html	100	100	100	100
show-action-area.component.ts	100	100	100	100
show-actions.component.html	100	100	100	100
show-actions.component.ts	100	100	100	100
show-card-content.component.html	100	100	100	100
show-card-content.component.ts	100	100	100	100
show-card.component.html	100	100	100	100
show-card.component.ts	90.9	100	66.66	100
show-page.component.html	100	100	100	100
show-page.component.ts	100	100	100	100
spinner.component.ts	100	100	100	100
table-actions-toolbar.component.html	100	100	100	100
table-actions-toolbar.component.ts	100	100	100	100
table-container.component.ts	100	100	100	100
view-tasks-by-status-dialog.component.html	100	100	100	100
view-tasks-by-status-dialog.component.ts	100	100	100	100
view-tasks-by-status.component.ts	73.52	0	60	72.72	59, 88–106
components/filters	94.21	87.4	93.58	94.24
filters-chips.component.html	100	100	100	100
filters-chips.component.ts	100	100	100	100
filters-dialog-and.component.html	100	100	100	100
filters-dialog-and.component.ts	100	100	100	100
filters-dialog-filter-field.component.html	100	100	100	100
filters-dialog-filter-field.component.ts	92.94	87.5	97.29	92.36	104, 114, 124, 136–139, 147, 192–194, 201, 334
filters-dialog-input.component.html	100	100	100	100
filters-dialog-input.component.ts	82	78.78	71.42	83.33	57, 85–86, 142–151
filters-dialog-or.component.html	100	100	100	100
filters-dialog-or.component.ts	100	100	100	100
filters-dialog.component.html	100	100	100	100
filters-dialog.component.ts	100	100	100	100
filters-toolbar.component.html	100	100	100	100
filters-toolbar.component.ts	100	100	100	100
components/navigation	99.11	97.05	95.83	99.07
add-external-service-dialog.component.html	100	100	100	100
add-external-service-dialog.component.ts	100	100	100	100
change-language-button.component.html	100	100	100	100
change-language-button.component.ts	97.29	100	90	96.96	57
edit-external-service-dialog.component.html	100	100	100	100
edit-external-service-dialog.component.ts	100	100	100	100
form-external-service.component.html	100	100	100	100
form-external-service.component.ts	100	100	100	100
manage-external-services-dialog.component.html	100	100	100	100
manage-external-services-dialog.component.ts	100	100	100	100
navigation.component.html	100	100	100	100
navigation.component.ts	98.18	93.33	88.88	98.14	113
theme-selector.component.html	100	100	100	100
theme-selector.component.ts	100	100	100	100
components/table	79	61.11	67.85	78.78
table-actions.component.html	100	100	100	100
table-actions.component.ts	87.5	100	0	87.5	29
table-cell.component.html	100	100	100	100
table-cell.component.ts	87.93	73.33	90.47	87.93	40, 52, 105, 119, 129–133
table-empty-data.component.ts	100	100	100	100
table-inspect-object-dialog.component.html	100	100	100	100
table-inspect-object-dialog.component.ts	41.66	100	0	41.66	26–40
table-inspect-object.component.html	100	100	100	100
table-inspect-object.component.ts	60	0	0	60	31–50
dashboard	89.01	35.71	93.33	88.88
index.component.html	100	100	100	100
index.component.ts	88.88	35.71	93.33	88.76	166–180, 193, 231
dashboard/components	99.2	100	98.57	99.19
add-line-dialog.component.ts	100	100	100	100
add-statuses-group-dialog.component.ts	100	100	100	100
edit-name-line-dialog.component.ts	100	100	100	100
edit-status-group-dialog.component.ts	100	100	100	100
form-name-line.component.html	100	100	100	100
form-name-line.component.ts	95.65	100	83.33	95.65	86
form-statuses-group.component.html	100	100	100	100
form-statuses-group.component.ts	100	100	100	100
manage-groups-dialog.component.html	100	100	100	100
manage-groups-dialog.component.ts	100	100	100	100
reorganize-lines-dialog.component.html	100	100	100	100
reorganize-lines-dialog.component.ts	100	100	100	100
split-lines-dialog.component.ts	100	100	100	100
statuses-group-card.component.html	100	100	100	100
statuses-group-card.component.ts	97.91	100	100	97.72	138
dashboard/components/lines	98.01	88.88	95.74	97.96
applications-line.component.html	100	100	100	100
applications-line.component.ts	97.43	90.9	96.29	97.36	138–140
task-by-status-line.component.html	100	100	100	100
task-by-status-line.component.ts	98.79	85.71	95	98.76	210
dashboard/services	100	100	100	100
dashboard-index.service.ts	100	100	100	100
dashboard-storage.service.ts	100	100	100	100
directives	50	100	0	50
no-wrap.directive.ts	50	100	0	50	5–6
healthcheck	100	100	100	100
index.component.html	100	100	100	100
index.component.ts	100	100	100	100
healthcheck/services	100	100	100	100
healthcheck-grpc.service.ts	100	100	100	100
healthcheck-index.service.ts	100	100	100	100
partitions/components	96.15	90	88.88	96.07
table.component.html	100	100	100	100
table.component.ts	96.07	90	88.88	96	74, 121
partitions/services	21.73	0	0	18.18
partitions-index.service.ts	21.73	0	0	18.18	11–120
pipes	25	0	0	18.18
duration.pipe.ts	16.66	0	0	11.76	7–27
empty-cell.pipe.ts	50	0	0	40	6–10
results/components	97.05	100	75	96.96
table.component.html	100	100	100	100
table.component.ts	96.96	100	75	96.87	76
results/services	34.48	0	8.33	29.62
results-index.service.ts	21.73	0	0	18.18	10–117
results-statuses.service.ts	83.33	100	50	80	16
services	93.56	78.16	87.03	93.61
auto-refresh.service.ts	100	100	100	100
default-config.service.ts	100	50	100	100	193
environment.service.ts	80	100	50	75	19
filters.service.ts	50	0	37.5	52	77–93
grpc-build-request.service.ts	64.28	8.33	16.66	64.28	26, 39, 49, 59, 69
icons.service.ts	100	100	100	100
navigation.service.ts	100	80	100	100	116
notification.service.ts	100	100	100	100
query-params.service.ts	100	100	100	100
share-url.service.ts	100	100	100	100
storage.service.ts	98.18	100	100	98.11	109
table-storage.service.ts	50	0	0	42.85	11–31
table-url.service.ts	100	100	100	100
table.service.ts	100	100	100	100
tasks-by-status.service.ts	100	100	100	100
user-grpc.service.ts	100	100	100	100
user.service.ts	100	100	100	100
utils.service.ts	97.56	94.11	100	97.43	119
versions-grpc.service.ts	100	100	100	100
versions.service.ts	100	70	100	100	14, 25, 32
sessions/components	82.4	70.83	53.84	87.87
table.component.html	100	100	100	100
table.component.ts	82.24	70.83	53.84	87.75	128–144, 222–232, 254
sessions/services	46.37	21.42	25.92	45.31
sessions-filters.service.ts	66.66	50	60	70	168–186
sessions-index.service.ts	17.85	0	0	14.81	11–218
sessions-statuses.service.ts	62.5	100	25	57.14	18–26
tasks/components	76.92	42.85	54.16	81.63
table.component.html	100	100	100	100
table.component.ts	76.69	42.85	54.16	81.44	131–143, 167–189, 202
tasks/services	60.95	26	60	60.6
tasks-filters.service.ts	69.69	83.33	60	73.33	207–220
tasks-grpc.service.ts	21.21	0	0	18.75	13–155
tasks-index.service.ts	87.09	80	80	86.66	229, 295–300
tasks-statuses.service.ts	87.5	0	75	85.71	41
tokens	100	100	100	100
filters.token.ts	100	100	100	100
types	100	100	100	100
filter-definition.ts	100	100	100	100
types/components	89.65	50	88.88	92.15
table.ts	89.65	50	88.88	92.15	49, 81, 88–89