From 880d65bb42128b7eb3ef15870cf544766f30bd09 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Wed, 27 Nov 2019 12:32:16 +0100
Subject: [PATCH] V8: Add indicators to required properties within nested
 content (#7217)

---
 .../src/less/components/umb-nested-content.less       | 11 +++++++++++
 .../nestedcontent/nestedcontent.controller.js         |  1 +
 .../nestedcontent/nestedcontent.editor.html           |  4 ++--
 3 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less
index 455a147395..9d8e886b7a 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less
@@ -14,6 +14,17 @@
     pointer-events: none;
 }
 
+.umb-nested-content--mandatory {
+    /*
+        yeah so this is a pain, but we must be super specific in targeting the mandatory property labels,
+        otherwise all properties within a reqired, nested, nested content property will all appear mandatory
+    */
+    > ng-form > .control-group > .umb-el-wrap > .control-header label:after {
+        content: '*';
+        color: @red;
+    }
+}
+
 .umb-nested-content-overlay {
     position: absolute;
     top: 0;
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
index 37298fad3c..afdab78588 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
@@ -503,6 +503,7 @@
                     // Force validation to occur server side as this is the
                     // only way we can have consistency between mandatory and
                     // regex validation messages. Not ideal, but it works.
+                    prop.ncMandatory = prop.validation.mandatory;
                     prop.validation = {
                         mandatory: false,
                         pattern: ""
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.editor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.editor.html
index db0e9a016e..a2105c5675 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.editor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.editor.html
@@ -1,7 +1,7 @@
 <div class="umb-pane">
   <div ng-repeat="property in tab.properties" class="umb-nested-content-property-container">
 
-    <umb-property property="property" ng-class="{'umb-nested-content--not-supported': property.notSupported}" data-element="property-{{property.alias}}">
+    <umb-property property="property" ng-class="{'umb-nested-content--not-supported': property.notSupported, 'umb-nested-content--mandatory': property.ncMandatory}" data-element="property-{{property.alias}}">
       <umb-property-editor model="property"></umb-property-editor>
     </umb-property>
 
@@ -10,4 +10,4 @@
     <p ng-if="property.notSupported">{{property.notSupportedMessage}}</p>
 
   </div>
-</div>
\ No newline at end of file
+</div>