diff --git a/apps/studio/components/interfaces/Integrations/Vercel/OrganizationPicker.tsx b/apps/studio/components/interfaces/Integrations/Vercel/OrganizationPicker.tsx
index 2b07faa0cab..b4dbcfd8ed2 100644
--- a/apps/studio/components/interfaces/Integrations/Vercel/OrganizationPicker.tsx
+++ b/apps/studio/components/interfaces/Integrations/Vercel/OrganizationPicker.tsx
@@ -88,7 +88,8 @@ const OrganizationPicker = ({
           className="p-0 w-full"
           side="bottom"
           align="center"
-          style={{ width: ref.current?.offsetWidth }}
+          portal
+          sameWidthAsTrigger
         >
           <Command_Shadcn_>
             <CommandInput_Shadcn_ placeholder="Search organizations..." />
diff --git a/apps/studio/components/interfaces/Integrations/VercelGithub/ProjectLinker.tsx b/apps/studio/components/interfaces/Integrations/VercelGithub/ProjectLinker.tsx
index ef6c0330bd1..8b8939875da 100644
--- a/apps/studio/components/interfaces/Integrations/VercelGithub/ProjectLinker.tsx
+++ b/apps/studio/components/interfaces/Integrations/VercelGithub/ProjectLinker.tsx
@@ -328,6 +328,7 @@ const ProjectLinker = ({
                   side="bottom"
                   align="center"
                   sameWidthAsTrigger
+                  portal
                 >
                   <Command_Shadcn_>
                     <CommandInput_Shadcn_ placeholder="Search for a project" />
diff --git a/apps/studio/components/interfaces/Settings/Integrations/VercelIntegration/VercelSection.tsx b/apps/studio/components/interfaces/Settings/Integrations/VercelIntegration/VercelSection.tsx
index 59c6ca8d803..d10dbf95e39 100644
--- a/apps/studio/components/interfaces/Settings/Integrations/VercelIntegration/VercelSection.tsx
+++ b/apps/studio/components/interfaces/Settings/Integrations/VercelIntegration/VercelSection.tsx
@@ -23,6 +23,7 @@ import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-or
 import { useIntegrationsVercelInstalledConnectionDeleteMutation } from 'data/integrations/integrations-vercel-installed-connection-delete-mutation'
 import { useVercelProjectsQuery } from 'data/integrations/integrations-vercel-projects-query'
 import type {
+  Integration,
   IntegrationName,
   IntegrationProjectConnection,
 } from 'data/integrations/integrations.types'
@@ -69,10 +70,19 @@ const VercelSection = ({ isProjectScoped }: { isProjectScoped: boolean }) => {
         if (integration.metadata && integration.integration.name === 'Vercel') {
           const avatarSrc =
             !integration.metadata.account.avatar && integration.metadata.account.type === 'Team'
-              ? `https://vercel.com/api/www/avatar?teamId=${integration.metadata.account.team_id}&s=48`
+              ? `https://vercel.com/api/www/avatar?teamId=${integration.metadata.account.team_id}&s=48&format=png`
               : `https://vercel.com/api/www/avatar/${integration.metadata.account.avatar}?s=48`
 
-          integration['metadata']['account']['avatar'] = avatarSrc
+          return {
+            ...integration,
+            metadata: {
+              ...integration.metadata,
+              account: {
+                ...integration.metadata.account,
+                avatar: avatarSrc,
+              },
+            },
+          } as Integration
         }
 
         return integration
diff --git a/apps/studio/next.config.js b/apps/studio/next.config.js
index e538cb6fe90..31fdddf43bc 100644
--- a/apps/studio/next.config.js
+++ b/apps/studio/next.config.js
@@ -523,7 +523,6 @@ const nextConfig = {
     ]
   },
   images: {
-    // to make Vercel avatars work without issue. Vercel uses SVGs for users who don't have set avatars.
     dangerouslyAllowSVG: false,
     remotePatterns: [
       {