use no-result component in rails

frontend/src/app/core/setup/global-dynamic-components.const.ts

@@ -150,14 +150,22 @@ import {
   FreeTrialButtonComponent,
   freeTrialButtonSelector,
 } from 'core-app/features/enterprise/free-trial-button/free-trial-button.component';
+import {
+  EnterpriseBannerComponent,
+  enterpriseBannerSelector,
+} from 'core-app/shared/components/enterprise-banner/enterprise-banner.component';
 import {
   EEActiveSavedTrialComponent,
   enterpriseActiveSavedTrialSelector,
 } from 'core-app/features/enterprise/enterprise-active-trial/ee-active-saved-trial.component';
 import {
   EnterpriseBannerBootstrapComponent,
-  enterpriseBannerSelector,
+  enterpriseBannerrBootstrapSelector,
 } from 'core-app/shared/components/enterprise-banner/enterprise-banner-bootstrap.component';
+import {
+  NoResultsComponent,
+  noResultsSelector,
+} from 'app/shared/components/no-results/no-results.component';
 import {
   HomescreenNewFeaturesBlockComponent,
   homescreenNewFeaturesBlockSelector,
@@ -229,7 +237,9 @@ export const globalDynamicComponents:OptionalBootstrapDefinition[] = [
   { selector: mainMenuToggleSelector, cls: MainMenuToggleComponent },
   { selector: globalSearchSelector, cls: GlobalSearchInputComponent },
   { selector: collapsibleSectionAugmentSelector, cls: CollapsibleSectionComponent },
-  { selector: enterpriseBannerSelector, cls: EnterpriseBannerBootstrapComponent },
+  { selector: enterpriseBannerrBootstrapSelector, cls: EnterpriseBannerBootstrapComponent },
+  { selector: enterpriseBannerSelector, cls: EnterpriseBannerComponent },
+  { selector: noResultsSelector, cls: NoResultsComponent },
   { selector: enterpriseBaseSelector, cls: EnterpriseBaseComponent },
   { selector: freeTrialButtonSelector, cls: FreeTrialButtonComponent },
   { selector: enterpriseActiveSavedTrialSelector, cls: EEActiveSavedTrialComponent },

frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.html

@@ -20,12 +20,12 @@
       </cdk-virtual-scroll-viewport>
     </ng-container>
     <ng-template #noResults>
-      <no-results *ngIf="(loading$ | async) === false"
+      <op-no-results *ngIf="(loading$ | async) === false"
                   [title]="noResultText$ | async"
                   [description]="text.change_notification_settings"
                   [showIcon]="false"
       >
-      </no-results>
+      </op-no-results>
     </ng-template>
   </div>
   <div class="op-ian-center--footer">

frontend/src/app/features/work-packages/components/wp-card-view/wp-card-view.component.html

@@ -31,7 +31,7 @@
 </div>
 
 <div *ngIf="showEmptyResultsBox && isResultEmpty">
-  <no-results [title]="text.noResults.title" [description]="text.noResults.description"></no-results>
+  <op-no-results [title]="text.noResults.title" [description]="text.noResults.description"></op-no-results>
 </div>
 
 

frontend/src/app/shared/components/enterprise-banner/enterprise-banner-bootstrap.component.ts

@@ -1,10 +1,12 @@
-import { Component, ElementRef, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, ElementRef, OnInit } from '@angular/core';
 import { I18nService } from 'core-app/core/i18n/i18n.service';
 
-export const enterpriseBannerSelector = 'enterprise-banner-bootstrap';
+export const enterpriseBannerrBootstrapSelector = 'enterprise-banner-bootstrap';
 
 @Component({
-  selector: enterpriseBannerSelector,
+  selector: enterpriseBannerrBootstrapSelector,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+
   template: `
     <op-enterprise-banner
       [textMessage]="textMessage"

frontend/src/app/shared/components/grids/widgets/documents/documents.component.html

@@ -9,9 +9,9 @@
 </widget-header>
 
 <div class="grid--widget-content">
-  <no-results *ngIf="noEntries"
+  <op-no-results *ngIf="noEntries"
               [title]="text.noResults">
-  </no-results>
+  </op-no-results>
   <ng-container *ngFor="let document of entries">
     <h4 class="document-category-elements--header">
       <a [href]="documentPath(document)"

frontend/src/app/shared/components/grids/widgets/members/members.component.html

@@ -9,9 +9,9 @@
 </widget-header>
 
 <div class="grid--widget-content">
-  <no-results *ngIf="noMembers"
+  <op-no-results *ngIf="noMembers"
               [title]="text.noResults">
-  </no-results>
+  </op-no-results>
   <div class="op-members-widget--attributes-map -minimal-keys">
     <ng-container *ngFor="let usersByRole of usersByRole">
       <div class="attributes-map--key">

frontend/src/app/shared/components/grids/widgets/news/news.component.html

@@ -10,10 +10,10 @@
 
 </widget-header>
 <div class="grid--widget-content">
-  <no-results
+  <op-no-results
     *ngIf="noEntries" 
     [title]="text.noResults"
-  ></no-results>
+  ></op-no-results>
   <ul class="widget-box--arrow-links">
     <li
       class="widget-box--arrow-multiline" 

frontend/src/app/shared/components/grids/widgets/subprojects/subprojects.component.html

@@ -9,9 +9,9 @@
 </widget-header>
 
 <div class="grid--widget-content">
-  <no-results *ngIf="noEntries"
+  <op-no-results *ngIf="noEntries"
               [title]="text.noResults">
-  </no-results>
+  </op-no-results>
   <span *ngFor="let project of projects; let last = last">
     <a [href]="projectPath(project)"
        [textContent]="projectName(project)">

frontend/src/app/shared/components/grids/widgets/time-entries/list/time-entries-list.component.html

@@ -8,9 +8,9 @@
   </widget-menu>
 </widget-header>
 
-<no-results *ngIf="noEntries"
+<op-no-results *ngIf="noEntries"
             [title]="text.noResults">
-</no-results>
+</op-no-results>
 
 <ng-container *ngIf="!noEntries">
   <div class="total-hours">

frontend/src/app/shared/components/no-results/no-results.component.ts

@@ -26,11 +26,15 @@
 // See COPYRIGHT and LICENSE files for more details.
 //++
 
-import { Component, HostBinding, Input } from '@angular/core';
+import { Component, ElementRef, HostBinding, Input } from '@angular/core';
+import { DatasetInputs } from '../dataset-inputs.decorator';
 
+export const noResultsSelector = 'op-no-results';
+
+@DatasetInputs
 @Component({
   templateUrl: './no-results.component.html',
-  selector: 'no-results',
+  selector: noResultsSelector,
 })
 
 export class NoResultsComponent {
@@ -41,4 +45,8 @@ export class NoResultsComponent {
   @Input() showIcon = true;
 
   @HostBinding('class.generic-table--no-results-container') setHostClass = true;
+
+  constructor(
+    readonly elementRef:ElementRef,
+  ) {}
 }

frontend/src/app/shared/components/work-package-graphs/embedded/wp-embedded-graph.html

@@ -6,8 +6,8 @@
           [options]="internalChartOptions"
           *ngIf="hasDataToDisplay">
   </canvas>
-  <no-results *ngIf="!hasDataToDisplay && initialized"
+  <op-no-results *ngIf="!hasDataToDisplay && initialized"
               [title]="text.noResults">
-  </no-results>
+  </op-no-results>
 </div>