New dashboard look & feel

[src/xds/xds-agent.git] / webapp / src / app / pages / config / config-xds / config-xds.component.ts

diff --git a/webapp/src/app/pages/config/config-xds/config-xds.component.ts b/webapp/src/app/pages/config/config-xds/config-xds.component.ts
new file mode 100644 (file)
index 0000000..ffd236d
--- /dev/null
+++ b/webapp/src/app/pages/config/config-xds/config-xds.component.ts
@@ -0,0 +1,63 @@
+import { Component, OnInit } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+
+import { XDSConfigService } from '../../../@core-xds/services/xds-config.service';
+import { IXDServerCfg } from '../../../@core-xds/services/xdsagent.service';
+import { AlertService, IAlert } from '../../../@core-xds/services/alert.service';
+import { NotificationsComponent } from '../../notifications/notifications.component';
+
+// Import RxJs required methods
+import 'rxjs/add/operator/map';
+import 'rxjs/add/operator/catch';
+
+@Component({
+  selector: 'xds-config-xds',
+  styleUrls: ['./config-xds.component.scss'],
+  templateUrl: './config-xds.component.html',
+})
+export class ConfigXdsComponent implements OnInit {
+
+  // TODO: cleanup agentStatus$: Observable<IAgentStatus>;
+  connecting = false;
+  xdsServerUrl = '';
+  server: IXDServerCfg;
+
+  configFormChanged = false;
+
+  constructor(
+    private XdsConfigSvr: XDSConfigService,
+    private alert: AlertService,
+  ) {
+  }
+
+  ngOnInit() {
+    // FIXME support multiple servers
+
+    this.server = this.XdsConfigSvr.getCurServer();
+    this.xdsServerUrl = this.server.url;
+
+    this.XdsConfigSvr.onCurServer().subscribe(svr => {
+      this.xdsServerUrl = svr.url;
+      this.server = svr;
+    });
+  }
+
+  onSubmit() {
+    if (!this.configFormChanged && this.server.connected) {
+      return;
+    }
+    this.configFormChanged = false;
+    this.connecting = true;
+    this.server.url = this.xdsServerUrl;
+    this.XdsConfigSvr.setCurServer(this.server)
+      .subscribe(cfg => {
+        this.connecting = false;
+       },
+      err => {
+        this.connecting = false;
+        this.alert.error(err);
+      });
+  }
+
+}
+