feat(core-bwlimit-flow): enable limit speed

src/app/@dataflow/rclone/core-bwlimit-flow.ts

@@ -0,0 +1,36 @@
+import { AjaxFlowInteralNode, CombErr } from '../core';
+import { IRcloneServer } from '../extra';
+import { PostFlow } from './post-flow';
+
+export interface CoreBwlimitFlowParamsNode {
+	rate?: string;
+}
+
+export interface CoreBwlimitFlowInNode extends IRcloneServer, CoreBwlimitFlowParamsNode {}
+
+export interface CoreBwlimitFlowOutNode {
+	bandwidth: {
+		bytesPerSecond: number;
+		rate: string;
+	};
+}
+
+export abstract class CoreBwlimitFlow extends PostFlow<
+	CoreBwlimitFlowInNode,
+	CoreBwlimitFlowOutNode,
+	CoreBwlimitFlowParamsNode
+> {
+	// public prerequest$: Observable<CombErr<IRcloneServer>>;
+	protected cmd = 'core/bwlimit';
+	protected cacheSupport = false;
+	protected params = (pre: CombErr<CoreBwlimitFlowInNode>): CoreBwlimitFlowParamsNode => {
+		if (pre[1].length !== 0) return {};
+		if (pre[0].rate) return { rate: pre[0].rate };
+		return {};
+	};
+	protected reconstructAjaxResult(x: AjaxFlowInteralNode): CombErr<CoreBwlimitFlowOutNode> {
+		if (x[1].length !== 0) return [{}, x[1]] as any;
+		const rsp = x[0].ajaxRsp.response;
+		return [{ bandwidth: rsp }, []];
+	}
+}

src/app/@dataflow/rclone/index.ts

@@ -15,3 +15,4 @@ export * from './sync-copy-flow';
 export * from './sync-move-flow';
 export * from './operations-purge-flow';
 export * from './core-memstats-flow';
+export * from './core-bwlimit-flow';

src/app/pages/dashboard/dashboard.component.ts

@@ -3,7 +3,13 @@ import { ResponsiveSizeInfoRx } from 'ngx-responsive';
 import { combineLatest, Subject } from 'rxjs';
 import { map, pairwise, takeWhile } from 'rxjs/operators';
 import { CombErr } from '../../@dataflow/core';
-import { CoreMemstatsFlow, CoreStatsFlow, CoreStatsFlowInNode } from '../../@dataflow/rclone';
+import {
+	CoreBwlimitFlow,
+	CoreBwlimitFlowInNode,
+	CoreMemstatsFlow,
+	CoreStatsFlow,
+	CoreStatsFlowInNode,
+} from '../../@dataflow/rclone';
 import { FormatBytes } from '../../utils/format-bytes';
 import { ConnectionService } from '../connection.service';
 
@@ -39,7 +45,7 @@ import { ConnectionService } from '../connection.service';
 							</nb-card>
 						</nb-card-front>
 						<nb-card-back>
-							<nb-card>
+							<nb-card size="medium">
 								<nb-card-header>
 									<span>Speed Limitation</span>
 									<button
@@ -53,7 +59,34 @@ import { ConnectionService } from '../connection.service';
 									</button>
 								</nb-card-header>
 								<nb-card-body>
-									123
+									<input
+										class="limit"
+										type="text"
+										nbInput
+										placeholder="Limitation"
+										[(ngModel)]="limitation"
+									/>
+									<button
+										*ngIf="limitation !== limitationServer"
+										nbButton
+										status="primary"
+										(click)="changeLimit()"
+									>
+										Set
+									</button>
+									<nb-card>
+										<nb-card-header>
+											<h6>Rule</h6>
+										</nb-card-header>
+										<nb-card-body>
+											<ol>
+												<li>format: off | &lt;number&gt;[B|K|M|T|P...]</li>
+												<li>case-insensitive</li>
+												<li>"off" is meaning no limatation</li>
+												<li>examples: "off" "100K", "1m", "4G", "1t", "8P" ...</li>
+											</ol>
+										</nb-card-body>
+									</nb-card>
 								</nb-card-body>
 							</nb-card>
 						</nb-card-back>
@@ -100,6 +133,18 @@ import { ConnectionService } from '../connection.service';
 			:host nb-flip-card ::ng-deep div.front-container {
 				width: 100%;
 			}
+			.limit {
+				margin-bottom: 1.875rem;
+			}
+			h6 {
+				text-align: center;
+			}
+			nb-card-header {
+				display: flex;
+			}
+			nb-card-header > button {
+				margin-left: auto;
+			}
 		`,
 	],
 })
@@ -140,6 +185,15 @@ export class DashboardComponent implements OnInit, OnDestroy {
 
 	isSmallerThanSmSize = false;
 
+	limitation = '';
+	limitationServer = '';
+	private bwlimitTrigger = new Subject<string>();
+	bwlimit$: CoreBwlimitFlow;
+
+	changeLimit() {
+		this.bwlimitTrigger.next(this.limitation);
+	}
+
 	ngOnInit(): void {
 		this.resp.getResponsiveSize.subscribe(data => {
 			this.isSmallerThanSmSize = data === 'xs';
@@ -190,6 +244,26 @@ export class DashboardComponent implements OnInit, OnDestroy {
 				}
 			});
 		this.memTrigger.next(1);
+
+		this.bwlimit$ = new (class extends CoreBwlimitFlow {
+			public prerequest$ = combineLatest([
+				outer.cmdService.listCmd$.verify(this.cmd),
+				outer.bwlimitTrigger.pipe(map(input => (input === '' ? {} : { rate: input }))),
+			]).pipe(
+				map(
+					([userNode, params]): CombErr<CoreBwlimitFlowInNode> => [
+						{ ...userNode[0], ...params },
+						userNode[1],
+					]
+				)
+			);
+		})();
+		this.bwlimit$.deploy();
+		this.bwlimit$.getOutput().subscribe(x => {
+			if (x[1].length !== 0) return;
+			this.limitation = this.limitationServer = x[0].bandwidth.rate;
+		});
+		this.bwlimitTrigger.next(''); // query bandwidth
 	}
 	ngOnDestroy() {
 		this.visable = false;

src/app/pages/dashboard/dashboard.module.ts

@@ -1,10 +1,12 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
+import { FormsModule } from '@angular/forms';
 import {
 	NbButtonModule,
 	NbCardModule,
 	NbIconModule,
+	NbInputModule,
 	NbListModule,
 	NbTabsetModule,
 } from '@nebular/theme';
@@ -27,6 +29,8 @@ import { DashboardComponent } from './dashboard.component';
 		NbListModule,
 		RngModule,
 		NbTabsetModule,
+		NbInputModule,
+		FormsModule,
 	],
 })
 export class DashboardModule {}