@meetelise/chat 1.20.151 → 1.20.153

package/src/WebComponent/Scheduler/time-picker.ts

@@ -2,6 +2,7 @@ import { LitElement, html, TemplateResult, css } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import { DateWithTimeZoneOffset } from "../../getAvailabilities";
+import { getTimezoneAbbreviation } from "../../getTimezoneString";
 
 export type TimePickerOption = {
   displayTime: string;
@@ -44,6 +45,11 @@ export class TimePicker extends LitElement {
       font-family: "Helvetica Neue", Arial;
     }
 
+    .timezone-display-text {
+      font-size: 11px;
+      opacity: 0.5;
+    }
+
     #optionContainer {
       display: flex;
       flex-wrap: wrap;
@@ -113,48 +119,57 @@ export class TimePicker extends LitElement {
     }
     return this.options?.length
       ? html`
-          <div
-            id="optionContainer"
-            @click="${(e: MouseEvent) => {
-              const target = e.target as HTMLElement | undefined;
-
-              if (target?.closest(".option:not(.selected)"))
-                this.selected = getDateWithTimezoneOffset(
-                  this.options,
-                  target.innerText
-                );
-              this.dispatchEvent(
-                new Event("change", { bubbles: true, composed: true })
-              );
-            }}"
-            @keydown="${(e: KeyboardEvent) => {
-              const target = e.target as HTMLElement | undefined;
-              if (
-                [" ", "Enter"].includes(e.key) &&
-                target?.closest(".option")
-              ) {
-                e.preventDefault();
-                this.selected =
-                  target.innerText !== this.selected?.displayTime
-                    ? getDateWithTimezoneOffset(this.options, target.innerText)
-                    : undefined;
+          <div>
+            <div
+              id="optionContainer"
+              @click="${(e: MouseEvent) => {
+                const target = e.target as HTMLElement | undefined;
+
+                if (target?.closest(".option:not(.selected)"))
+                  this.selected = getDateWithTimezoneOffset(
+                    this.options,
+                    target.innerText
+                  );
                 this.dispatchEvent(
                   new Event("change", { bubbles: true, composed: true })
                 );
-              }
-            }}"
-          >
-            ${this.options.map(
-              (option) =>
-                html`<div
-                  class="option ${classMap({
-                    selected: this.selected?.displayTime === option.displayTime,
-                  })}"
-                  tabindex="0"
-                >
-                  <span>${option.displayTime}</span>
-                </div>`
-            )}
+              }}"
+              @keydown="${(e: KeyboardEvent) => {
+                const target = e.target as HTMLElement | undefined;
+                if (
+                  [" ", "Enter"].includes(e.key) &&
+                  target?.closest(".option")
+                ) {
+                  e.preventDefault();
+                  this.selected =
+                    target.innerText !== this.selected?.displayTime
+                      ? getDateWithTimezoneOffset(
+                          this.options,
+                          target.innerText
+                        )
+                      : undefined;
+                  this.dispatchEvent(
+                    new Event("change", { bubbles: true, composed: true })
+                  );
+                }
+              }}"
+            >
+              ${this.options.map(
+                (option) =>
+                  html`<div
+                    class="option ${classMap({
+                      selected:
+                        this.selected?.displayTime === option.displayTime,
+                    })}"
+                    tabindex="0"
+                  >
+                    <span>${option.displayTime}</span>
+                  </div>`
+              )}
+            </div>
+            <p class="timezone-display-text">
+              *All times displayed in ${getTimezoneAbbreviation()}
+            </p>
           </div>
         `
       : html` <div id="noAvailabilityText">

package/src/WebComponent/Scheduler/tour-scheduler.ts

@@ -644,42 +644,44 @@ export class TourScheduler extends LitElement {
               }
             }}
           ></date-picker>
-          <time-picker
-            ?selecteddateexists=${!!this.selectedDate}
-            .options=${this.selectedDate
-              ? this.availabilitiesGroupedByDay[
-                  format(this.selectedDate, "y-MM-dd")
-                ]
-                  ?.sort((a, b) =>
-                    compareAsc(parseISO(a.datetime), parseISO(b.datetime))
-                  )
-                  .map((date) => {
-                    return {
-                      dateWithTimeZoneOffset: date,
-                      displayTime: format(
-                        parseISO(`${date.datetime}${date.offset}`),
-                        "h:mmaaa"
-                      ),
-                    };
-                  })
-              : []}
-            @change=${(e: Event) => {
-              if (e.target instanceof TimePicker) {
-                if (!this.selectedDate) return;
-                const daysAvailabilities =
-                  this.availabilitiesGroupedByDay[
-                    format(new Date(this.selectedDate), "y-MM-dd")
-                  ];
-                const index = e.target.selectedTime
-                  ? daysAvailabilities.indexOf(
-                      e.target.selectedTime.dateWithTimeZoneOffset
+          <div>
+            <time-picker
+              ?selecteddateexists=${!!this.selectedDate}
+              .options=${this.selectedDate
+                ? this.availabilitiesGroupedByDay[
+                    format(this.selectedDate, "y-MM-dd")
+                  ]
+                    ?.sort((a, b) =>
+                      compareAsc(parseISO(a.datetime), parseISO(b.datetime))
                     )
-                  : null;
-                this.selectedTime =
-                  index !== null ? daysAvailabilities[index] : null;
-              }
-            }}
-          ></time-picker>
+                    .map((date) => {
+                      return {
+                        dateWithTimeZoneOffset: date,
+                        displayTime: format(
+                          parseISO(`${date.datetime}${date.offset}`),
+                          "h:mmaaa"
+                        ),
+                      };
+                    })
+                : []}
+              @change=${(e: Event) => {
+                if (e.target instanceof TimePicker) {
+                  if (!this.selectedDate) return;
+                  const daysAvailabilities =
+                    this.availabilitiesGroupedByDay[
+                      format(new Date(this.selectedDate), "y-MM-dd")
+                    ];
+                  const index = e.target.selectedTime
+                    ? daysAvailabilities.indexOf(
+                        e.target.selectedTime.dateWithTimeZoneOffset
+                      )
+                    : null;
+                  this.selectedTime =
+                    index !== null ? daysAvailabilities[index] : null;
+                }
+              }}
+            ></time-picker>
+          </div>
         </div>
       </div>`;
   }

