TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-02-28 23:27:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(org-selector): Remember the last selected org and order the list. (#2343)

Browse Source 
This remembers the last selected org
in localstorage instead of session storage to improve the UX. Furthermore,
the list of organizations is ordered by
name instead of just the returned
result set.
This commit is contained in:
Christoph Bühler 2021-09-15 14:15:19 +02:00 committed by GitHub
parent 50b30bc4bd
commit db3526df48
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
console/src/app/app.component.ts
View File

@ -10,7 +10,6 @@ import { ActivatedRoute, Router, RouterOutlet } from '@angular/router';
import { LangChangeEvent, TranslateService } from '@ngx-translate/core';
import { BehaviorSubject, from, Observable, of, Subject } from 'rxjs';
import { catchError, debounceTime, finalize, map, take, takeUntil } from 'rxjs/operators';
import { accountCard, adminLineAnimation, navAnimations, routeAnimations, toolbarAnimation } from './animations';
import { TextQueryMethod } from './proto/generated/zitadel/object_pb';
import { Org, OrgNameQuery, OrgQuery } from './proto/generated/zitadel/org_pb';
@ -22,6 +21,7 @@ import { ManagementService } from './services/mgmt.service';
import { ThemeService } from './services/theme.service';
import { UpdateService } from './services/update.service';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
@ -307,7 +307,7 @@ export class AppComponent implements OnDestroy {
this.orgLoading$.next(true);
this.orgs$ = from(this.authService.listMyProjectOrgs(10, 0, query ? [query] : undefined)).pipe(
map(resp => {
return resp.resultList;
return resp.resultList.sort((left, right) => left.name.localeCompare(right.name));
}),
catchError(() => of([])),
finalize(() => {

7
console/src/app/services/grpc-auth.service.ts
View File

@ -82,7 +82,8 @@ import { ListQuery } from '../proto/generated/zitadel/object_pb';
import { Org, OrgQuery } from '../proto/generated/zitadel/org_pb';
import { Gender, MembershipQuery, User, WebAuthNVerification } from '../proto/generated/zitadel/user_pb';
import { GrpcService } from './grpc.service';
import { StorageKey, StorageService } from './storage.service';
import { StorageKey, StorageLocation, StorageService } from './storage.service';
@Injectable({
@ -163,7 +164,7 @@ export class GrpcAuthService {
this.cachedOrgs = orgs;
}
const org = this.storage.getItem<Org.AsObject>(StorageKey.organization);
const org = this.storage.getItem<Org.AsObject>(StorageKey.organization, StorageLocation.local);
if (org && orgs.find(tmp => tmp.id === org.id)) {
return org;
}
@ -186,7 +187,7 @@ export class GrpcAuthService {
}
public setActiveOrg(org: Org.AsObject): void {
this.storage.setItem(StorageKey.organization, org);
this.storage.setItem(StorageKey.organization, org, StorageLocation.local);
this._activeOrgChanged.next(org);
}

26
console/src/app/services/storage.service.ts
View File

@ -7,29 +7,36 @@ const STORAGE_PREFIX = 'zitadel';
providedIn: 'root',
})
export class StorageService implements OAuthStorage {
private storage: Storage = window.sessionStorage;
private sessionStorage: Storage = window.sessionStorage;
private localStorage: Storage = window.localStorage;
constructor() { }
public setItem<TValue = string>(key: string, value: TValue): void {
this.storage.setItem(this.getPrefixedKey(key), JSON.stringify(value));
public setItem<TValue = string>(key: string, value: TValue, location: StorageLocation = StorageLocation.session): void {
this.getStorage(location).setItem(this.getPrefixedKey(key), JSON.stringify(value));
}
public getItem<TResult = string>(key: string): TResult | null {
const result = this.storage.getItem(this.getPrefixedKey(key));
public getItem<TResult = string>(key: string, location: StorageLocation = StorageLocation.session): TResult | null {
const result = this.getStorage(location).getItem(this.getPrefixedKey(key));
if (result) {
return JSON.parse(result);
}
return null;
}
public removeItem(key: string): void {
this.storage.removeItem(this.getPrefixedKey(key));
public removeItem(key: string, location: StorageLocation = StorageLocation.session): void {
this.getStorage(location).removeItem(this.getPrefixedKey(key));
}
public getPrefixedKey(key: string): string {
return `${STORAGE_PREFIX}:${key}`;
}
private getStorage(location: StorageLocation): Storage {
return location === StorageLocation.session
? this.sessionStorage
: this.localStorage;
}
}
export class StorageConfig {
@ -40,3 +47,8 @@ export class StorageConfig {
export enum StorageKey {
organization = 'organization',
}
export enum StorageLocation {
session,
local,
}