Skip to content

Improve web readability by adding debounce constant and typo fixes #8048

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
KhizerRehan wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Improve web readability by adding debounce constant and typo fixes #8048

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions modules/web/src/app/core/components/sidenav/component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import {Member} from '@shared/entity/member';
import {Project} from '@shared/entity/project';
import {AdminSettings, CustomLink, UserSettings} from '@shared/entity/settings';
import {GroupConfig} from '@shared/model/Config';
import {sidenavCollapsibleWidth} from '@shared/constants/common';
import {DEFAULT_DEBOUNCE_TIME_MS, sidenavCollapsibleWidth} from '@shared/constants/common';
import {MemberUtils, Permission} from '@shared/utils/member';
import {BehaviorSubject, merge, Subject} from 'rxjs';
import {debounceTime, switchMap, take, takeUntil} from 'rxjs/operators';
Expand All @@ -50,7 +50,7 @@ export class SidenavComponent implements OnInit, OnDestroy {
adminSettings: AdminSettings;
isUserSshKeyEnabled = false;

private readonly _debounceTime = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;
private _selectedProject = {} as Project;
private _currentGroupConfig: GroupConfig;
private _screenWidth = new BehaviorSubject<number>(window.innerWidth);
Expand Down
15 changes: 8 additions & 7 deletions modules/web/src/app/core/services/node-data/provider/alibaba.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,10 @@ import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {NodeDataService} from '../service';
import {AlibabaService} from '@core/services/provider/alibaba';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataAlibabaProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand All @@ -51,7 +52,7 @@ export class NodeDataAlibabaProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(c => this._clusterSpecService.provider === NodeProvider.ALIBABA && !!c?.spec?.cloud?.dc))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(cluster.spec.cloud.dc).pipe(take(1))))
.pipe(tap(dc => (region = dc.spec.alibaba.region)))
Expand Down Expand Up @@ -79,7 +80,7 @@ export class NodeDataAlibabaProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(
switchMap(_ =>
Expand Down Expand Up @@ -118,7 +119,7 @@ export class NodeDataAlibabaProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(c => this._clusterSpecService.provider === NodeProvider.ALIBABA && !!c?.spec?.cloud?.dc))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(cluster.spec.cloud.dc).pipe(take(1))))
.pipe(tap(dc => (region = dc.spec.alibaba.region)))
Expand All @@ -145,7 +146,7 @@ export class NodeDataAlibabaProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(this._clusterSpecService.cluster.spec.cloud.dc)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
Expand Down Expand Up @@ -180,7 +181,7 @@ export class NodeDataAlibabaProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(c => this._clusterSpecService.provider === NodeProvider.ALIBABA && !!c?.spec?.cloud?.dc))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(cluster.spec.cloud.dc).pipe(take(1))))
.pipe(tap(dc => (region = dc.spec.alibaba.region)))
Expand All @@ -207,7 +208,7 @@ export class NodeDataAlibabaProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(this._clusterSpecService.cluster.spec.cloud.dc)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
Expand Down
15 changes: 8 additions & 7 deletions modules/web/src/app/core/services/node-data/provider/anexia.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,10 @@ import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {NodeDataService} from '../service';
import {AnexiaService} from '@core/services/provider/anexia';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataAnexiaProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand All @@ -42,7 +43,7 @@ export class NodeDataAnexiaProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.ANEXIA))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(
switchMap(cluster =>
this._presetService
Expand All @@ -64,7 +65,7 @@ export class NodeDataAnexiaProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(_ => this._anexiaService.getVLans(selectedProject, this._clusterSpecService.cluster.id)))
Expand All @@ -90,7 +91,7 @@ export class NodeDataAnexiaProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.ANEXIA))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(cluster.spec.cloud.dc).pipe(take(1))))
.pipe(tap(dc => (location = dc?.spec.anexia.locationID)))
Expand All @@ -117,7 +118,7 @@ export class NodeDataAnexiaProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(this._clusterSpecService.cluster.spec.cloud.dc)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
Expand Down Expand Up @@ -152,7 +153,7 @@ export class NodeDataAnexiaProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.ANEXIA))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(cluster.spec.cloud.dc).pipe(take(1))))
.pipe(tap(dc => (location = dc?.spec.anexia.locationID)))
Expand All @@ -179,7 +180,7 @@ export class NodeDataAnexiaProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(this._clusterSpecService.cluster.spec.cloud.dc)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
Expand Down
9 changes: 5 additions & 4 deletions modules/web/src/app/core/services/node-data/provider/aws.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,10 @@ import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, map, switchMap, take, tap} from 'rxjs/operators';
import {NodeDataService} from '../service';
import {AWSService} from '@core/services/provider/aws';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataAWSProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand Down Expand Up @@ -67,7 +68,7 @@ export class NodeDataAWSProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(_ => this._awsService.getSizes(selectedProject, this._clusterDataService.cluster.id)))
Expand All @@ -90,7 +91,7 @@ export class NodeDataAWSProvider {
case NodeDataMode.Wizard:
return this._clusterDataService.clusterChanges
.pipe(filter(_ => this._clusterDataService.provider === NodeProvider.AWS))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(
switchMap(cluster =>
this._presetService
Expand Down Expand Up @@ -125,7 +126,7 @@ export class NodeDataAWSProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(_ => this._awsService.getSubnets(selectedProject, this._clusterDataService.cluster.id)))
Expand Down
7 changes: 4 additions & 3 deletions modules/web/src/app/core/services/node-data/provider/azure.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,10 @@ import {AzureSizes, AzureZones} from '@shared/entity/provider/azure';
import {NodeProvider} from '@shared/model/NodeProviderConstants';
import {BehaviorSubject, Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataAzureProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;
acceleratedNetworking = new BehaviorSubject<boolean>(false);

constructor(
Expand All @@ -51,7 +52,7 @@ export class NodeDataAzureProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(c => this._clusterSpecService.provider === NodeProvider.AZURE && !!c?.spec?.cloud?.dc))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(switchMap(_ => this._datacenterService.getDatacenter(cluster.spec.cloud.dc).pipe(take(1))))
.pipe(tap(dc => (location = dc.spec.azure.location)))
Expand Down Expand Up @@ -113,7 +114,7 @@ export class NodeDataAzureProvider {
!this._clusterSpecService.cluster.spec.cloud.azure.assignAvailabilitySet
)
)
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(dc => (location = dc.spec.azure.location)))
.pipe(
switchMap(_ =>
Expand Down
7 changes: 4 additions & 3 deletions modules/web/src/app/core/services/node-data/provider/baremetal.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,10 @@ import {TinkerbellOSImageList} from '@shared/entity/provider/baremetal';
import {NodeProvider} from '@shared/model/NodeProviderConstants';
import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataBaremetalProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand All @@ -36,7 +37,7 @@ export class NodeDataBaremetalProvider {
switch (this._nodeDataService.mode) {
case NodeDataMode.Wizard:
return this._clusterSpecService.datacenterChanges
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.BAREMETAL))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(datacenter => this._baremetalService.getOSImages(datacenter)))
Expand All @@ -51,7 +52,7 @@ export class NodeDataBaremetalProvider {
);
case NodeDataMode.Dialog: {
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(_ => this._baremetalService.getOSImages(this._clusterSpecService.datacenter)))
.pipe(
Expand Down
7 changes: 4 additions & 3 deletions modules/web/src/app/core/services/node-data/provider/digitalocean.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,9 +22,10 @@ import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {NodeDataService} from '../service';
import {DigitalOceanService} from '@core/services/provider/digitalocean';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataDigitalOceanProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand All @@ -45,7 +46,7 @@ export class NodeDataDigitalOceanProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.DIGITALOCEAN))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(
switchMap(cluster =>
this._presetService
Expand All @@ -68,7 +69,7 @@ export class NodeDataDigitalOceanProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(
Expand Down
15 changes: 8 additions & 7 deletions modules/web/src/app/core/services/node-data/provider/gcp.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,10 @@ import _ from 'lodash';
import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {NodeDataService} from '../service';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataGCPProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand Down Expand Up @@ -55,7 +56,7 @@ export class NodeDataGCPProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.GCP))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(c => (cluster = c)))
.pipe(
switchMap(_ =>
Expand All @@ -78,7 +79,7 @@ export class NodeDataGCPProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(_ => this._gcpService.getZones(selectedProject, this._clusterSpecService.cluster.id)))
Expand Down Expand Up @@ -115,11 +116,11 @@ export class NodeDataGCPProvider {
return onErrorResumeNext(of([]));
})
)
.pipe(debounceTime(this._debounce));
.pipe(debounceTime(this._debounceTime));
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(
Expand Down Expand Up @@ -163,11 +164,11 @@ export class NodeDataGCPProvider {
return onErrorResumeNext(of([]));
})
)
.pipe(debounceTime(this._debounce));
.pipe(debounceTime(this._debounceTime));
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(
Expand Down
7 changes: 4 additions & 3 deletions modules/web/src/app/core/services/node-data/provider/hetzner.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,9 +22,10 @@ import {Observable, of, onErrorResumeNext} from 'rxjs';
import {catchError, debounceTime, filter, switchMap, take, tap} from 'rxjs/operators';
import {NodeDataService} from '../service';
import {HetznerService} from '@core/services/provider/hetzner';
import {DEFAULT_DEBOUNCE_TIME_MS} from '@shared/constants/common';

export class NodeDataHetznerProvider {
private readonly _debounce = 500;
private readonly _debounceTime = DEFAULT_DEBOUNCE_TIME_MS;

constructor(
private readonly _nodeDataService: NodeDataService,
Expand All @@ -39,7 +40,7 @@ export class NodeDataHetznerProvider {
case NodeDataMode.Wizard:
return this._clusterSpecService.clusterChanges
.pipe(filter(_ => this._clusterSpecService.provider === NodeProvider.HETZNER))
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(
switchMap(cluster =>
this._presetService
Expand All @@ -62,7 +63,7 @@ export class NodeDataHetznerProvider {
case NodeDataMode.Dialog: {
let selectedProject: string;
return this._projectService.selectedProject
.pipe(debounceTime(this._debounce))
.pipe(debounceTime(this._debounceTime))
.pipe(tap(project => (selectedProject = project.id)))
.pipe(tap(_ => (onLoadingCb ? onLoadingCb() : null)))
.pipe(switchMap(_ => this._hetznerService.getTypes(selectedProject, this._clusterSpecService.cluster.id)))
Expand Down
Loading