package/src/WebComponent/pubnub-chat.ts

@@ -171,19 +171,7 @@ export class PubnubChat extends LitElement {
               ["hidden"]: this.needsConsent(),
             })}
           >
-            <li class="message-container disclaimer-message">
-              <p class="disclaimer-inner">
-                By interacting with this system, you consent to
-                <a
-                  href="http://bit.ly/me_privacy_policy"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                >
-                  this privacy policy</a
-                >, including being contacted by AI or a human & having your
-                conversation recorded by a third party.
-              </p>
-            </li>
+            ${getChatDisclaimer(this.orgSlug ?? "")}
             ${this.building.welcomeMessage
               ? html` <li class="message-container ai-message">
                   <p
@@ -265,11 +253,80 @@ export class PubnubChat extends LitElement {
   }
 }
 
+const getChatDisclaimer = (orgSlug: string) => {
+  if (orgSlug === "avb") {
+    return html`
+      <li class="message-container disclaimer-message">
+        <p class="disclaimer-inner">
+          Chats may be recorded by us and our vendors.
+        </p>
+      </li>
+    `;
+  }
+  return html`<li class="message-container disclaimer-message">
+    <p class="disclaimer-inner">
+      By interacting with this system, you consent to
+      <a
+        href="http://bit.ly/me_privacy_policy"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        this privacy policy</a
+      >, including being contacted by AI or a human & having your conversation
+      recorded by a third party.
+    </p>
+  </li>`;
+};
+
 const getConsentPreChatDisclaimer = (
   orgSlug: string | null,
   privacyPolicyUrl: string,
   changeConsent: (hasConsent: boolean) => void
 ): TemplateResult => {
+  if (orgSlug === "avb") {
+    return html`
+      <div class="legal-confirmation-inner-container">
+        <div>${HeyThereEmoji}</div>
+        <div>
+          <span style="font-weight: 600">Confirm to continue</span>
+          <p>
+            By using this feature you accept our
+            <a
+              href="https://www.avaloncommunities.com/terms-of-use"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+              >Terms</a
+            >,
+            <a
+              href="https://www.avaloncommunities.com/privacy-policy"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+              >Privacy Policy</a
+            >,
+            <a
+              href="https://www.avaloncommunities.com/us-state-privacy-notice"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+              >U.S. State Privacy Notice</a
+            >, and that chats may use automated or AI responses from a bot and
+            may be recorded by us and our vendors.
+          </p>
+        </div>
+
+        <button
+          class="agreeButton"
+          @click=${() => {
+            changeConsent(true);
+          }}
+        >
+          I agree
+        </button>
+      </div>
+    `;
+  }
   if (orgSlug === "mill-creek") {
     return html`<div class="legal-confirmation-inner-container">
       <div>${HeyThereEmoji}</div>

package/src/getTimezoneString.ts

@@ -0,0 +1,39 @@
+const isDaylightSavingTime = (date: Date): boolean => {
+  const jan = new Date(date.getFullYear(), 0, 1);
+  const jul = new Date(date.getFullYear(), 6, 1);
+  const stdTimezoneOffset = Math.max(
+    jan.getTimezoneOffset(),
+    jul.getTimezoneOffset()
+  );
+
+  return date.getTimezoneOffset() < stdTimezoneOffset;
+};
+
+export const getTimezoneAbbreviation = (): string => {
+  const date = new Date();
+  const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+  const isDST = isDaylightSavingTime(date);
+
+  switch (timeZone) {
+    case "America/New_York":
+      return isDST ? "EDT" : "EST";
+    case "America/Chicago":
+      return isDST ? "CDT" : "CST";
+    case "America/Denver":
+      return isDST ? "MDT" : "MST";
+    case "America/Los_Angeles":
+      return isDST ? "PDT" : "PST";
+    case "America/Anchorage":
+      return isDST ? "AKDT" : "AKST";
+    case "America/Honolulu":
+      return "HST";
+    case "America/Phoenix":
+      return "MST";
+    case "America/Indiana/Indianapolis":
+      return isDST ? "EDT" : "EST";
+    case "America/Indiana/Knox":
+      return isDST ? "CDT" : "CST";
+    default:
+      return "Unknown";
+  }
+};