From 8bf6a9246fe129edfa1d883f3feb99853ab54d7f Mon Sep 17 00:00:00 2001
From: Justin Neville <justin@nevitech.co.uk>
Date: Thu, 17 Nov 2022 17:00:42 +0000
Subject: [PATCH] Added aria label to time period on log dashboard

---
 .../directives/components/umbdatetimepicker.directive.js     | 5 +++--
 src/Umbraco.Web.UI.Client/src/views/logViewer/overview.html  | 5 +++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js
index 63319fedc2..0a9c01edc4 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js
@@ -72,7 +72,7 @@ Use this directive to render a date time picker
 
     var umbDateTimePicker = {
         template: '<ng-transclude>' +
-            '<input type="text" ng-if="!$ctrl.options.inline" ng-model="$ctrl.ngModel" placeholder="Select Date.."></input>' +
+            '<input type="text" ng-if="!$ctrl.options.inline" ng-model="$ctrl.ngModel" placeholder="Select Date.." ng-attr-aria-labelledby="{{$ctrl.label}}"></input>' +
             '<div ng-if="$ctrl.options.inline"></div>' +
             '</ng-transclude>',
         controller: umbDateTimePickerCtrl,
@@ -88,7 +88,8 @@ Use this directive to render a date time picker
             onYearChange: '&?',
             onReady: '&?',
             onValueUpdate: '&?',
-            onDayCreate: '&?'
+            onDayCreate: '&?',
+            label: '@'
         }
     };
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/logViewer/overview.html b/src/Umbraco.Web.UI.Client/src/views/logViewer/overview.html
index eb018db541..b312d0b789 100644
--- a/src/Umbraco.Web.UI.Client/src/views/logViewer/overview.html
+++ b/src/Umbraco.Web.UI.Client/src/views/logViewer/overview.html
@@ -83,12 +83,13 @@
 
                     <!-- Time period -->
                     <umb-box>
-                        <umb-box-header title="Time Period"></umb-box-header>
+                        <umb-box-header title="Time Period" id="timePeriod"></umb-box-header>
 
                         <umb-date-time-picker class="datepicker"
                                        ng-model="vm.period"
                                        options="vm.config"
-                                       on-close="vm.dateRangeChange(selectedDates, dateStr, instance)">
+                                       on-close="vm.dateRangeChange(selectedDates, dateStr, instance)"
+                                       label="timePeriod">
                         </umb-date-time-picker>
                     </umb-box>