feat: Safe multisig badge on governance addresses + oracle router governor row

abis/oracle.ts

@@ -1,3 +1,14 @@
+/** `governor()` getter from euler-price-oracle's Governable (EulerRouter). */
+export const governableGovernorAbi = [
+  {
+    type: 'function',
+    name: 'governor',
+    inputs: [],
+    outputs: [{ name: 'governor', type: 'address' }],
+    stateMutability: 'view',
+  },
+] as const
+
 export const priceOracleAbi = [
   {
     type: 'function',

abis/safe.ts

@@ -0,0 +1,33 @@
+/**
+ * Minimal fragments for probing Safe (ex Gnosis Safe) smart accounts.
+ *
+ * `masterCopy()` is not a regular function on the Safe singleton — Safe proxy
+ * contracts (v1.1.1+) special-case the `0xa619486e` selector in their fallback
+ * and return the singleton address stored at slot 0 without delegating. An
+ * `eth_call` against any Safe proxy therefore answers it, while EOAs return
+ * empty data and non-Safe contracts revert or return garbage that fails
+ * decoding.
+ */
+export const safeAccountAbi = [
+  {
+    type: 'function',
+    name: 'masterCopy',
+    inputs: [],
+    outputs: [{ name: 'masterCopy', type: 'address' }],
+    stateMutability: 'view',
+  },
+  {
+    type: 'function',
+    name: 'getThreshold',
+    inputs: [],
+    outputs: [{ name: 'threshold', type: 'uint256' }],
+    stateMutability: 'view',
+  },
+  {
+    type: 'function',
+    name: 'getOwners',
+    inputs: [],
+    outputs: [{ name: 'owners', type: 'address[]' }],
+    stateMutability: 'view',
+  },
+] as const

components/entities/safe/SafeAccountBadge.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+const { address } = defineProps<{ address: string }>()
+
+const { safeInfo } = useSafeAddressInfo(() => address)
+
+// Describes the configured owner threshold only — enabled Safe modules can
+// execute without owner confirmations, and the probe does not inspect them.
+const tooltipText = computed(() => {
+  if (!safeInfo.value) return ''
+  const { threshold, owners, version } = safeInfo.value
+  return `This address is a Safe smart account (v${version}) configured with a ${threshold}-of-${owners.length} owner threshold.`
+})
+
+const ariaLabel = computed(() => {
+  if (!safeInfo.value) return 'Safe multisig'
+  const { threshold, owners } = safeInfo.value
+  return `Safe multisig: ${threshold} of ${owners.length} owner threshold`
+})
+</script>
+
+<template>
+  <UiHoverPreviewTooltip
+    v-if="safeInfo"
+    title="Safe multisig"
+    :text="tooltipText"
+    :aria-label="ariaLabel"
+  >
+    <span class="flex items-center gap-4 text-content-secondary">
+      <SvgIcon
+        class="!w-14 !h-14"
+        name="safe"
+      />
+      <span class="text-p5">({{ safeInfo.threshold }}/{{ safeInfo.owners.length }})</span>
+    </span>
+  </UiHoverPreviewTooltip>
+</template>

components/entities/vault/overview/SecuritizeVaultOverview.vue

@@ -5,10 +5,8 @@ import { getProductByVault, getProductKeyByVault, isVaultGovernanceLimited } fro
 import { getEulerLabelEntityLogo } from '~/entities/euler/labels'
 import { isVaultBlockedByCountry } from '~/composables/useGeoBlock'
 import { autoLink } from '~/utils/autoLink'
-import { getExplorerLink } from '~/utils/block-explorer'
-import { getSpecialAddressLabel } from '~/utils/special-addresses'
 import { formatAssetValue } from '~/utils/sdk-prices'
-import { formatNumber, compactNumber, formatUsdValue, formatCompactUsdValue, shortenAddress } from '~/utils/string-utils'
+import { formatNumber, compactNumber, formatUsdValue, formatCompactUsdValue } from '~/utils/string-utils'
 import { nanoToValue } from '~/utils/crypto-utils'
 import { formatMarketAvailability } from '~/utils/vault-display'
 import { VaultApyModal } from '#components'
@@ -23,7 +21,6 @@ const emit = defineEmits<{
 const route = useRoute()
 const { enableEntityBranding: enableEntityBrandingDisplay, enableVaultType: enableVaultTypeDisplay } = useDeployConfig()
 
-const { chainId } = useEulerAddresses()
 const { borrowList: _borrowList, isVaultGovernorVerified } = useVaults()
 const { settings } = useUserSettings()
 const enableIntrinsicApy = computed(() => settings.value.enableIntrinsicApy)
@@ -45,14 +42,6 @@ const isDeprecated = computed(() => {
 const deprecationReason = computed(() => isDeprecated.value ? product.deprecationReason || '' : '')
 const isRestricted = computed(() => isVaultBlockedByCountry(vault.address))
 
-const { copyToClipboard } = useClipboardCopy()
-
-const onCopyClick = (address: string) => {
-  copyToClipboard(address).catch(() => {})
-}
-
-const getExplorerAddressLink = (address: string) => getExplorerLink(address, chainId.value, true)
-
 // Count markets where this can be borrowed (securitize vaults cannot be borrow destinations)
 const borrowCount = computed(() => 0)
 
@@ -330,71 +319,23 @@ const supplyCapPercentageDisplay = computed(() => {
         :label="`${vault.asset.symbol} token`"
         orientation="horizontal"
       >
-        <div class="flex gap-4 items-center">
-          <NuxtLink
-            :to="getExplorerAddressLink(vault.asset.address)"
-            class="text-accent-600 underline cursor-pointer hover:text-accent-500"
-            target="_blank"
-          >
-            {{ getSpecialAddressLabel(vault.asset.address) || shortenAddress(vault.asset.address) }}
-          </NuxtLink>
-          <button
-            class="text-content-muted cursor-pointer outline-none hover:text-content-secondary active:text-content-primary"
-            @click="onCopyClick(vault.asset.address)"
-          >
-            <SvgIcon
-              class="!w-18 !h-18"
-              name="copy"
-            />
-          </button>
-        </div>
+        <VaultOverviewAddressValue :address="vault.asset.address" />
       </VaultOverviewLabelValue>
       <VaultOverviewLabelValue
         :label="`${vault.asset.symbol} vault`"
         orientation="horizontal"
       >
-        <div class="flex gap-4 items-center">
-          <NuxtLink
-            :to="getExplorerAddressLink(vault.address)"
-            class="text-accent-600 underline cursor-pointer hover:text-accent-500"
-            target="_blank"
-          >
-            {{ getSpecialAddressLabel(vault.address) || shortenAddress(vault.address) }}
-          </NuxtLink>
-          <button
-            class="text-content-muted cursor-pointer outline-none hover:text-content-secondary active:text-content-primary"
-            @click="onCopyClick(vault.address)"
-          >
-            <SvgIcon
-              class="!w-18 !h-18"
-              name="copy"
-            />
-          </button>
-        </div>
+        <VaultOverviewAddressValue :address="vault.address" />
       </VaultOverviewLabelValue>
       <VaultOverviewLabelValue
         v-if="vault.governor && vault.governor !== '0x0000000000000000000000000000000000000000'"
         label="Risk manager"
         orientation="horizontal"
       >
-        <div class="flex gap-4 items-center">
-          <NuxtLink
-            :to="getExplorerAddressLink(vault.governor)"
-            class="text-accent-600 underline cursor-pointer hover:text-accent-500"
-            target="_blank"
-          >
-            {{ getSpecialAddressLabel(vault.governor) || shortenAddress(vault.governor) }}
-          </NuxtLink>
-          <button
-            class="text-content-muted cursor-pointer outline-none hover:text-content-secondary active:text-content-primary"
-            @click="onCopyClick(vault.governor)"
-          >
-            <SvgIcon
-              class="!w-18 !h-18"
-              name="copy"
-            />
-          </button>
-        </div>
+        <VaultOverviewAddressValue
+          :address="vault.governor"
+          check-safe
+        />
       </VaultOverviewLabelValue>
     </VaultOverviewAccordionSection>
   </div>

components/entities/vault/overview/VaultOverviewAddressValue.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+import { getExplorerLink } from '~/utils/block-explorer'
+import { getSpecialAddressLabel } from '~/utils/special-addresses'
+import { shortenAddress } from '~/utils/string-utils'
+
+const { address, checkSafe = false } = defineProps<{
+  address: string
+  /**
+   * Probe the address for being a Safe multisig and render the badge.
+   * Enable only for governance-related addresses — token/vault/IRM rows are
+   * known contracts and would just waste probes.
+   */
+  checkSafe?: boolean
+}>()
+
+const { chainId } = useEulerAddresses()
+const { copyToClipboard } = useClipboardCopy()
+
+const explorerLink = computed(() => getExplorerLink(address, chainId.value, true))
+const displayLabel = computed(() => getSpecialAddressLabel(address) || shortenAddress(address))
+
+const onCopyClick = () => {
+  copyToClipboard(address).catch(() => {})
+}
+</script>
+
+<template>
+  <div class="flex gap-4 items-center">
+    <SafeAccountBadge
+      v-if="checkSafe"
+      :address="address"
+    />
+    <NuxtLink
+      :to="explorerLink"
+      class="text-accent-600 underline cursor-pointer hover:text-accent-500"
+      target="_blank"
+    >
+      {{ displayLabel }}
+    </NuxtLink>
+    <button
+      class="text-content-muted cursor-pointer outline-none hover:text-content-secondary active:text-content-primary"
+      @click="onCopyClick"
+    >
+      <SvgIcon
+        class="!w-18 !h-18"
+        name="copy"
+      />
+    </button>
+  </div>
+</template>

components/entities/vault/overview/VaultOverviewBlockAddresses.vue

@@ -1,15 +1,10 @@
 <script setup lang="ts">
 import type { EVault } from '@eulerxyz/euler-v2-sdk'
-import { getExplorerLink } from '~/utils/block-explorer'
-import { getSpecialAddressLabel } from '~/utils/special-addresses'
 import { getVaultHookTarget } from '~/utils/vault-hooks'
 import { isVaultBorrowable } from '~/utils/vault/classification'
-import { shortenAddress } from '~/utils/string-utils'
 
 const { vault, defaultOpen = true } = defineProps<{ vault: EVault, defaultOpen?: boolean }>()
 
-const { chainId } = useEulerAddresses()
-
 // Surface borrow-side addresses while debt is being wound down, not only while
 // new borrows are allowed (see isVaultBorrowable).
 const isBorrowable = computed(() => isVaultBorrowable(vault))
@@ -18,8 +13,14 @@ const interestRateModelAddress = computed(() =>
   vault.interestRateModel.address,
 )
 
+const oracleRouterAddress = computed(() =>
+  vault.oracle.name === 'EulerRouter' ? vault.oracle.oracle : null,
+)
+
+const { governor: oracleGovernor } = useOracleRouterGovernor(oracleRouterAddress)
+
 const vaultAddresesInfo = computed(() => {
-  const baseAddresses: Array<{ title: string, address?: string }> = [
+  const baseAddresses: Array<{ title: string, address?: string, checkSafe?: boolean }> = [
     {
       title: `${vault.asset.symbol} token`,
       address: vault.asset.address,
@@ -43,6 +44,7 @@ const vaultAddresesInfo = computed(() => {
     {
       title: `Risk manager`,
       address: vault.governorAdmin,
+      checkSafe: true,
     },
   )
 
@@ -51,11 +53,25 @@ const vaultAddresesInfo = computed(() => {
       {
         title: `Fee receiver`,
         address: vault.fees.governorFeeReceiver,
+        checkSafe: true,
       },
       {
         title: `Oracle router`,
         address: vault.oracle.oracle,
       },
+    )
+
+    if (oracleGovernor.value) {
+      baseAddresses.push(
+        {
+          title: `Oracle governor`,
+          address: oracleGovernor.value,
+          checkSafe: true,
+        },
+      )
+    }
+
+    baseAddresses.push(
       {
         title: `Unit of account`,
         address: vault.unitOfAccount?.address,
@@ -74,16 +90,8 @@ const vaultAddresesInfo = computed(() => {
     },
   )
 
-  return baseAddresses.filter((item): item is { title: string, address: string } => Boolean(item.address))
+  return baseAddresses.filter((item): item is { title: string, address: string, checkSafe?: boolean } => Boolean(item.address))
 })
-
-const { copyToClipboard } = useClipboardCopy()
-
-const onCopyClick = (address: string) => {
-  copyToClipboard(address).catch(() => {})
-}
-
-const getExplorerAddressLink = (address: string) => getExplorerLink(address, chainId.value, true)
 </script>
 
 <template>
@@ -111,24 +119,10 @@ const getExplorerAddressLink = (address: string) => getExplorerLink(address, cha
           />
         </span>
       </template>
-      <div class="flex gap-4 items-center">
-        <NuxtLink
-          :to="getExplorerAddressLink(infoItem.address)"
-          class="text-accent-600 underline cursor-pointer hover:text-accent-500"
-          target="_blank"
-        >
-          {{ getSpecialAddressLabel(infoItem.address) || shortenAddress(infoItem.address) }}
-        </NuxtLink>
-        <button
-          class="text-content-muted cursor-pointer outline-none hover:text-content-secondary active:text-content-primary"
-          @click="onCopyClick(infoItem.address)"
-        >
-          <SvgIcon
-            class="!w-18 !h-18"
-            name="copy"
-          />
-        </button>
-      </div>
+      <VaultOverviewAddressValue
+        :address="infoItem.address"
+        :check-safe="infoItem.checkSafe"
+      />
     </VaultOverviewLabelValue>
   </VaultOverviewAccordionSection>
 </template>