Use display format for team members when viewing calendars

src/cards/Calendar.ts

@@ -10,6 +10,7 @@ import { TeamCalendarId } from "../models/TeamCalendarId";
 import { formatGoogleCalendarName, googleCalendarSettingsUrl } from "./utils/googleCalendar";
 import { syncStatusText } from "./utils/teamCalendar";
 import { QueueFullSyncCalendarAction } from "../endpoints/onQueueFullSyncCalendar";
+import { getTeamMemberDisplayName } from "../jobs/getTeamMemberDisplayName";
 
 function CalendarHeader(calendar: TeamCalendar) {
   return CardService.newCardHeader().setTitle(calendar.name);
@@ -84,7 +85,7 @@ function CalendarSettingsSection(calendarId: TeamCalendarId, calendar: TeamCalen
         .setTopLabel("Team members")
         .setText(
           Object.keys(calendar.teamMembers)
-            .map((e) => ` - ${e}`)
+            .map((e) => ` - ${getTeamMemberDisplayName(e, calendar.nameFormat)}`)
             .join("\n"),
         ),
     )

src/jobs/getTeamMemberDisplayName.ts

@@ -0,0 +1,22 @@
+import { NameFormat } from "../models/TeamCalendar";
+
+export function getTeamMemberDisplayName(email: string, format: NameFormat) {
+  switch (format) {
+    case "email":
+      return email;
+    case "username":
+      return email.split("@")[0];
+    case "name":
+      // fall back to querying the directory to get full name from contacts (only works in Workspace accounts)
+      return (
+        // not-yet-typed, see https://developers.google.com/people/api/rest/v1/people/searchDirectoryPeople
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (People.People! as any).searchDirectoryPeople({
+          query: email,
+          readMask: "names",
+          sources: ["DIRECTORY_SOURCE_TYPE_DOMAIN_PROFILE", "DIRECTORY_SOURCE_TYPE_DOMAIN_CONTACT"],
+          pageSize: 1,
+        }).people?.[0]?.names?.[0]?.displayName ?? email
+      );
+  }
+}

src/jobs/syncCalendarForTeamMember.ts

@@ -1,6 +1,7 @@
 import { differenceInMinutes, parseISO, sub } from "date-fns";
-import { NameFormat, TeamCalendar, TeamMemberSyncState } from "../models/TeamCalendar";
+import { TeamCalendar, TeamMemberSyncState } from "../models/TeamCalendar";
 import { backPopulateWindow } from "../config";
+import { getTeamMemberDisplayName } from "./getTeamMemberDisplayName";
 
 type CalendarApiEvent = GoogleAppsScript.Calendar.Schema.Event;
 
@@ -77,27 +78,6 @@ function deleteEvent(calendarId: string, eventId: string) {
   }
 }
 
-function getDisplayName(email: string, format: NameFormat) {
-  switch (format) {
-    case "email":
-      return email;
-    case "username":
-      return email.split("@")[0];
-    case "name":
-      // fall back to querying the directory to get full name from contacts (only works in Workspace accounts)
-      return (
-        // not-yet-typed, see https://developers.google.com/people/api/rest/v1/people/searchDirectoryPeople
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (People.People! as any).searchDirectoryPeople({
-          query: email,
-          readMask: "names",
-          sources: ["DIRECTORY_SOURCE_TYPE_DOMAIN_PROFILE", "DIRECTORY_SOURCE_TYPE_DOMAIN_CONTACT"],
-          pageSize: 1,
-        }).people?.[0]?.names?.[0]?.displayName ?? email
-      );
-  }
-}
-
 /** Get all the OOO events on the calendar. */
 function getOutOfOfficeEvents(calendarId: string, syncToken: string | undefined) {
   // here we must fall back to the Calendar API because CalendarApp does not
@@ -176,7 +156,7 @@ export function syncCalendarForTeamMember(
       deleteEvent(calendar.googleCalendarId, eventId);
   }
 
-  const displayName = getDisplayName(teamMember, calendar.nameFormat);
+  const displayName = getTeamMemberDisplayName(teamMember, calendar.nameFormat);
   Logger.log(`Display name for ${teamMember} is ${displayName}`);
 
   const newSyncState = { ...TeamMemberSyncState.empty(), syncToken: nextSyncToken };