From 1226ed2682970a58ae433b9deb11290333988ddd Mon Sep 17 00:00:00 2001
From: Matthieu Sieben <matthieusieben@users.noreply.github.com>
Date: Tue, 1 Oct 2024 19:08:26 +0200
Subject: [PATCH] Do not display the client_name of untrusted clients (#2847)

* Do not display the client_name of untrusted clients

* do not show client id of trusted clients
---
 .changeset/wicked-items-peel.md               |  5 +++++
 .../src/assets/app/components/accept-form.tsx |  8 +++++--
 .../src/assets/app/components/client-name.tsx | 21 +++++++++----------
 3 files changed, 21 insertions(+), 13 deletions(-)
 create mode 100644 .changeset/wicked-items-peel.md

diff --git a/.changeset/wicked-items-peel.md b/.changeset/wicked-items-peel.md
new file mode 100644
index 00000000000..367a7e153ea
--- /dev/null
+++ b/.changeset/wicked-items-peel.md
@@ -0,0 +1,5 @@
+---
+"@atproto/oauth-provider": patch
+---
+
+Do not display the client_name of untrusted clients
diff --git a/packages/oauth/oauth-provider/src/assets/app/components/accept-form.tsx b/packages/oauth/oauth-provider/src/assets/app/components/accept-form.tsx
index 204493976b4..247bd69013c 100644
--- a/packages/oauth/oauth-provider/src/assets/app/components/accept-form.tsx
+++ b/packages/oauth/oauth-provider/src/assets/app/components/accept-form.tsx
@@ -77,8 +77,12 @@ export function AcceptForm({
         </div>
       )}
       <p>
-        <ClientName clientId={clientId} clientMetadata={clientMetadata} /> is
-        asking for permission to access your account (
+        <ClientName
+          clientId={clientId}
+          clientMetadata={clientMetadata}
+          clientTrusted={clientTrusted}
+        />{' '}
+        is asking for permission to access your account (
         <AccountIdentifier account={account} />
         ).
       </p>
diff --git a/packages/oauth/oauth-provider/src/assets/app/components/client-name.tsx b/packages/oauth/oauth-provider/src/assets/app/components/client-name.tsx
index e47575dfa08..98244d4d289 100644
--- a/packages/oauth/oauth-provider/src/assets/app/components/client-name.tsx
+++ b/packages/oauth/oauth-provider/src/assets/app/components/client-name.tsx
@@ -10,29 +10,28 @@ import { UrlViewer } from './url-viewer'
 export type ClientNameProps = {
   clientId: string
   clientMetadata: OAuthClientMetadata
+  clientTrusted: boolean
+  loopbackClientName?: string
 } & HTMLAttributes<Element>
 
 export function ClientName({
   clientId,
   clientMetadata,
+  clientTrusted,
+  loopbackClientName = 'An application on your device',
   ...attrs
 }: ClientNameProps) {
+  if (clientTrusted && clientMetadata.client_name) {
+    return <span {...attrs}>{clientMetadata.client_name}</span>
+  }
+
   if (isOAuthClientIdLoopback(clientId)) {
-    return <span {...attrs}>An application on your device</span>
+    return <span {...attrs}>{loopbackClientName}</span>
   }
 
   if (isOAuthClientIdDiscoverable(clientId)) {
-    if (clientMetadata.client_name) {
-      return (
-        <span {...attrs}>
-          {clientMetadata.client_name} (
-          <UrlViewer url={clientId} path />)
-        </span>
-      )
-    }
-
     return <UrlViewer {...attrs} url={clientId} path />
   }
 
-  return <span {...attrs}>{clientMetadata.client_name || clientId}</span>
+  return <span {...attrs}>{clientId}</span>
 }