include ee banner in add widget modal

frontend/src/app/modules/grids/widgets/add/add.modal.html

@@ -21,5 +21,11 @@
            class="grid--addable-widget" >
       </div>
     </div>
+
+    <enterprise-banner *ngIf="eeShowBanners"
+                       [linkMessage]="text.upsale_link"
+                       [textMessage]="text.upsale_text"
+                       opReferrer="grids#add-widget">
+    </enterprise-banner>
   </div>
 </div>

frontend/src/app/modules/grids/widgets/add/add.modal.ts

@@ -6,26 +6,37 @@ import {OpModalLocalsMap} from "app/components/op-modals/op-modal.types";
 import {GridWidgetsService} from "app/modules/grids/widgets/widgets.service";
 import {I18nService} from "core-app/modules/common/i18n/i18n.service";
 import {AbstractWidgetComponent} from "core-app/modules/grids/widgets/abstract-widget.component";
+import {BannersService} from "core-app/modules/common/enterprise/banners.service";
 
 @Component({
   templateUrl: './add.modal.html'
 })
 export class AddGridWidgetModal extends OpModalComponent {
 
-  text = { title: this.i18n.t('js.grid.add_widget'),
-           close_popup: this.i18n.t('js.button_close') };
+  text = {
+    title: this.i18n.t('js.grid.add_widget'),
+    close_popup: this.i18n.t('js.button_close'),
+    upsale_link: this.i18n.t('js.grid.upsale.link'),
+    upsale_text: this.i18n.t('js.grid.upsale.text')
+  };
 
   public chosenWidget:WidgetRegistration;
+  public eeShowBanners = false;
 
   constructor(readonly elementRef:ElementRef,
               @Inject(OpModalLocalsToken) readonly locals:OpModalLocalsMap,
               readonly cdRef:ChangeDetectorRef,
               readonly widgetsService:GridWidgetsService,
-              readonly i18n:I18nService) {
-
+              readonly i18n:I18nService,
+              readonly bannerService:BannersService) {
     super(locals, cdRef, elementRef);
   }
 
+  ngOnInit() {
+    super.ngOnInit();
+    this.eeShowBanners = this.bannerService.eeShowBanners;
+  }
+
   public get selectable() {
     return this.eligibleWidgets.sort((a, b) => {
       return a.title.localeCompare(b.title);

modules/dashboards/spec/features/work_package_graph_spec.rb

@@ -156,8 +156,12 @@ describe 'Arbitrary WorkPackage query graph widget dashboard', type: :feature, j
   context 'without an enterprise edition' do
     let(:enterprise_edition) { false }
 
-    it 'cannot add the widget' do
-      dashboard_page.expect_unable_to_add_widget(1, 2, :within, "Work packages graph")
+    it 'cannot add the widget and receives an enterprise edition notice' do
+      dashboard_page.expect_add_widget_enterprise_edition_notice(1, 2, :within)
+
+      # At this point the add widget modal is open
+      expect(page)
+        .not_to have_content("Work packages graph")
     end
   end
 end

modules/grids/config/locales/js-en.yml

@@ -3,6 +3,9 @@ en:
     grid:
       add_widget: 'Add widget'
       remove: 'Remove widget'
+      upsale:
+        text: "Some widgets, like the work package graph widget, are only available in the "
+        link: 'enterprise edition.'
       widgets:
         custom_text:
           title: 'Custom text'

modules/grids/spec/support/pages/grid.rb

@@ -52,6 +52,16 @@ module Pages
       end
     end
 
+    def expect_add_widget_enterprise_edition_notice(row_number, column_number, location)
+      within_add_widget_modal(row_number, column_number, location) do
+        expect(page)
+          .to have_content(I18n.t('js.grid.add_widget'))
+
+        expect(page)
+          .to have_selector('.notification-box.-ee-upsale', text: I18n.t('js.upsale.ee_only'))
+      end
+    end
+
     def area_of(row_number, column_number, location = :within)
       real_row, real_column = case location
                               when :within