fix: Show correct origins when snaps use wallet_requestSnaps

test/data/mock-state.json

@@ -1978,6 +1978,24 @@
             "parentCapability": "snap_getBip44Entropy"
           }
         }
+      },
+      "https://snaps.metamask.io": {
+        "origin": "https://snaps.metamask.io",
+        "permissions": {
+          "wallet_snap": {
+            "caveats": [
+              {
+                "type": "snapIds",
+                "value": {
+                  "npm:@metamask/test-snap-bip44": {}
+                }
+              }
+            ],
+            "date": 1718117256761,
+            "id": "sBxmdvnow7QiN9aS4uSdn",
+            "invoker": "https://snaps.metamask.io"
+          }
+        }
       }
     }
   },

ui/components/app/snaps/snap-metadata-modal/snap-metadata-modal.js

@@ -60,6 +60,9 @@ export const SnapMetadataModal = ({ snapId, isOpen, onClose }) => {
     : undefined;
 
   const installOrigin = useOriginMetadata(installInfo?.origin);
+  const isSnapRequesting =
+    installInfo?.origin?.startsWith('local:') ||
+    installInfo?.origin?.startsWith('npm:');
 
   const snapPrefix = getSnapPrefix(snapId);
   const packageName = stripSnapPrefix(snapId);
@@ -161,7 +164,11 @@ export const SnapMetadataModal = ({ snapId, isOpen, onClose }) => {
                   </Tooltip>
                 )}
               </Box>
-              <Text ellipsis>{installOrigin.host}</Text>
+              <Text ellipsis>
+                {isSnapRequesting
+                  ? stripSnapPrefix(installInfo.origin)
+                  : installOrigin.host}
+              </Text>
             </Box>
           )}
           <Box

ui/pages/permissions-connect/snaps/snap-install/snap-install.js

@@ -69,6 +69,11 @@ export default function SnapInstall({
   const hasError = !requestState.loading && requestState.error;
   const isLoading = requestState.loading;
 
+  // we already have access to the requesting snap's metadata
+  const isOriginSnap =
+    request?.metadata?.dappOrigin?.startsWith('local:') ||
+    request?.metadata?.dappOrigin?.startsWith('npm:');
+
   const warnings = getSnapInstallWarnings(
     requestState?.permissions ?? {},
     t,
@@ -111,11 +116,15 @@ export default function SnapInstall({
       flexDirection={FlexDirection.Column}
       backgroundColor={BackgroundColor.backgroundAlternative}
     >
-      {isLoading || hasError ? (
+      {(isLoading || hasError) && !isOriginSnap ? (
         <PermissionConnectHeader origin={origin} iconUrl={iconUrl} />
       ) : (
         <SnapAuthorshipHeader
-          snapId={targetSubjectMetadata.origin}
+          snapId={
+            isLoading && isOriginSnap
+              ? request?.metadata?.dappOrigin
+              : targetSubjectMetadata.origin
+          }
           onCancel={onCancel}
         />
       )}

ui/pages/permissions-connect/snaps/snaps-connect/snaps-connect.js

@@ -57,7 +57,11 @@ export default function SnapsConnect({
   const snaps = getDedupedSnaps(request, currentPermissions);
 
   const SnapsConnectContent = () => {
-    const { hostname: trimmedOrigin } = useOriginMetadata(origin) || {};
+    let trimmedOrigin = (useOriginMetadata(origin) || {})?.name;
+
+    if (origin?.startsWith('local:') || origin?.startsWith('npm:')) {
+      trimmedOrigin = targetSubjectMetadata.name;
+    }
 
     const snapId = snaps[0];
     const { name: snapName } = useSelector((state) =>

ui/pages/snaps/snap-view/snap-settings.js

@@ -129,6 +129,17 @@ function SnapSettings({ snapId, initRemove, resetInitRemove }) {
     }
   };
 
+  const connectedTitle = () => {
+    const hasSnap = (subject) =>
+      subject.origin.startsWith('local:') || subject.origin.startsWith('npm:');
+    if (connectedSubjects.every((subject) => hasSnap(subject))) {
+      return t('connectedSnaps');
+    } else if (connectedSubjects.some((subject) => hasSnap(subject))) {
+      return t('connectedSitesAndSnaps');
+    }
+    return t('connectedSites');
+  };
+
   useEffect(() => {
     if (initRemove) {
       setIsShowingRemoveWarning(true);
@@ -167,7 +178,7 @@ function SnapSettings({ snapId, initRemove, resetInitRemove }) {
       </Box>
       <Box className="snap-view__content__connected-sites" marginTop={12}>
         <Text variant={TextVariant.bodyLgMedium} marginBottom={2}>
-          {t('connectedSites')}
+          {connectedTitle()}
         </Text>
         <ConnectedSitesList
           connectedSubjects={connectedSubjects}