fix(console): add state filter to org table, filter context (#5650)

* fix: add state filter to org table, filter context

---------

Co-authored-by: adlerhurst <silvan.reusser@gmail.com>

console/src/app/modules/filter-org/filter-org.component.html

@@ -22,5 +22,28 @@
         </cnsl-form-field>
       </div>
     </div>
+
+    <div class="name-query">
+      <mat-checkbox
+        id="state"
+        class="cb"
+        [checked]="getSubFilter(SubQuery.STATE)"
+        (change)="changeCheckbox(SubQuery.STATE, $event)"
+        >{{ 'FILTER.STATE' | translate }}
+      </mat-checkbox>
+      <div class="subquery" *ngIf="getSubFilter(SubQuery.STATE) as sq">
+        <span class="nomethod cnsl-secondary-text">
+          {{ 'FILTER.METHODS.1' | translate }}
+        </span>
+
+        <cnsl-form-field class="filter-select-value">
+          <mat-select [value]="sq.getState()" (selectionChange)="setValue(SubQuery.STATE, sq, $event)">
+            <mat-option *ngFor="let state of states" [value]="state">
+              {{ 'USER.STATE.' + state | translate }}
+            </mat-option>
+          </mat-select>
+        </cnsl-form-field>
+      </div>
+    </div>
   </div>
 </cnsl-filter>

console/src/app/modules/filter-org/filter-org.component.ts

@@ -3,13 +3,14 @@ import { MatLegacyCheckboxChange as MatCheckboxChange } from '@angular/material/
 import { ActivatedRoute, Router } from '@angular/router';
 import { take } from 'rxjs';
 import { TextQueryMethod } from 'src/app/proto/generated/zitadel/object_pb';
-import { OrgNameQuery, OrgQuery, OrgState } from 'src/app/proto/generated/zitadel/org_pb';
+import { OrgNameQuery, OrgQuery, OrgState, OrgStateQuery } from 'src/app/proto/generated/zitadel/org_pb';
 import { UserNameQuery } from 'src/app/proto/generated/zitadel/user_pb';
 
 import { FilterComponent } from '../filter/filter.component';
 
 enum SubQuery {
   NAME,
+  STATE,
 }
 
 @Component({
@@ -21,7 +22,7 @@ export class FilterOrgComponent extends FilterComponent implements OnInit {
   public SubQuery: any = SubQuery;
   public searchQueries: OrgQuery[] = [];
 
-  public states: OrgState[] = [OrgState.ORG_STATE_ACTIVE, OrgState.ORG_STATE_INACTIVE];
+  public states: OrgState[] = [OrgState.ORG_STATE_ACTIVE, OrgState.ORG_STATE_INACTIVE, OrgState.ORG_STATE_REMOVED];
 
   constructor(router: Router, protected route: ActivatedRoute) {
     super(router, route);
@@ -37,13 +38,17 @@ export class FilterOrgComponent extends FilterComponent implements OnInit {
         const orgQueries = filters.map((filter) => {
           if (filter.nameQuery) {
             const orgQuery = new OrgQuery();
-
             const orgNameQuery = new OrgNameQuery();
             orgNameQuery.setName(filter.nameQuery.name);
             orgNameQuery.setMethod(filter.nameQuery.method);
-
             orgQuery.setNameQuery(orgNameQuery);
             return orgQuery;
+          } else if (filter.stateQuery) {
+            const orgQuery = new OrgQuery();
+            const orgStateQuery = new OrgStateQuery();
+            orgStateQuery.setState(filter.stateQuery.state);
+            orgQuery.setStateQuery(orgStateQuery);
+            return orgQuery;
           } else {
             return undefined;
           }
@@ -64,12 +69,17 @@ export class FilterOrgComponent extends FilterComponent implements OnInit {
           const nq = new OrgNameQuery();
           nq.setMethod(TextQueryMethod.TEXT_QUERY_METHOD_CONTAINS_IGNORE_CASE);
           nq.setName('');
-
           const oq = new OrgQuery();
           oq.setNameQuery(nq);
-
           this.searchQueries.push(oq);
           break;
+        case SubQuery.STATE:
+          const sq = new OrgStateQuery();
+          sq.setState(OrgState.ORG_STATE_ACTIVE);
+          const osq = new OrgQuery();
+          osq.setStateQuery(sq);
+          this.searchQueries.push(osq);
+          break;
       }
     } else {
       switch (subquery) {
@@ -79,6 +89,12 @@ export class FilterOrgComponent extends FilterComponent implements OnInit {
             this.searchQueries.splice(index_dn, 1);
           }
           break;
+        case SubQuery.STATE:
+          const index_sn = this.searchQueries.findIndex((q) => (q as OrgQuery).toObject().stateQuery !== undefined);
+          if (index_sn > -1) {
+            this.searchQueries.splice(index_sn, 1);
+          }
+          break;
       }
     }
   }
@@ -90,6 +106,10 @@ export class FilterOrgComponent extends FilterComponent implements OnInit {
         (query as OrgNameQuery).setName(value);
         this.filterChanged.emit(this.searchQueries ? this.searchQueries : []);
         break;
+      case SubQuery.STATE:
+        (query as OrgStateQuery).setState(value);
+        this.filterChanged.emit(this.searchQueries ? this.searchQueries : []);
+        break;
     }
   }
 
@@ -102,6 +122,13 @@ export class FilterOrgComponent extends FilterComponent implements OnInit {
         } else {
           return undefined;
         }
+      case SubQuery.STATE:
+        const sn = this.searchQueries.find((q) => (q as OrgQuery).toObject().stateQuery !== undefined);
+        if (sn) {
+          return (sn as OrgQuery).getStateQuery();
+        } else {
+          return undefined;
+        }
     }
   }
 

console/src/app/modules/org-context/org-context.component.ts

@@ -3,7 +3,7 @@ import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild }
 import { UntypedFormControl } from '@angular/forms';
 import { BehaviorSubject, catchError, debounceTime, finalize, from, map, Observable, of, pipe, tap } from 'rxjs';
 import { TextQueryMethod } from 'src/app/proto/generated/zitadel/object_pb';
-import { Org, OrgNameQuery, OrgQuery } from 'src/app/proto/generated/zitadel/org_pb';
+import { Org, OrgNameQuery, OrgQuery, OrgState, OrgStateQuery } from 'src/app/proto/generated/zitadel/org_pb';
 import { AuthenticationService } from 'src/app/services/authentication.service';
 import { GrpcAuthService } from 'src/app/services/grpc-auth.service';
 
@@ -47,9 +47,12 @@ export class OrgContextComponent implements OnInit {
       }
     }
 
-    let query;
+    let query = new OrgQuery();
+    const orgStateQuery = new OrgStateQuery();
+    orgStateQuery.setState(OrgState.ORG_STATE_ACTIVE);
+    query.setStateQuery(orgStateQuery);
+
     if (filter) {
-      query = new OrgQuery();
       const orgNameQuery = new OrgNameQuery();
       orgNameQuery.setName(filter);
       orgNameQuery.setMethod(TextQueryMethod.TEXT_QUERY_METHOD_CONTAINS_IGNORE_CASE);

console/src/app/pages/users/user-list/user-table/user-table.component.ts

@@ -204,6 +204,7 @@ export class UserTableComponent implements OnInit {
           sortingField = UserFieldName.USER_FIELD_NAME_CREATION_DATE;
           break;
       }
+
     this.userService
       .listUsers(
         limit,