diff --git a/README.md b/README.md index 50af3ff..f52f1e4 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@

🔦

elasTasks

-

The missing UI wrapper around selected parts of the ElasticSearch Tasks API

+

The missing UI wrapper around selected parts of the ElasticSearch Tasks API

--- @@ -14,7 +14,7 @@ ## Background -Inspired by a [closed Kibana github issue](https://github.com/elastic/kibana/issues/42621): +This application attempts to solve the problem detailed in the [unresolved Kibana issue #42621](https://github.com/elastic/kibana/issues/42621): > Long-running tasks can leak processes and kill a cluster. Users need a way to detect slow queries and kill these tasks. We can start down the road of addressing this problem by building a “Tasks” app that show a list of all tasks that are running, indicate ones that are cancellable, display any available information that the API provides, and give users the ability to cancel these tasks. @@ -34,7 +34,7 @@ Locally: elasTasks is a client-side application with no server backend. Data lives only on your machine/browser. No information or ES data is sent to any server. -When connecting to an ElasticSearch host you may opt out of [CorsAnywhere](https://github.com/Rob--W/cors-anywhere/) -- a NodeJS reverse proxy which adds CORS headers to the proxied request. +When connecting to an ElasticSearch host you may opt out of enabling [CorsAnywhere](https://github.com/Rob--W/cors-anywhere/) -- a NodeJS reverse proxy which adds CORS headers to the proxied request. ## Contributing diff --git a/app/package.json b/app/package.json index 9d2164f..c30cfdd 100644 --- a/app/package.json +++ b/app/package.json @@ -1,6 +1,6 @@ { "name": "elastasks", - "version": "1.0.0", + "version": "1.1.0", "scripts": { "ng": "ng", "start": "ng serve", @@ -21,6 +21,7 @@ "@angular/router": "~9.1.9", "@types/elasticsearch": "^5.0.36", "ng-zorro-antd": "^9.3.0", + "ngx-device-detector": "^2.0.0", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" diff --git a/app/src/app/pages/login/login.component.html b/app/src/app/pages/login/login.component.html index 4856be1..848980a 100644 --- a/app/src/app/pages/login/login.component.html +++ b/app/src/app/pages/login/login.component.html @@ -1,18 +1,12 @@
- - + +
diff --git a/app/src/app/pages/login/login.component.ts b/app/src/app/pages/login/login.component.ts index 85413e5..5a26669 100644 --- a/app/src/app/pages/login/login.component.ts +++ b/app/src/app/pages/login/login.component.ts @@ -7,6 +7,8 @@ import { import { Router, ActivatedRoute } from "@angular/router"; import { HttpErrorResponse } from "@angular/common/http"; import { merge } from "rxjs"; +import { NzMessageService } from "ng-zorro-antd"; +import { DeviceDetectorService } from "ngx-device-detector"; @Component({ selector: "app-login", @@ -29,12 +31,31 @@ export class LoginComponent implements OnInit { private fb: FormBuilder, private es: ElasticsearchService, private router: Router, - private route: ActivatedRoute + private route: ActivatedRoute, + private message: NzMessageService, + private device: DeviceDetectorService ) { if (this.route.snapshot.queryParamMap.get("force")) { this.es.flushHost(); this.isLoginModalVisible = true; } + + if (this.route.snapshot.queryParamMap.get("infoMsg")) { + this.message.warning( + "Could not establish connection. Please connect to your cluster first.", + { + nzDuration: 5e3, + nzPauseOnHover: true + } + ); + } + + if (!this.device.isDesktop()) { + this.message.info("This application is optimized for desktops.", { + nzDuration: 8e3, + nzPauseOnHover: true + }); + } } private apiKeyShouldDisable() { diff --git a/app/src/app/pages/login/login.module.ts b/app/src/app/pages/login/login.module.ts index b18b527..5eff79c 100644 --- a/app/src/app/pages/login/login.module.ts +++ b/app/src/app/pages/login/login.module.ts @@ -13,7 +13,8 @@ import { NzAlertModule, NzModalModule, NzCheckboxModule, - NzTagModule + NzTagModule, + NzMessageModule } from "ng-zorro-antd"; import { ReactiveFormsModule, FormsModule } from "@angular/forms"; import { CommonModule } from "@angular/common"; @@ -33,6 +34,7 @@ import { CommonModule } from "@angular/common"; NzModalModule, NzCheckboxModule, NzTagModule, + NzMessageModule, LoginRoutingModule ], declarations: [LoginComponent], diff --git a/app/src/app/pages/tasks/tasks.component.ts b/app/src/app/pages/tasks/tasks.component.ts index f798d24..063259c 100644 --- a/app/src/app/pages/tasks/tasks.component.ts +++ b/app/src/app/pages/tasks/tasks.component.ts @@ -124,11 +124,17 @@ export class TasksComponent implements OnInit { this.es.initClient(); const r = (await this.es.ping()) as any; if (!r || (r && typeof r.tagline !== "string")) { - this.router.navigate(["/login"]); + this.router.navigate(["/login"], { + queryParams: { + infoMsg: true + } + }); return; } } else { - this.router.navigate(["/login"], { queryParams: { force: true } }); + this.router.navigate(["/login"], { + queryParams: { force: true, infoMsg: true } + }); return; } diff --git a/app/src/styles.scss b/app/src/styles.scss index 6d99f6a..640bf19 100644 --- a/app/src/styles.scss +++ b/app/src/styles.scss @@ -29,6 +29,6 @@ app-login { } } -nz-form-item + nz-alert { - margin-top: 20px; +nz-alert { + margin-bottom: 20px; }