fix: Wrong avatars shown in webhooks page (#19386)

* fix: Wrong avatars shown in webhooks page

* Fix teams showing wrong avatar

* Fix type error

* Remove unused function arguments

---------

Co-authored-by: Anik Dhabal Babu <81948346+anikdhabal@users.noreply.github.com>

packages/lib/server/repository/webhook.ts

@@ -1,5 +1,6 @@
+import { getPlaceholderAvatar } from "@calcom/lib/defaultAvatarImage";
 import { compareMembership } from "@calcom/lib/event-types/getEventTypesByViewer";
-import { getBookerBaseUrl } from "@calcom/lib/getBookerUrl/server";
+import { getUserAvatarUrl } from "@calcom/lib/getAvatarUrl";
 import { prisma } from "@calcom/prisma";
 import type { Webhook } from "@calcom/prisma/client";
 import type { UserPermissionRole } from "@calcom/prisma/enums";
@@ -31,11 +32,9 @@ const filterWebhooks = (webhook: Webhook) => {
 export class WebhookRepository {
   static async getAllWebhooksByUserId({
     userId,
-    organizationId,
     userRole,
   }: {
     userId: number;
-    organizationId?: number | null;
     userRole?: UserPermissionRole;
   }) {
     const user = await prisma.user.findUnique({
@@ -67,6 +66,7 @@ export class WebhookRepository {
                   },
                 },
                 webhooks: true,
+                logoUrl: true,
               },
             },
           },
@@ -81,15 +81,15 @@ export class WebhookRepository {
     let userWebhooks = user.webhooks;
     userWebhooks = userWebhooks.filter(filterWebhooks);
     let webhookGroups: WebhookGroup[] = [];
-    const bookerUrl = await getBookerBaseUrl(organizationId ?? null);
 
-    const image = user?.username ? `${bookerUrl}/${user.username}/avatar.png` : undefined;
     webhookGroups.push({
       teamId: null,
       profile: {
         slug: user.username,
         name: user.name,
-        image,
+        image: getUserAvatarUrl({
+          avatarUrl: user.avatarUrl,
+        }),
       },
       webhooks: userWebhooks,
       metadata: {
@@ -115,7 +115,7 @@ export class WebhookRepository {
               ? `/team`
               : `${membership.team.slug}`
             : null,
-          image: `${bookerUrl}/team/${membership.team.slug}/avatar.png`,
+          image: getPlaceholderAvatar(membership.team.logoUrl, membership.team.name),
         },
         metadata: {
           readOnly:
@@ -141,7 +141,7 @@ export class WebhookRepository {
         profile: {
           slug: "Platform",
           name: "Platform",
-          image,
+          image: getPlaceholderAvatar(null, "Platform"),
         },
         webhooks: platformWebhooks,
         metadata: {

packages/trpc/server/routers/viewer/webhook/getByViewer.handler.ts

@@ -35,7 +35,6 @@ export type WebhooksByViewer = {
 export const getByViewerHandler = async ({ ctx }: GetByViewerOptions) => {
   return await WebhookRepository.getAllWebhooksByUserId({
     userId: ctx.user.id,
-    organizationId: ctx.user.profile?.organizationId,
     userRole: ctx.user.role,
   });
 };