feat: general icon when both services are connected

Author: MatteoGabriele

app/components/Header/AccountMenu.client.vue

@@ -18,6 +18,9 @@ const isOpen = shallowRef(false)
 /** Check if connected to at least one service */
 const hasAnyConnection = computed(() => isNpmConnected.value || !!atprotoUser.value)
 
+/** Check if connected to both services */
+const hasBothConnections = computed(() => isNpmConnected.value && !!atprotoUser.value)
+
 /** Only show count of active (pending/approved/running) operations */
 const operationCount = computed(() => activeOperations.value.length)
 
@@ -63,15 +66,15 @@ function openAuthModal() {
     >
       <span v-if="hasAnyConnection" class="flex items-center">
         <img
-          v-if="isNpmConnected && npmAvatar"
+          v-if="isNpmConnected && npmAvatar && !hasBothConnections"
           :src="npmAvatar"
           :alt="npmUser || $t('account_menu.npm_cli')"
           width="24"
           height="24"
           class="w-6 h-6 rounded-full ring-2 ring-bg object-cover"
         />
         <img
-          v-else-if="atprotoUser?.avatar"
+          v-else-if="atprotoUser?.avatar && !hasBothConnections"
           :src="atprotoUser.avatar"
           :alt="atprotoUser.handle"
           width="24"