From 97fdfc5d6b32f83d711bf8cd35dfbecd0fabeff0 Mon Sep 17 00:00:00 2001
From: Syed Ali Shahbaz <52925846+alishaz-polymath@users.noreply.github.com>
Date: Thu, 10 Feb 2022 07:26:02 +0530
Subject: [PATCH] fixes gravatar fallback for team collective events (#1759)

---
 @types/@wojtekmaj__react-daterange-picker.d.ts | 15 +++++++++++++++
 components/booking/pages/AvailabilityPage.tsx  |  4 ++--
 pages/event-types/[type].tsx                   |  9 ++++-----
 pages/event-types/index.tsx                    |  2 +-
 server/routers/viewer.tsx                      |  1 +
 5 files changed, 23 insertions(+), 8 deletions(-)
 create mode 100644 @types/@wojtekmaj__react-daterange-picker.d.ts

diff --git a/@types/@wojtekmaj__react-daterange-picker.d.ts b/@types/@wojtekmaj__react-daterange-picker.d.ts
new file mode 100644
index 00000000..83839408
--- /dev/null
+++ b/@types/@wojtekmaj__react-daterange-picker.d.ts
@@ -0,0 +1,15 @@
+declare module "@wojtekmaj/react-daterange-picker/dist/entry.nostyle" {
+  import { CalendarProps } from "react-calendar";
+  export type DateRangePickerCalendarProps = Omit<
+    CalendarProps,
+    "calendarClassName" | "onChange" | "value"
+  > & {
+    calendarClassName?: string;
+    onChange: (value: [Date, Date]) => void;
+    value: [Date, Date];
+    clearIcon: JSX.Element | null;
+    calendarIcon: JSX.Element | null;
+    rangeDivider: JSX.Element | null;
+  };
+  export default function DateRangePicker(props: DateRangePickerCalendarProps): JSX.Element;
+}
diff --git a/components/booking/pages/AvailabilityPage.tsx b/components/booking/pages/AvailabilityPage.tsx
index 82f00a13..5e0ad180 100644
--- a/components/booking/pages/AvailabilityPage.tsx
+++ b/components/booking/pages/AvailabilityPage.tsx
@@ -126,7 +126,7 @@ const AvailabilityPage = ({ profile, eventType, workingHours }: Props) => {
                           .filter((user) => user.name !== profile.name)
                           .map((user) => ({
                             title: user.name,
-                            image: user.avatar || undefined,
+                            image: `${process.env.NEXT_PUBLIC_APP_URL}/${user.username}/avatar.png`,
                             alt: user.name || undefined,
                           })),
                       ].filter((item) => !!item.image) as { image: string; alt?: string; title?: string }[]
@@ -175,7 +175,7 @@ const AvailabilityPage = ({ profile, eventType, workingHours }: Props) => {
                           .map((user) => ({
                             title: user.name,
                             alt: user.name,
-                            image: user.avatar,
+                            image: `${process.env.NEXT_PUBLIC_APP_URL}/${user.username}/avatar.png`,
                           })),
                       ].filter((item) => !!item.image) as { image: string; alt?: string; title?: string }[]
                     }
diff --git a/pages/event-types/[type].tsx b/pages/event-types/[type].tsx
index cf75dd7d..9f763014 100644
--- a/pages/event-types/[type].tsx
+++ b/pages/event-types/[type].tsx
@@ -36,7 +36,6 @@ import getIntegrations, { hasIntegration } from "@lib/integrations/getIntegratio
 import { LocationType } from "@lib/location";
 import showToast from "@lib/notification";
 import prisma from "@lib/prisma";
-import { defaultAvatarSrc } from "@lib/profile";
 import { trpc } from "@lib/trpc";
 import { inferSSRProps } from "@lib/types/inferSSRProps";
 
@@ -313,15 +312,15 @@ const EventTypePage = (props: inferSSRProps<typeof getServerSideProps>) => {
   const mapUserToValue = ({
     id,
     name,
-    avatar,
+    username,
   }: {
     id: number | null;
     name: string | null;
-    avatar: string | null;
+    username: string | null;
   }) => ({
     value: `${id || ""}`,
     label: `${name || ""}`,
-    avatar: `${avatar || ""}`,
+    avatar: `${process.env.NEXT_PUBLIC_APP_URL}/${username}/avatar.png`,
   });
 
   const formMethods = useForm<{
@@ -1716,7 +1715,7 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) =>
   const teamMembers = eventTypeObject.team
     ? eventTypeObject.team.members.map((member) => {
         const user = member.user;
-        user.avatar = user.avatar || defaultAvatarSrc({ email: asStringOrUndefined(user.email) });
+        user.avatar = `${process.env.NEXT_PUBLIC_APP_URL}/${user.username}/avatar.png`;
         return user;
       })
     : [];
diff --git a/pages/event-types/index.tsx b/pages/event-types/index.tsx
index acd93f49..01bd6c4b 100644
--- a/pages/event-types/index.tsx
+++ b/pages/event-types/index.tsx
@@ -153,7 +153,7 @@ const EventTypeList = ({ readOnly, types, profile }: EventTypeListProps): JSX.El
                         truncateAfter={4}
                         items={type.users.map((organizer) => ({
                           alt: organizer.name || "",
-                          image: organizer.avatar || "",
+                          image: `${process.env.NEXT_PUBLIC_APP_URL}/${organizer.username}/avatar.png`,
                         }))}
                       />
                     )}
diff --git a/server/routers/viewer.tsx b/server/routers/viewer.tsx
index 32046212..1609595f 100644
--- a/server/routers/viewer.tsx
+++ b/server/routers/viewer.tsx
@@ -131,6 +131,7 @@ const loggedInViewerRouter = createProtectedRouter()
         users: {
           select: {
             id: true,
+            username: true,
             avatar: true,
             name: true,
           },