Apply same loading bar UI to Grid RTE & use editor INIT to hide/remove it

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";
 

src/Umbraco.Web.UI.Client/src/views/components/grid/grid-rte.html

@@ -1,3 +1,4 @@
-<div class="umb-rte"
+<div>
-     id="{{textAreaHtmlId}}">
+    <umb-load-indicator ng-if="isLoading"></umb-load-indicator>
+    <div class="umb-rte" id="{{textAreaHtmlId}}" ng-style="{ visibility :  isLoading ? 'hidden' : 'visible' }"></div>
 </div>