Create Data Localization editor (OrchardCMS#18761)

* Create Data Localization editor

* Fix build

* Fix broken unit test

* Fix the testing bug

* Update views with Content Type display name localization

* Update all field displays and add sub context handling

* Fix test

* Group permissions

* Remove the breadcrumb

* Animate progress bar

* Fix culture spacing

* Translations -> Dynamic Transaltions

* Original -> Key

* Refactor view models

* Fix the build

* Use colon as context separator

* Remove unnecessary usings

* Refactoring

* Fix

* Fix the test

---------

Co-authored-by: Hisham Bin Ateya <hishamco_2007@yahoo.com>

Author: sebastienros

mkdocs.yml

@@ -265,6 +265,7 @@ nav:
               - HTTPS: reference/modules/Https/README.md
               - Key Vault (Azure): reference/modules/KeyVault.Azure/README.md
               - Localization: reference/modules/Localize/README.md
+              - Data Localization: reference/modules/DataLocalization/README.md
               - Logging Serilog: reference/modules/Logging.Serilog/README.md
               - Mini Profiler: reference/modules/MiniProfiler/README.md
               - Modules: reference/modules/Modules/README.md

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/BooleanField-Switch.Edit.cshtml

@@ -1,14 +1,17 @@
 @model OrchardCore.ContentFields.ViewModels.EditBooleanFieldViewModel
 @using OrchardCore.Mvc.Utilities
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<BooleanFieldSettings>();
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.Value)_FieldWrapper">
     <div class="@Orchard.GetEndClasses(true)">
         <div class="form-check form-switch">
             <input asp-for="Value" type="checkbox" class="form-check-input content-preview-select" checked="@Model.Value" />
-            <label asp-for="Value" class="form-check-label">@(string.IsNullOrEmpty(settings.Label) ? Model.PartFieldDefinition.DisplayName() : settings.Label)</label>
+            <label asp-for="Value" class="form-check-label">@(string.IsNullOrEmpty(settings.Label) ? localizedFieldName : settings.Label)</label>
             @if (!string.IsNullOrEmpty(settings.Hint))
             {
                 <span class="hint dashed">@settings.Hint</span>

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/BooleanField.Edit.cshtml

@@ -1,16 +1,18 @@
 @model OrchardCore.ContentFields.ViewModels.EditBooleanFieldViewModel
 @using OrchardCore.Mvc.Utilities
-
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<BooleanFieldSettings>();
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.Value)_FieldWrapper">
     <div class="@Orchard.GetEndClasses(true)">
         <div class="form-check">
             <input asp-for="Value" type="checkbox" class="form-check-input content-preview-select" checked="@Model.Value" />
             <label class="form-check-label" asp-for="Value">
-                @(string.IsNullOrEmpty(settings.Label) ? Model.PartFieldDefinition.DisplayName() : settings.Label)
+                @(string.IsNullOrEmpty(settings.Label) ? localizedFieldName : settings.Label)
                 @if (!string.IsNullOrEmpty(settings.Hint))
                 {
                     <span class="hint dashed">@settings.Hint</span>

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/ContentPickerField.Edit.cshtml

@@ -2,6 +2,8 @@
 @using System.Text.Json
 @using System.Text.Json.Nodes
 @using OrchardCore.Mvc.Utilities
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<ContentPickerFieldSettings>();
     var selectedItems = JConvert.SerializeObject(Model.SelectedItems, JOptions.CamelCase);
@@ -12,13 +14,14 @@
     var searchUrl = Url.RouteUrl(new { area = "OrchardCore.ContentFields", controller = "ContentPickerAdmin", action = "SearchContentItems", part = partName, field = fieldName });
     var vueElementId = $"ContentPicker_{partName}_{fieldName}_{Guid.NewGuid().ToString("n")}";
     var multiple = settings.Multiple.ToString().ToLowerInvariant();
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <script asp-name="vue-multiselect-wrapper" at="Foot"></script>
 <style asp-name="vue-multiselect" version="2" at="Foot"></style>
 
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.ContentItemIds)_FieldWrapper">
-    <label asp-for="ContentItemIds" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@Model.PartFieldDefinition.DisplayName()</label>
+    <label asp-for="ContentItemIds" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@localizedFieldName</label>
     <div class="@Orchard.GetEndClasses()">
         <div id="@vueElementId" class="vue-multiselect" data-part="@partName" data-field="@fieldName" data-editor-type="ContentPicker" data-selected-items="@selectedItems" data-edit-url="@editUrl" data-view-url="@viewUrl" data-search-url="@searchUrl" data-multiple="@multiple">
 

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/ContentPickerField.cshtml

@@ -2,16 +2,19 @@
 @using OrchardCore.ContentManagement
 @using OrchardCore.Mvc.Utilities
 @using OrchardCore.ContentManagement.Metadata.Models
+@using OrchardCore.Localization.Data
 
 @inject OrchardCore.ContentManagement.IContentManager ContentManager
