ing

@overflow/alert/alert.module.ts

@@ -11,14 +11,14 @@ import { AlertLoggerModule } from './alert-logger.module';
 
 import { COMPONENTS } from './component';
 // import { SERVICES } from './service';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
 
 @NgModule({
   imports: [
     CommonModule,
     // InputChipModule,
     FormsModule,
-    PrimeNGModules,
+    UIModule,
     AlertLoggerModule,
   ],
   declarations: [

@overflow/commons/component/block-progressbar/block-progressbar.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { BlockProgressbarComponent } from './block-progressbar.component';
-
-@NgModule({
-    imports: [
-        CommonModule,
-        PrimeNGModules
-    ],
-    declarations: [
-        BlockProgressbarComponent
-    ],
-    exports: [
-        BlockProgressbarComponent
-    ]
-})
-export class BlockProgressbarModule { }

@overflow/commons/component/key-value/key-value.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { KeyValueComponent } from './key-value.component';
-import { CommonModule } from '@angular/common';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-
-@NgModule({
-    imports: [
-        CommonModule,
-        PrimeNGModules
-    ],
-    declarations: [
-        KeyValueComponent,
-    ],
-    exports: [
-        KeyValueComponent,
-    ]
-})
-export class KeyValueModule { }

@overflow/commons/component/message/message.component.html

@@ -1 +0,0 @@
-<p-messages [(value)]="message" [closable]="closable"></p-messages>

@overflow/commons/component/message/message.component.ts

@@ -1,18 +0,0 @@
-import { Component, OnInit, Input, OnChanges, SimpleChanges } from '@angular/core';
-import { Message } from 'primeng/primeng';
-
-@Component({
-  selector: 'of-message',
-  templateUrl: './message.component.html',
-})
-export class MessageComponent {
-
-  @Input() message: Message;
-  @Input() closeAfter: number;
-  @Input() closable: boolean;
-
-  constructor(
-  ) {
-  }
-
-}

@overflow/commons/component/message/message.module.ts

@@ -1,21 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { MessageComponent } from './message.component';
-import { ErrorMessageComponent } from './error-message.component';
-
-@NgModule({
-    imports: [
-        CommonModule,
-        PrimeNGModules
-    ],
-    declarations: [
-        MessageComponent,
-        ErrorMessageComponent
-    ],
-    exports: [
-        MessageComponent,
-        ErrorMessageComponent
-    ]
-})
-export class MessageModule { }

@overflow/discovery/discovery.module.ts

@@ -10,8 +10,7 @@ import { COMPONENTS } from './component';
 import { SERVICES } from './service';
 import { CONTAINER_COMPONENTS } from './container';
 
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
 import { ProbeModule } from '@overflow/probe/probe.module';
 import { MetaModule } from '@overflow/meta/meta.module';
 
@@ -20,11 +19,10 @@ import { MetaModule } from '@overflow/meta/meta.module';
     CommonModule,
     FormsModule,
     ReactiveFormsModule,
-    PrimeNGModules,
+    UIModule,
     DiscoveryStoreModule,
     DiscoveryRPCModule,
     DiscoveryLoggerModule,
-    KeyValueModule,
     ProbeModule,
     MetaModule
   ],

@overflow/infra/infra.module.ts

@@ -4,23 +4,20 @@ import { InfraStoreModule } from './infra-store.module';
 import { COMPONENTS } from './component';
 import { SERVICES } from './service';
 import { FormsModule } from '@angular/forms';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 import { DiscoveryModule } from '@overflow/discovery/discovery.module';
 import { SensorModule } from '@overflow/sensor/sensor.module';
 import { ProbeModule } from '@overflow/probe/probe.module';
 import { MetaModule } from '@overflow/meta/meta.module';
-import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
-
+import { UIModule } from '@overflow/shared/ui/ui.module';
 
 @NgModule({
   imports: [
     CommonModule,
     InfraStoreModule,
     FormsModule,
-    PrimeNGModules,
+    UIModule,
     DiscoveryModule,
     SensorModule,
-    KeyValueModule,
     ProbeModule,
     MetaModule,
   ],

@overflow/member/member.module.ts

@@ -8,7 +8,7 @@ import { MemberRESTModule } from './member-rest.module';
 import { COMPONENTS } from './component';
 import { CONTAINERS } from './container';
 import { SERVICES } from './service';
-import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
 import { QRCodeModule } from 'angularx-qrcode';
 import { RecaptchaModule } from 'angular-google-recaptcha';
 
@@ -20,7 +20,7 @@ import { RecaptchaModule } from 'angular-google-recaptcha';
     ReactiveFormsModule,
     MemberStoreModule,
     MemberRESTModule,
-    PrimeNGModules,
+    UIModule,
     QRCodeModule,
     RecaptchaModule.forRoot({
       siteKey: '6LflfVkUAAAAAG2cpX4FKFALKIpVXznzWa4j4Ddh',

@overflow/noauth-probe/noauth-probe.module.ts

@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+
+import { UIModule } from '@overflow/shared/ui/ui.module';
 
 import { NoAuthProbeStoreModule } from './noauth-probe-store.module';
 import { NoAuthProbeRPCModule } from './noauth-probe-rpc.module';
@@ -9,8 +10,6 @@ import { COMPONENTS } from './component';
 import { CONTAINER_COMPONENTS } from './container';
 
 import { SERVICES } from './service';
-import { MessageModule } from '@overflow/commons/component/message/message.module';
-import { BlockProgressbarModule } from '@overflow/commons/component/block-progressbar/block-progressbar.module';
 
 @NgModule({
   imports: [
@@ -18,9 +17,7 @@ import { BlockProgressbarModule } from '@overflow/commons/component/block-progre
     NoAuthProbeStoreModule,
     NoAuthProbeRPCModule,
     NoAuthProbeLoggerModule,
-    PrimeNGModules,
-    MessageModule,
-    BlockProgressbarModule,
+    UIModule,
   ],
   declarations: [
     COMPONENTS,

@overflow/notification/notification.module.ts

@@ -1,18 +1,19 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { COMPONENTS } from './component';
 import { CONTAINER_COMPONENTS } from './container';
 import { SERVICES } from './service';
 
 import { NotificationStoreModule } from './notification-store.module';
-import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     NotificationStoreModule,
-    PrimeNGModules
   ],
   declarations: [
     COMPONENTS,

@overflow/probe/probe.module.ts

@@ -5,23 +5,17 @@ import { COMPONENTS } from './component';
 import { CONTAINER_COMPONENTS } from './container';
 import { ProbeStoreModule } from './probe-store.module';
 import { SERVICES } from './service';
-import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
 import { FormsModule } from '@angular/forms';
 import { MetaModule } from '@overflow/meta/meta.module';
-import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
-import { BlockProgressbarModule } from '@overflow/commons/component/block-progressbar/block-progressbar.module';
-import { MessageModule } from '@overflow/commons/component/message/message.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
 
 @NgModule({
   imports: [
     CommonModule,
-    PrimeNGModules,
     ProbeStoreModule,
     FormsModule,
-    KeyValueModule,
+    UIModule,
     MetaModule,
-    BlockProgressbarModule,
-    MessageModule
   ],
   declarations: [
     CONTAINER_COMPONENTS,

@overflow/sensor-item/sensor-item.module.ts

@@ -1,15 +1,17 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { COMPONENTS } from './component';
 import { SensorItemStoreModule } from './sensor-item-store.module';
 import { SERVICES } from './service';
-import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     SensorItemStoreModule,
-    PrimeNGModules,
   ],
   declarations: [
     COMPONENTS,

@overflow/sensor/sensor.module.ts

@@ -1,12 +1,13 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
-import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
+
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { COMPONENTS } from './component';
 import { SERVICES } from './service';
 import { SensorStoreModule } from './sensor-store.module';
 import { SensorItemModule } from '../sensor-item/sensor-item.module';
-import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
 import { CONTAINER_COMPONENTS } from './container';
 // import { MetaCrawlerModule } from '../meta/crawler/crawler.module';
 // import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
@@ -16,12 +17,9 @@ import { CONTAINER_COMPONENTS } from './container';
     imports: [
         CommonModule,
         FormsModule,
+        UIModule,
         SensorStoreModule,
-        PrimeNGModules,
         SensorItemModule,
-        // MetaCrawlerModule,
-        // MetaSensorDisplayItemModule,
-        KeyValueModule
     ],
     declarations: [
         CONTAINER_COMPONENTS,

@overflow/shared/ui/component/index.ts

@@ -0,0 +1,11 @@
+import { BlockProgressbarComponent } from './block-progressbar.component';
+import { KeyValueComponent } from './key-value.component';
+import { ErrorMessageComponent } from './error-message.component';
+import { MessageComponent } from './message.component';
+
+export const COMPONENTS = [
+  BlockProgressbarComponent,
+  KeyValueComponent,
+  MessageComponent,
+  ErrorMessageComponent,
+];

@overflow/shared/ui/component/message.component.html

@@ -0,0 +1 @@
+<p-messages [(value)]="msgs" [closable]="closable"></p-messages>

@overflow/shared/ui/component/message.component.ts

@@ -0,0 +1,34 @@
+import { Component, OnInit, Input, OnChanges, SimpleChanges } from '@angular/core';
+import { Message } from 'primeng/primeng';
+
+@Component({
+  selector: 'of-message',
+  templateUrl: './message.component.html',
+})
+export class MessageComponent implements OnInit, OnChanges {
+
+  @Input() error: any;
+  @Input() closeAfter: number;
+  @Input() closable: boolean;
+  msgs: Message[] = [];
+
+  constructor(
+  ) {
+  }
+
+  ngOnInit() {
+  }
+
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes['error'].currentValue) {
+      const detail = ' (' + this.error.response.code + ')';
+      this.msgs = [];
+      this.msgs.push({ severity: 'error', summary: 'Sorry. An Error has occurred.', detail: detail });
+      if (this.closeAfter) {
+        setTimeout(() => {
+          this.msgs = [];
+        }, this.closeAfter * 1000);
+      }
+    }
+  }
+}

@overflow/shared/ui/directive/index.ts

@@ -0,0 +1,5 @@
+import { UITemplateDirective } from './ui-template.directive';
+
+export const DIRECTIVES = [
+  UITemplateDirective,
+];

@overflow/shared/ui/directive/ui-template.directive.ts

@@ -0,0 +1,17 @@
+import { Directive, Input, Output, TemplateRef } from '@angular/core';
+
+@Directive({
+  selector: '[ofUITemplate]',
+})
+export class UITemplateDirective {
+
+  @Input() type: string;
+
+  @Input('ofUITemplate') ofUITemplate: string;
+
+  constructor(public template: TemplateRef<any>) { }
+
+  getType(): string {
+    return this.ofUITemplate;
+  }
+}

@overflow/shared/ui/ui-prime-ng.module.ts

@@ -71,7 +71,7 @@ import { DataViewModule } from 'primeng/dataview';
 import { SidebarModule } from 'primeng/sidebar';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
 
-const PRIME_NG_MODULES: any[] = [
+export const PRIME_NG_MODULES: any[] = [
   AccordionModule,
   AutoCompleteModule,
   BreadcrumbModule,
@@ -146,13 +146,3 @@ const PRIME_NG_MODULES: any[] = [
   InplaceModule,
   ProgressSpinnerModule
 ];
-
-@NgModule({
-  imports: [
-    PRIME_NG_MODULES
-  ],
-  exports: [
-    PRIME_NG_MODULES
-  ],
-})
-export class PrimeNGModules { }

@overflow/shared/ui/ui.constant.ts

@@ -0,0 +1,3 @@
+export const MODULE = {
+  name: 'ui'
+};

@overflow/shared/ui/ui.module.ts

@@ -0,0 +1,23 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { PRIME_NG_MODULES } from './ui-prime-ng.module';
+
+import { COMPONENTS } from './component';
+import { DIRECTIVES } from './directive';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    PRIME_NG_MODULES,
+  ],
+  exports: [
+    PRIME_NG_MODULES,
+    COMPONENTS,
+    DIRECTIVES,
+  ],
+  declarations: [
+    COMPONENTS,
+    DIRECTIVES,
+  ],
+})
+export class UIModule { }

@overflow/target/target.module.ts

@@ -1,19 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { COMPONENTS } from './component';
 import { SERVICES } from './service';
-import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
 import { SensorModule } from '../sensor/sensor.module';
-// import { KeyValueModule } from 'app/commons/component/key-value/key-value.module';
 import { InfraModule } from '../infra/infra.module';
 
 @NgModule({
   imports: [
     CommonModule,
-    PrimeNGModules,
     SensorModule,
-    // KeyValueModule,
+    UIModule,
     InfraModule
   ],
   declarations: [

src/app/commons/component/layout/tabbar/app.tabbar.module.ts

@@ -1,12 +1,14 @@
 import { NgModule, Inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
+
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { TabbarComponent } from './app.tabbar.component';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 
 @NgModule({
   imports: [
     CommonModule,
-    PrimeNGModules,
+    UIModule,
   ],
   declarations: [
     TabbarComponent,

src/app/pages/account/account-page.module.ts

@@ -1,12 +1,13 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { MemberModule } from '@overflow/member/member.module';
+
 import { AccountPageRoutingModule } from './account-page-routing.module';
 import { AccountPageComponent } from './account-page.component';
 import { ProfilePageComponent } from './profile/profile-page.component';
 import { SettingsPageComponent } from './settings/settings-page.component';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { MemberModule } from '@overflow/member/member.module';
 
 export const COMPONENTS = [
   AccountPageComponent,
@@ -18,7 +19,7 @@ export const COMPONENTS = [
   imports: [
     CommonModule,
     AccountPageRoutingModule,
-    PrimeNGModules,
+    UIModule,
     MemberModule,
     // NotificationModule,
   ],

src/app/pages/alert/alert-page.module.ts

@@ -1,18 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { AlertModule } from '@overflow/alert/alert.module';
+
 import { AlertPageRoutingModule } from './alert-page-routing.module';
 import { AlertPageComponent } from './alert-page.component';
 
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { AlertModule } from '@overflow/alert/alert.module';
-
 @NgModule({
   imports: [
     CommonModule,
     AlertPageRoutingModule,
     // NotificationModule,
-    PrimeNGModules,
+    UIModule,
     AlertModule
   ],
   declarations: [

src/app/pages/error/error-page.module.ts

@@ -1,15 +1,16 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { ErrorPageComponent } from './error-page.component';
 import { ErrorPageRoutingModule } from './error-page-routing.module';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 
 @NgModule({
   imports: [
     CommonModule,
     ErrorPageRoutingModule,
-    PrimeNGModules,
+    UIModule,
   ],
   entryComponents: [
   ],

src/app/pages/home/home-page.module.ts

@@ -1,15 +1,16 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { HomePageComponent } from './home-page.component';
 import { HomePageRoutingModule } from './home-page-routing.module';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     HomePageRoutingModule,
-    PrimeNGModules,
   ],
   entryComponents: [
   ],

src/app/pages/pages.module.ts

@@ -1,6 +1,9 @@
 import { NgModule, APP_INITIALIZER} from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { NotificationModule } from '@overflow/notification/notification.module';
+
 import { AppMenuComponent } from '../commons/component/layout/menu/app.menu.component';
 import { AppSubMenuComponent } from '../commons/component/layout/menu/app.submenu.component';
 import { AppTopbarComponent } from '../commons/component/layout/topbar/app.topbar.component';
@@ -17,16 +20,14 @@ import {
 import { PagesComponent } from './pages.component';
 import { PagesRoutingModule } from './pages-routing.module';
 import { LocationStrategy, HashLocationStrategy } from '@angular/common';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 import { TabbarModule } from '../commons/component/layout/tabbar/app.tabbar.module';
-import { NotificationModule } from '@overflow/notification/notification.module';
 
 @NgModule({
   imports: [
     CommonModule,
     PagesRoutingModule,
     LocalizationModule,
-    PrimeNGModules,
+    UIModule,
     TabbarModule,
     NotificationModule
   ],

src/app/pages/probes/download/download-page.module.ts

@@ -1,14 +1,16 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { ProbeModule } from '@overflow/probe/probe.module';
+
 import { ProbeDownloadPageComponent } from './download-page.component';
 import { ProbeDownloadPageRoutingModule } from './download-page-routing.module';
-import { ProbeModule } from '@overflow/probe/probe.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     ProbeDownloadPageRoutingModule,
     ProbeModule
   ],

src/app/pages/probes/probe-tab-page.module.ts

@@ -1,17 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { ProbeModule } from '@overflow/probe/probe.module';
+
 import { ProbeTabPageComponent } from './probe-tab-page.component';
 import { ProbeTabPageRoutingModule } from './probe-tab-page-routing.module';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { ProbeModule } from '@overflow/probe/probe.module';
 import { TabbarModule } from '../../commons/component/layout/tabbar/app.tabbar.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     ProbeTabPageRoutingModule,
-    PrimeNGModules,
     ProbeModule,
     TabbarModule,
   ],

src/app/pages/probes/probe/probe-page.module.ts

@@ -1,16 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { ProbeModule } from '@overflow/probe/probe.module';
+
 import { ProbePageComponent } from './probe-page.component';
 import { ProbePageRoutingModule } from './probe-page-routing.module';
-import { ProbeModule } from '@overflow/probe/probe.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     ProbePageRoutingModule,
-    ProbeModule
+    ProbeModule,
   ],
   entryComponents: [
   ],

src/app/pages/sensors/sensor-tab-page.module.ts

@@ -1,17 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { SensorModule } from '@overflow/sensor/sensor.module';
+
 import { SensorTabPageComponent } from './sensor-tab-page.component';
 import { SensorTabPageRoutingModule } from './sensor-tab-page-routing.module';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
-import { SensorModule } from '@overflow/sensor/sensor.module';
 import { TabbarModule } from '../../commons/component/layout/tabbar/app.tabbar.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     SensorTabPageRoutingModule,
-    PrimeNGModules,
     SensorModule,
     TabbarModule,
   ],

src/app/pages/sensors/sensor/sensor-page.module.ts

@@ -1,16 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+import { UIModule } from '@overflow/shared/ui/ui.module';
+import { SensorModule } from '@overflow/sensor/sensor.module';
+
 import { SensorPageComponent } from './sensor-page.component';
 import { SensorPageRoutingModule } from './sensor-page-routing.module';
-import { SensorModule } from '@overflow/sensor/sensor.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     SensorPageRoutingModule,
-    SensorModule
+    SensorModule,
   ],
   entryComponents: [
   ],

src/app/pages/target/target-page.module.ts

@@ -1,18 +1,19 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
 import { TargetModule } from '@overflow/target/target.module';
+
 import { TargetPageRoutingModule } from './target-page-routing.module';
 import { TargetPageComponent } from './target-page.component';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 import { TabbarModule } from '../../commons/component/layout/tabbar/app.tabbar.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     TargetPageRoutingModule,
     TargetModule,
-    PrimeNGModules,
     TabbarModule
   ],
   declarations: [

src/app/pages/targets/targets-page.module.ts

@@ -1,17 +1,18 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
 import { TargetModule } from '@overflow/target/target.module';
+
 import { TargetsPageRoutingModule } from './targets-page-routing.module';
 import { TargetsPageComponent } from './targets-page.component';
-import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     TargetsPageRoutingModule,
     TargetModule,
-    PrimeNGModules
   ],
   declarations: [
     TargetsPageComponent