Reduce Payload for Event-Types[Avoid 500] (#2627)

Co-authored-by: sean-brydon <55134778+sean-brydon@users.noreply.github.com>

apps/web/next.config.js

@@ -80,6 +80,10 @@ const nextConfig = {
         source: "/:user/avatar.png",
         destination: "/api/user/avatar?username=:user",
       },
+      {
+        source: "/team/:teamname/avatar.png",
+        destination: "/api/user/avatar?teamname=:teamname",
+      },
     ];
   },
   async redirects() {

apps/web/pages/api/user/avatar.ts

@@ -1,12 +1,16 @@
 import crypto from "crypto";
 import type { NextApiRequest, NextApiResponse } from "next";
 
+import { getPlaceholderAvatar } from "@lib/getPlaceholderAvatar";
 import prisma from "@lib/prisma";
 import { defaultAvatarSrc } from "@lib/profile";
 
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
   //   const username = req.url?.substring(1, req.url.lastIndexOf("/"));
   const username = req.query.username as string;
+  const teamname = req.query.teamname as string;
+  let identity;
+  if (username) {
     const user = await prisma.user.findUnique({
       where: {
         username: username,
@@ -16,16 +20,41 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
         email: true,
       },
     });
+    identity = {
+      name: username,
+      email: user?.email,
+      avatar: user?.avatar,
+    };
+  } else if (teamname) {
+    const team = await prisma.team.findUnique({
+      where: {
+        slug: teamname,
+      },
+      select: {
+        logo: true,
+      },
+    });
+    identity = {
+      name: teamname,
+      shouldDefaultBeNameBased: true,
+      avatar: team?.logo,
+    };
+  }
 
   const emailMd5 = crypto
     .createHash("md5")
-    .update((user?.email as string) || "guest@example.com")
+    .update((identity?.email as string) || "guest@example.com")
     .digest("hex");
-  const img = user?.avatar;
+  const img = identity?.avatar;
   if (!img) {
+    let defaultSrc = defaultAvatarSrc({ md5: emailMd5 });
+    if (identity?.shouldDefaultBeNameBased) {
+      defaultSrc = getPlaceholderAvatar(null, identity.name);
+    }
     res.writeHead(302, {
-      Location: defaultAvatarSrc({ md5: emailMd5 }),
+      Location: defaultSrc,
     });
+
     res.end();
   } else if (!img.includes("data:image")) {
     res.writeHead(302, {

apps/web/pages/event-types/index.tsx

@@ -18,6 +18,7 @@ import Link from "next/link";
 import { useRouter } from "next/router";
 import React, { Fragment, useEffect, useState } from "react";
 
+import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import showToast from "@calcom/lib/notification";
 import { Button } from "@calcom/ui";
@@ -452,13 +453,15 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
   );
 };
 
-const EventTypeListHeading = ({ profile, membershipCount }: EventTypeListHeadingProps): JSX.Element => (
+const EventTypeListHeading = ({ profile, membershipCount }: EventTypeListHeadingProps): JSX.Element => {
+  console.log(profile.slug);
+  return (
     <div className="mb-4 flex">
       <Link href="/settings/teams">
         <a>
           <Avatar
             alt={profile?.name || ""}
-          imageSrc={profile?.image || undefined}
+            imageSrc={`${WEBAPP_URL}/${profile.slug}/avatar.png` || undefined}
             size={8}
             className="mt-1 inline ltr:mr-2 rtl:ml-2"
           />
@@ -491,6 +494,7 @@ const EventTypeListHeading = ({ profile, membershipCount }: EventTypeListHeading
       </div>
     </div>
   );
+};
 
 const CreateFirstEventTypeView = ({ canAddEvents, profiles }: CreateEventTypeProps) => {
   const { t } = useLocale();

apps/web/server/routers/viewer.tsx

@@ -137,7 +137,6 @@ const loggedInViewerRouter = createProtectedRouter()
           select: {
             id: true,
             username: true,
-            avatar: true,
             name: true,
           },
         },
@@ -154,7 +153,6 @@ const loggedInViewerRouter = createProtectedRouter()
           startTime: true,
           endTime: true,
           bufferTime: true,
-          avatar: true,
           plan: true,
           teams: {
             where: {
@@ -230,7 +228,6 @@ const loggedInViewerRouter = createProtectedRouter()
         profile: {
           slug: typeof user["username"];
           name: typeof user["name"];
-          image: typeof user["avatar"];
         };
         metadata: {
           membershipCount: number;
@@ -255,7 +252,6 @@ const loggedInViewerRouter = createProtectedRouter()
         profile: {
           slug: user.username,
           name: user.name,
-          image: user.avatar,
         },
         eventTypes: _.orderBy(mergedEventTypes, ["position", "id"], ["desc", "asc"]),
         metadata: {