From c6671f7f8eac714901953083dfbf1aad91b1450c Mon Sep 17 00:00:00 2001
From: Warren Buckley <warren@umbraco.com>
Date: Thu, 8 Aug 2019 12:35:39 +0100
Subject: [PATCH] Apply same loading bar UI to Grid RTE & use editor INIT to
 hide/remove it

---
 .../common/directives/components/grid/grid.rte.directive.js | 6 ++++++
 .../src/views/components/grid/grid-rte.html                 | 5 +++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js
index cd1f011018..af82199d55 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js
@@ -14,6 +14,8 @@ angular.module("umbraco.directives")
 
                 // TODO: A lot of the code below should be shared between the grid rte and the normal rte
 
+                scope.isLoading = true;
+
                 var promises = [];
                 
                 //To id the html textarea we need to use the datetime ticks because we can have multiple rte's per a single property alias
@@ -91,6 +93,10 @@ angular.module("umbraco.directives")
                         //custom initialization for this editor within the grid
                         editor.on('init', function (e) {
 
+                            // Used this init event - as opposed to property init_instance_callback
+                            // to turn off the loader
+                            scope.isLoading = false;
+
                             //force overflow to hidden to prevent no needed scroll
                             editor.getBody().style.overflow = "hidden";
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/grid/grid-rte.html b/src/Umbraco.Web.UI.Client/src/views/components/grid/grid-rte.html
index 519c11f76b..b5531f477a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/grid/grid-rte.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/grid/grid-rte.html
@@ -1,3 +1,4 @@
-<div class="umb-rte"
-     id="{{textAreaHtmlId}}">
+<div>
+    <umb-load-indicator ng-if="isLoading"></umb-load-indicator>
+    <div class="umb-rte" id="{{textAreaHtmlId}}" ng-style="{ visibility :  isLoading ? 'hidden' : 'visible' }"></div>
 </div>