UI: Rule nodes configuration

ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.scss

@@ -0,0 +1,21 @@
+/**
+ * Copyright © 2016-2019 The Thingsboard Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+:host {
+  form {
+    overflow-x: hidden !important;
+  }
+}

ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.ts

@@ -30,7 +30,7 @@ import { RuleNodeConfigComponent } from './rule-node-config.component';
 @Component({
   selector: 'tb-rule-node',
   templateUrl: './rule-node-details.component.html',
-  styleUrls: []
+  styleUrls: ['./rule-node-details.component.scss']
 })
 export class RuleNodeDetailsComponent extends PageComponent implements OnInit, OnChanges {
 

ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.html

@@ -95,7 +95,10 @@
                     position="end">
           <tb-details-panel *ngIf="editingRuleNode" fxFlex
                             headerTitle="{{editingRuleNode.name}}"
-                            headerSubtitle="{{ ruleNodeTypeDescriptorsMap.get(editingRuleNode.component.type).name | translate }}"
+                            headerSubtitle="{{
+                              (ruleNodeTypeDescriptorsMap.get(editingRuleNode.component.type).name | translate)
+                              + ' - ' + editingRuleNode.component.name
+                            }}"
                             [isReadOnly]="selectedRuleNodeTabIndex > 0"
                             [isAlwaysEdit]="true"
                             (closeDetails)="onEditRuleNodeClosed()"

ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts

@@ -14,39 +14,33 @@
 /// limitations under the License.
 ///
 
+import * as AngularCore from '@angular/core';
 import { Injectable, NgModule } from '@angular/core';
 import { ActivatedRouteSnapshot, Resolve, RouterModule, Routes } from '@angular/router';
 
-import {EntitiesTableComponent} from '../../components/entity/entities-table.component';
-import {Authority} from '@shared/models/authority.enum';
-import {RuleChainsTableConfigResolver} from '@modules/home/pages/rulechain/rulechains-table-config.resolver';
-import { Dashboard } from '@shared/models/dashboard.models';
-import { DashboardService } from '@core/http/dashboard.service';
-import { DashboardUtilsService } from '@core/services/dashboard-utils.service';
+import { EntitiesTableComponent } from '../../components/entity/entities-table.component';
+import { Authority } from '@shared/models/authority.enum';
+import { RuleChainsTableConfigResolver } from '@modules/home/pages/rulechain/rulechains-table-config.resolver';
+import * as RxJs from 'rxjs';
 import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import * as RxJsOperators from 'rxjs/operators';
 import { BreadCrumbConfig, BreadCrumbLabelFunction } from '@shared/components/breadcrumb';
-import {
-  RuleChain,
-  RuleChainMetaData,
-  RuleChainImport,
-  ResolvedRuleChainMetaData
-} from '@shared/models/rule-chain.models';
+import { ResolvedRuleChainMetaData, RuleChain, RuleChainImport } from '@shared/models/rule-chain.models';
 import { RuleChainService } from '@core/http/rule-chain.service';
-import { DashboardPageComponent } from '@home/pages/dashboard/dashboard-page.component';
-import { dashboardBreadcumbLabelFunction, DashboardResolver } from '@home/pages/dashboard/dashboard-routing.module';
 import { RuleChainPageComponent } from '@home/pages/rulechain/rulechain-page.component';
 import { RuleNodeComponentDescriptor } from '@shared/models/rule-node.models';
 import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard';
 
 import * as AngularCommon from '@angular/common';
-import * as AngularCore from '@angular/core';
 import * as AngularForms from '@angular/forms';
 import * as AngularCdkCoercion from '@angular/cdk/coercion';
+import * as AngularCdkKeycodes from '@angular/cdk/keycodes';
+import * as AngularMaterial from '@angular/material';
 import * as NgrxStore from '@ngrx/store';
 import * as TranslateCore from '@ngx-translate/core';
 import * as TbCore from '@core/public-api';
 import * as TbShared from '@shared/public-api';
+import * as TbHomeComponents from '@home/components/public-api';
 
 declare const SystemJS;
 
@@ -54,10 +48,16 @@ const ruleNodeConfigResourcesModulesMap = {
   '@angular/core': SystemJS.newModule(AngularCore),
   '@angular/common': SystemJS.newModule(AngularCommon),
   '@angular/forms': SystemJS.newModule(AngularForms),
+  '@angular/cdk/keycodes': SystemJS.newModule(AngularCdkKeycodes),
+  '@angular/cdk/coercion': SystemJS.newModule(AngularCdkCoercion),
+  '@angular/material': SystemJS.newModule(AngularMaterial),
   '@ngrx/store': SystemJS.newModule(NgrxStore),
+  rxjs: SystemJS.newModule(RxJs),
+  'rxjs/operators': SystemJS.newModule(RxJsOperators),
   '@ngx-translate/core': SystemJS.newModule(TranslateCore),
   '@core/public-api': SystemJS.newModule(TbCore),
-  '@shared/public-api': SystemJS.newModule(TbShared)
+  '@shared/public-api': SystemJS.newModule(TbShared),
+  '@home/components/public-api': SystemJS.newModule(TbHomeComponents)
 };
 
 const t = SystemJS.newModule(AngularCore);

ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts

@@ -26,7 +26,7 @@ import { RuleNodeComponent } from '@home/pages/rulechain/rulenode.component';
 import { FC_NODE_COMPONENT_CONFIG } from 'ngx-flowchart/dist/ngx-flowchart';
 import { RuleNodeDetailsComponent } from './rule-node-details.component';
 import { RuleNodeLinkComponent } from './rule-node-link.component';
-import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.conponent';
+import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.component';
 import { RuleNodeConfigComponent } from './rule-node-config.component';
 
 @NgModule({

ui-ngx/src/app/shared/components/json-content.component.ts

@@ -113,7 +113,6 @@ export class JsonContentComponent implements OnInit, ControlValueAccessor, Valid
     }
     let editorOptions: Partial<ace.Ace.EditorOptions> = {
       mode: `ace/mode/${mode}`,
-      theme: 'ace/theme/github',
       showGutter: true,
       showPrintMargin: false,
       readOnly: this.readonly

ui-ngx/src/app/shared/components/json-object-edit.component.ts

@@ -106,7 +106,6 @@ export class JsonObjectEditComponent implements OnInit, ControlValueAccessor, Va
     const editorElement = this.jsonEditorElmRef.nativeElement;
     let editorOptions: Partial<ace.Ace.EditorOptions> = {
       mode: 'ace/mode/json',
-      theme: 'ace/theme/github',
       showGutter: true,
       showPrintMargin: false,
       readOnly: this.readonly

ui-ngx/src/app/shared/models/entity-type.models.ts

@@ -151,6 +151,15 @@ export const entityTypeTranslations = new Map<EntityType | AliasEntityType, Enti
         selectedEntities: 'rulechain.selected-rulechains'
       }
     ],
+    [
+      EntityType.RULE_NODE,
+      {
+        type: 'entity.type-rulenode',
+        typePlural: 'entity.type-rulenodes',
+        list: 'entity.list-of-rulenodes',
+        nameStartsWith: 'entity.rulenode-name-starts-with'
+      }
+    ],
     [
       EntityType.DASHBOARD,
       {