added tooltip and url to label option

Author: nodeful

ui/src/app/components/options/options.component.html

@@ -36,7 +36,11 @@
         </div>
 
         <!-- Label -->
-        <div *ngIf="option.type === 'label'">
+        <div *ngIf="option.type === 'label'" 
+          [class]="option.url ? 'clickable' : ''" 
+          (click)="openUrl(option.url)"
+          [eqmTooltip]="option.tooltip"
+        >
           <eqm-label>{{option.label}}</eqm-label>
         </div>
 

ui/src/app/components/options/options.component.scss

@@ -5,3 +5,7 @@
   padding: 0 2.5%;
   z-index: 5;
 }
+
+.clickable {
+  cursor: pointer !important;
+}

ui/src/app/components/options/options.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, Output, EventEmitter, ChangeDetectorRef } from '@angular/core'
+import { ApplicationService } from '../../services/app.service'
 
 interface BaseOptions {
   key: string
@@ -20,6 +21,8 @@ export interface DividerOption extends Omit<BaseOptions, 'key' | 'label'> {
 
 export interface LabelOption extends Omit<BaseOptions, 'key'> {
   type: 'label'
+  url?: string
+  tooltip?: string
 }
 
 export interface HTMLOption extends Omit<BaseOptions, 'key' | 'label'> {
@@ -68,7 +71,10 @@ export class OptionsComponent {
   @Input() options: Options = []
   @Output() checkboxToggled = new EventEmitter<CheckboxOption>()
 
-  constructor (public ref: ChangeDetectorRef) {}
+  constructor (
+    public app: ApplicationService,
+    public ref: ChangeDetectorRef
+    ) {}
 
   getOptionStyle (option: Option) {
     let style: any = {}
@@ -102,4 +108,9 @@ export class OptionsComponent {
       option.selected(selectOption.id)
     }
   }
+
+  openUrl (url?: string) {
+    if (!url) return
+    this.app.openURL(new URL(url))
+  }
 }