use direct answer's timeZoneUtcOffset in openStatus (#755)

This commit updates the allfields standard direct
answer cards to use the timeZoneUtcOffset in the
direct answer. This timezone offset is the UTC offset
for the location that was returned as the direct answer.
Without this piece of information, the open status can be
formatted incorrectly if the location is in a different
timezone than the user.

J=SLAP-1270
TEST=manual

checked that, on a universal page with without this change, the direct
answer open status, and the open status of a card displaying the same entity
could be out of sync, but with this change they would be in sync

check that the page loads in ie11

will add a percy snapshot (or acceptance test) in another PR after investigating
issues with percy snapshots not passing query params properly on universal pages
see this build, where the url for the iframe main page and also the iframe-ee are
inserted into the html
https://percy.io/cd93112c/answers-hitchhiker-theme/builds/10280939/changed/578794826

directanswercards/allfields-standard/component.js

@@ -103,10 +103,21 @@ class allfields_standardComponent extends BaseDirectAnswerCard['allfields-standa
         value = isArray ? arrayValue : regularValue;
         break;
       case 'hours':
+        const timezoneOffsetForLocation = relatedItem?.data?.fieldValues?.timeZoneUtcOffset;
         if (isArray) {
-          arrayValue = answer.value.map((value) => `<div>${Formatter.openStatus({hours: value})}</div>`);
+          arrayValue = answer.value.map((value) => {
+            const openStatus = Formatter.openStatus({
+              hours: value,
+              timeZoneUtcOffset: timezoneOffsetForLocation
+            });
+            return `<div>${openStatus}</div>`;
+          });
         } else {
-          regularValue = `<div>${Formatter.openStatus({hours: answer.value})}</div>`;
+          const openStatus = Formatter.openStatus({
+            hours: answer.value,
+            timeZoneUtcOffset: timezoneOffsetForLocation
+          });
+          regularValue = `<div>${openStatus}</div>`;
         }
         value = isArray ? arrayValue : regularValue;
         break;

directanswercards/multilang-allfields-standard/component.js

@@ -103,10 +103,21 @@ class multilang_allfields_standardComponent extends BaseDirectAnswerCard['multil
         value = isArray ? arrayValue : regularValue;
         break;
       case 'hours':
+        const timezoneOffsetForLocation = relatedItem?.data?.fieldValues?.timeZoneUtcOffset;
         if (isArray) {
-          arrayValue = answer.value.map((value) => `<div>${Formatter.openStatus({hours: value})}</div>`);
+          arrayValue = answer.value.map((value) => {
+            const openStatus = Formatter.openStatus({
+              hours: value,
+              timeZoneUtcOffset: timezoneOffsetForLocation
+            });
+            return `<div>${openStatus}</div>`;
+          });
         } else {
-          regularValue = `<div>${Formatter.openStatus({hours: answer.value})}</div>`;
+          const openStatus = Formatter.openStatus({
+            hours: answer.value,
+            timeZoneUtcOffset: timezoneOffsetForLocation
+          });
+          regularValue = `<div>${openStatus}</div>`;
         }
         value = isArray ? arrayValue : regularValue;
         break;