+@inject IDataLocalizer D
 
 @{
     var name = (Model.PartFieldDefinition.PartDefinition.Name + "-" + Model.PartFieldDefinition.Name).HtmlClassify();
     var contentItems = await ContentManager.GetAsync(Model.ContentItemIds);
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <div class="field field-type-contentpickerfield field-name-@name">
-    <span class="name">@Model.PartFieldDefinition.DisplayName()</span>
+    <span class="name">@localizedFieldName</span>
     @if (contentItems.Any())
     {
         foreach (var contentItem in contentItems)

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/DateField-Localized.Edit.cshtml

@@ -1,13 +1,15 @@
 @model OrchardCore.ContentFields.ViewModels.EditDateFieldViewModel
-
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<DateFieldSettings>();
     var language = Orchard.CultureName().Split('-')[0];
     var datepickerId = Html.IdFor(m => m.Value);
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <div class="@Orchard.GetWrapperClasses()">
-    <label asp-for="Value" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@Model.PartFieldDefinition.DisplayName()</label>
+    <label asp-for="Value" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@localizedFieldName</label>
     <div class="@Orchard.GetEndClasses()">
         <div class="@Orchard.GetLimitedWidthWrapperClasses()">
             <div class="@Orchard.GetLimitedWidthClasses()">

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/DateField.Edit.cshtml

@@ -1,12 +1,15 @@
 @model OrchardCore.ContentFields.ViewModels.EditDateFieldViewModel
 @using OrchardCore.Mvc.Utilities
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<DateFieldSettings>();
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <script asp-name="jQuery-ui-i18n" at="Foot"></script>
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.Value)_FieldWrapper">
-    <label asp-for="Value" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@Model.PartFieldDefinition.DisplayName()</label>
+    <label asp-for="Value" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@localizedFieldName</label>
     <div class="@Orchard.GetEndClasses()">
         <div class="@Orchard.GetLimitedWidthWrapperClasses()">
             <div class="@Orchard.GetLimitedWidthClasses()">

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/DateTimeField.Edit.cshtml

@@ -1,11 +1,14 @@
 @model OrchardCore.ContentFields.ViewModels.EditDateTimeFieldViewModel
 @using OrchardCore.Mvc.Utilities
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<DateTimeFieldSettings>();
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 <script asp-name="jQuery-ui-i18n" at="Foot"></script>
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.LocalDateTime)_FieldWrapper">
-    <label asp-for="LocalDateTime" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@Model.PartFieldDefinition.DisplayName()</label>
+    <label asp-for="LocalDateTime" class="@Orchard.GetLabelClasses(inputRequired: settings.Required)">@localizedFieldName</label>
     <div class="@Orchard.GetEndClasses()">
         <div class="@Orchard.GetLimitedWidthWrapperClasses()">
             <div class="@Orchard.GetLimitedWidthClasses()">

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/HtmlField-Monaco.Edit.cshtml

@@ -1,13 +1,16 @@
 @model OrchardCore.ContentFields.ViewModels.EditHtmlFieldViewModel
 @using OrchardCore.Mvc.Utilities
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<HtmlFieldSettings>();
     var monacoSettings = Model.PartFieldDefinition.GetSettings<HtmlFieldMonacoEditorSettings>();
     var culture = await Orchard.GetContentCultureAsync(Model.Field.ContentItem);
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.Html)_FieldWrapper">
-    <label asp-for="Html" class="@Orchard.GetLabelClasses()">@Model.PartFieldDefinition.DisplayName()</label>
+    <label asp-for="Html" class="@Orchard.GetLabelClasses()">@localizedFieldName</label>
     <div class="@Orchard.GetEndClasses()">
         @await DisplayAsync(await New.ShortcodeModal())
         <div id="@Html.IdFor(x => x.Html)_editor" asp-for="Text" style="min-height: 400px;" class="form-control" dir="@culture.GetLanguageDirection()"></div>

src/OrchardCore.Modules/OrchardCore.ContentFields/Views/HtmlField-Multiline.Edit.cshtml

@@ -1,12 +1,15 @@
 @model OrchardCore.ContentFields.ViewModels.EditHtmlFieldViewModel
 @using OrchardCore.Mvc.Utilities
+@using OrchardCore.Localization.Data
+@inject IDataLocalizer D
 @{
     var settings = Model.PartFieldDefinition.GetSettings<HtmlFieldSettings>();
     var culture = await Orchard.GetContentCultureAsync(Model.Field.ContentItem);
+    string localizedFieldName = D[Model.PartFieldDefinition.DisplayName(), $"Content Fields;{Model.PartFieldDefinition.PartDefinition.Name}"];
 }
 
 <div class="@Orchard.GetFieldWrapperClasses(Model.PartFieldDefinition)" id="@Html.IdFor(x => x.Html)_FieldWrapper">
-    <label asp-for="Html" class="@Orchard.GetLabelClasses()">@Model.PartFieldDefinition.DisplayName()</label>
+    <label asp-for="Html" class="@Orchard.GetLabelClasses()">@localizedFieldName</label>
     <div class="@Orchard.GetEndClasses()">
         @await DisplayAsync(await New.ShortcodeModal())
         <textarea asp-for="Html" rows="5" class="form-control content-preview-text shortcode-modal-input" dir="@culture.GetLanguageDirection()"></textarea>