From 4f0be099e74bf5d813be117eb7a14a853f67ffee Mon Sep 17 00:00:00 2001
From: Danny White <3104761+dnywh@users.noreply.github.com>
Date: Thu, 1 Oct 2026 18:00:55 +1000
Subject: [PATCH] fix(studio): restore the Snowflake destination mark (#51075)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Problem

The Snowflake destination still uses a neutral text monogram even though
its Studio asset is available. Supporting that monogram also leaves a
separate rendering path used by no other destination.

## Solution

Restore Snowflake through the shared brand-icon registry introduced by
#51073. Simplify `DestinationLogo` back to a map of destination marks,
removing the monogram type, configuration, and rendering branch.

| After |
| --- |
| <img width="924" height="730" alt="CleanShot 2026-09-30 at 15 14
59@2x"
src="https://github.com/user-attachments/assets/7409d483-3371-45ec-bf54-0ddc6ad22857"
/> |

## Review instructions

1. Open `/project/<ref>/database/replication` with a Snowflake pipeline.
2. Confirm the Snowflake mark appears in the pipeline list and diagram.
3. Open the pipeline child route and confirm the same mark appears in
its header.
4. Confirm the other destination marks remain unchanged in light and
dark themes.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Visual Updates**
* Snowflake replication destinations now display a themed brand icon
instead of the “SF” monogram. Other destinations retain their existing
icons.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../Database/Replication/DestinationLogo.tsx  | 32 ++++++-------------
 1 file changed, 9 insertions(+), 23 deletions(-)

diff --git a/apps/studio/components/interfaces/Database/Replication/DestinationLogo.tsx b/apps/studio/components/interfaces/Database/Replication/DestinationLogo.tsx
index 77b9fcca777..2d3a7c1978d 100644
--- a/apps/studio/components/interfaces/Database/Replication/DestinationLogo.tsx
+++ b/apps/studio/components/interfaces/Database/Replication/DestinationLogo.tsx
@@ -6,13 +6,11 @@ import type { DestinationType } from './DestinationPanel/DestinationPanel.types'
 import { BRAND_ICONS, resolveThemedIconSrc, type ThemedIconSrc } from '@/lib/brand-icons'
 import { resolveThemeOverrideMode } from '@/lib/theme-overrides'
 
-type DestinationBrand = { type: 'mark'; src: ThemedIconSrc } | { type: 'monogram'; label: string }
-
-const BRAND_BY_TYPE: Partial<Record<DestinationType, DestinationBrand>> = {
-  BigQuery: { type: 'mark', src: BRAND_ICONS.bigquery },
-  ClickHouse: { type: 'mark', src: BRAND_ICONS.clickhouse },
-  DuckLake: { type: 'mark', src: BRAND_ICONS.ducklake },
-  Snowflake: { type: 'monogram', label: 'SF' },
+const BRAND_MARK_BY_TYPE: Partial<Record<DestinationType, ThemedIconSrc>> = {
+  BigQuery: BRAND_ICONS.bigquery,
+  ClickHouse: BRAND_ICONS.clickhouse,
+  DuckLake: BRAND_ICONS.ducklake,
+  Snowflake: BRAND_ICONS.snowflake,
 }
 
 const SIZE_CLASS_NAME = {
@@ -41,29 +39,17 @@ export const DestinationLogo = ({
   const { resolvedTheme } = useTheme()
   const isDark = resolveThemeOverrideMode(resolvedTheme) === 'dark'
   const sizing = SIZE_CLASS_NAME[size]
-  const brand = BRAND_BY_TYPE[type]
-  const brandMarkSrc = brand?.type === 'mark' ? resolveThemedIconSrc(brand.src, isDark) : undefined
+  const brandMark = BRAND_MARK_BY_TYPE[type]
+  const brandMarkSrc = brandMark === undefined ? undefined : resolveThemedIconSrc(brandMark, isDark)
 
   return (
     <span className={cn('relative inline-flex shrink-0', className)}>
       <span className={cn('flex items-center justify-center border bg-surface-100', sizing.frame)}>
-        {brand === undefined && (
+        {brandMarkSrc === undefined ? (
           <DestinationIcon type={type} size={sizing.icon} className="text-foreground-light" />
-        )}
-        {brand?.type === 'mark' && (
+        ) : (
           <img src={brandMarkSrc} alt="" aria-hidden className={sizing.mark} />
         )}
-        {brand?.type === 'monogram' && (
-          <span
-            className={cn(
-              'font-mono font-medium leading-none text-foreground-muted',
-              size === 'small' ? 'text-xs' : 'text-lg'
-            )}
-            aria-hidden
-          >
-            {brand.label}
-          </span>
-        )}
       </span>
       {hasErrors && (
         <span