fix(console): filters on user's list ignored if you go back from user details (#8180)

# Which Problems Are Solved - As @stebenz reported, if we apply some user filters and show user's details clicking on the table's entry, if we go back again (maybe the action has to be repeated many times to see the error in action) the filter seems to be ignored and the table shows all users. # How the Problems Are Solved - There's an issue with getting data for the user's table. On ngOnInit the data is retrieved but also the data is retrieved again when the filter is applied after going back from the user details view. Due to asynchronous calls there are some times when the getData, called from ngOnInit, finishes after the call from applySearchQuery, which applies the filter, and that's why the data in the tables shows unfiltered data. In the screenshot we see that we get two results from ngOnInit call after getting the filtered data (1 result) overwriting the filtered results. ![Captura desde 2024-06-23 14-02-30](https://github.com/zitadel/zitadel/assets/30386061/fdfa8353-04c6-4892-bd39-aa75dd4d2049) - I've added a check on ngOnInit that verifies if we have already a filter (query params) which means that we don't need to getData there as the filter and getData is going to be applied when applySearchQuery is called. Here's a video checking that the issue no longer happens: https://github.com/zitadel/zitadel/assets/30386061/9907d94f-1326-4975-8664-2a0ff51f4568 # Additional Changes - I think it's better to change the button text to apply the filter from Finish to Apply # Additional Context - Closes #8049
2024-11-22 00:39:36 +00:00 · 2024-06-28 15:04:05 +02:00 · 2024-06-28 15:04:05 +02:00 · 728158298d
commit 728158298d
parent 14aeb42cc2
18 changed files with 38 additions and 20 deletions
--- a/console/src/app/modules/filter-events/filter-events.component.html
+++ b/console/src/app/modules/filter-events/filter-events.component.html
@ -34,7 +34,7 @@
        <button mat-stroked-button type="button" (click)="reset()">{{ 'ACTIONS.RESET' | translate }}</button>
        <span class="filter-middle">{{ 'FILTER.TITLE' | translate }}</span>
        <button mat-raised-button color="primary" type="button" (click)="finish()" data-e2e="filter-finish-button">
-          {{ 'ACTIONS.FINISH' | translate }}
+          {{ 'ACTIONS.APPLY' | translate }}
        </button>
      </div>
      <form *ngIf="form" [formGroup]="form" (ngSubmit)="emitChange()">
--- a/console/src/app/modules/filter/filter.component.html
+++ b/console/src/app/modules/filter/filter.component.html
@ -23,7 +23,7 @@
      <div class="filter-top">
        <button mat-stroked-button (click)="resetted.emit()">{{ 'ACTIONS.RESET' | translate }}</button>
        <span class="filter-middle">{{ 'FILTER.TITLE' | translate }}</span>
-        <button mat-raised-button color="primary" (click)="emitFilter()">{{ 'ACTIONS.FINISH' | translate }}</button>
+        <button mat-raised-button color="primary" (click)="emitFilter()">{{ 'ACTIONS.APPLY' | translate }}</button>
      </div>
      <ng-content></ng-content>
    </div>
--- a/console/src/app/pages/users/user-list/user-table/user-table.component.ts
+++ b/console/src/app/pages/users/user-list/user-table/user-table.component.ts
@ -96,7 +96,10 @@ export class UserTableComponent implements OnInit {

  ngOnInit(): void {
    this.route.queryParams.pipe(take(1)).subscribe((params) => {
-      this.getData(this.INITIAL_PAGE_SIZE, 0, this.type);
+      if (!params['filter']) {
+        this.getData(this.INITIAL_PAGE_SIZE, 0, this.type, this.searchQueries);
+      }
+
      if (params['deferredReload']) {
        setTimeout(() => {
          this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type);
@ -116,7 +119,7 @@ export class UserTableComponent implements OnInit {
      queryParamsHandling: 'merge',
      skipLocationChange: false,
    });
-    this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type);
+    this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type, this.searchQueries);
  }

  public isAllSelected(): boolean {
@ -131,7 +134,7 @@ export class UserTableComponent implements OnInit {

  public changePage(event: PageEvent): void {
    this.selection.clear();
-    this.getData(event.pageSize, event.pageIndex * event.pageSize, this.type);
+    this.getData(event.pageSize, event.pageIndex * event.pageSize, this.type, this.searchQueries);
  }

  public deactivateSelectedUsers(): void {
--- a/console/src/assets/i18n/bg.json
+++ b/console/src/assets/i18n/bg.json
@ -497,7 +497,8 @@
    "TABLE": {
      "SHOWUSER": "Покажи потребител {{value}}"
    },
-    "DOWNLOAD": "Изтегляне"
+    "DOWNLOAD": "Изтегляне",
+    "APPLY": "Прилагам"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Има контрол върху цялата инстанция, включително всички организации",
--- a/console/src/assets/i18n/cs.json
+++ b/console/src/assets/i18n/cs.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Zobrazit uživatele {{value}}"
    },
-    "DOWNLOAD": "Stáhnout"
+    "DOWNLOAD": "Stáhnout",
+    "APPLY": "Platit"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Má kontrolu nad celou instancí, včetně všech organizací",
--- a/console/src/assets/i18n/de.json
+++ b/console/src/assets/i18n/de.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Zeige Benutzer {{value}}"
    },
-    "DOWNLOAD": "Herunterladen"
+    "DOWNLOAD": "Herunterladen",
+    "APPLY": "Anwenden"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Hat die Kontrolle über die gesamte Instanz, einschließlich aller Organisationen",
--- a/console/src/assets/i18n/en.json
+++ b/console/src/assets/i18n/en.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Show user {{value}}"
    },
-    "DOWNLOAD": "Download"
+    "DOWNLOAD": "Download",
+    "APPLY": "Apply"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Has control over the whole instance, including all organizations",
--- a/console/src/assets/i18n/es.json
+++ b/console/src/assets/i18n/es.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Mostrar usuario {{value}}"
    },
-    "DOWNLOAD": "Descargar"
+    "DOWNLOAD": "Descargar",
+    "APPLY": "Aplicar"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Tiene control sobre toda la instancia, incluyendo todas las organizaciones",
--- a/console/src/assets/i18n/fr.json
+++ b/console/src/assets/i18n/fr.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Afficher l'utilisateur {{value}}"
    },
-    "DOWNLOAD": "Télécharger"
+    "DOWNLOAD": "Télécharger",
+    "APPLY": "Appliquer"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "A le contrôle de toute l'instance, y compris toutes les organisations",
--- a/console/src/assets/i18n/it.json
+++ b/console/src/assets/i18n/it.json
@ -497,7 +497,8 @@
    "TABLE": {
      "SHOWUSER": "Mostra utente {{value}}"
    },
-    "DOWNLOAD": "Scarica"
+    "DOWNLOAD": "Scarica",
+    "APPLY": "Applicare"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Ha il controllo sull'intera istanza, comprese tutte le organizzazioni",
--- a/console/src/assets/i18n/ja.json
+++ b/console/src/assets/i18n/ja.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "ユーザー {{value}} を表示する"
    },
-    "DOWNLOAD": "ダウンロード"
+    "DOWNLOAD": "ダウンロード",
+    "APPLY": "アプライ"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "すべての組織を含むインスタンス全体を管理する権限を持ちます",
--- a/console/src/assets/i18n/mk.json
+++ b/console/src/assets/i18n/mk.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Прикажи корисник {{value}}"
    },
-    "DOWNLOAD": "Преземи"
+    "DOWNLOAD": "Преземи",
+    "APPLY": "Пријавете се"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Има контрола врз целата инстанца, вклучувајќи ги сите организации",
--- a/console/src/assets/i18n/nl.json
+++ b/console/src/assets/i18n/nl.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Toon gebruiker {{value}}"
    },
-    "DOWNLOAD": "Download"
+    "DOWNLOAD": "Download",
+    "APPLY": "Toepassen"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Heeft controle over de hele instantie, inclusief alle organisaties",
--- a/console/src/assets/i18n/pl.json
+++ b/console/src/assets/i18n/pl.json
@ -497,7 +497,8 @@
    "TABLE": {
      "SHOWUSER": "Pokaż użytkownika {{value}}"
    },
-    "DOWNLOAD": "Pobierz"
+    "DOWNLOAD": "Pobierz",
+    "APPLY": "Stosować"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Ma kontrolę nad całą instancją, włącznie z wszystkimi organizacjami",
--- a/console/src/assets/i18n/pt.json
+++ b/console/src/assets/i18n/pt.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Mostrar usuário {{value}}"
    },
-    "DOWNLOAD": "Baixar"
+    "DOWNLOAD": "Baixar",
+    "APPLY": "Aplicar"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Tem controle sobre toda a instância, incluindo todas as organizações",
--- a/console/src/assets/i18n/ru.json
+++ b/console/src/assets/i18n/ru.json
@ -497,7 +497,8 @@
    "TABLE": {
      "SHOWUSER": "Показать пользователя {{value}}"
    },
-    "DOWNLOAD": "Скачать"
+    "DOWNLOAD": "Скачать",
+    "APPLY": "Применять"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Имеет контроль над всем экземпляром, включая все организации",
--- a/console/src/assets/i18n/sv.json
+++ b/console/src/assets/i18n/sv.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Visa användare {{value}}"
    },
-    "DOWNLOAD": "Ladda ner"
+    "DOWNLOAD": "Ladda ner",
+    "APPLY": "Tillämpa"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "Har kontroll över hela instansen, inklusive alla organisationer",
--- a/console/src/assets/i18n/zh.json
+++ b/console/src/assets/i18n/zh.json
@ -498,7 +498,8 @@
    "TABLE": {
      "SHOWUSER": "Show user {{value}}"
    },
-    "DOWNLOAD": "下载"
+    "DOWNLOAD": "下载",
+    "APPLY": "申请"
  },
  "MEMBERROLES": {
    "IAM_OWNER": "控制整个实例，包括所有组织",