diff --git a/addons/api/mirage/scenarios/ipc.js b/addons/api/mirage/scenarios/ipc.js
index 0920fd963..729b9fa25 100644
--- a/addons/api/mirage/scenarios/ipc.js
+++ b/addons/api/mirage/scenarios/ipc.js
@@ -65,10 +65,10 @@ export default function initializeMockIPC(server) {
               name: 'Library Name',
               description: 'Library Description',
               credential_store_id: 'csvlt_Q1HFGt7Jpm',
-              type: 'vault'
+              type: 'vault',
             },
             purpose: 'application',
-            secret: btoa('just-a-random-string')
+            secret: btoa('just-a-random-string'),
           },
           {
             credential_library: {
@@ -76,16 +76,18 @@ export default function initializeMockIPC(server) {
               name: 'Library Name',
               description: 'Library Description',
               credential_store_id: 'csvlt_Q1HFGt7Jpm',
-              type: 'vault'
+              type: 'vault',
             },
             purpose: 'ingress',
-            secret: btoa(JSON.stringify({
-              key1: 'value 1',
-              key2: true,
-              key3: {
-                description: 'nested values'
-              }
-            }))
+            secret: btoa(
+              JSON.stringify({
+                key1: 'value 1',
+                key2: true,
+                key3: {
+                  description: 'nested values',
+                },
+              })
+            ),
           },
           {
             credential_library: {
@@ -93,10 +95,10 @@ export default function initializeMockIPC(server) {
               name: 'Library Name',
               description: 'Library Description',
               credential_store_id: 'csvlt_Q1HFGt7Jpm',
-              type: 'vault'
+              type: 'vault',
             },
             purpose: 'application',
-            secret: btoa('just-a-random-string')
+            secret: btoa('just-a-random-string'),
           },
           {
             credential_library: {
@@ -104,18 +106,20 @@ export default function initializeMockIPC(server) {
               name: 'Library Name',
               description: 'Library Description',
               credential_store_id: 'csvlt_Q1HFGt7Jpm',
-              type: 'vault'
+              type: 'vault',
             },
             purpose: 'egress',
-            secret: btoa(JSON.stringify({
-              key1: 'value 1',
-              key2: true,
-              key3: {
-                description: 'nested values'
-              }
-            }))
+            secret: btoa(
+              JSON.stringify({
+                key1: 'value 1',
+                key2: true,
+                key3: {
+                  description: 'nested values',
+                },
+              })
+            ),
           },
-        ]
+        ],
       };
     }
 
diff --git a/addons/core/translations/form/en-us.yaml b/addons/core/translations/form/en-us.yaml
index 5d2a58567..9442c73fc 100644
--- a/addons/core/translations/form/en-us.yaml
+++ b/addons/core/translations/form/en-us.yaml
@@ -62,6 +62,8 @@ client_secret:
   help: The client secret is set-only and may not be unset.
 client_secret_hmac:
   label: Client Secret HMAC
+secret:
+  label: Secret
 max_age:
   label: Maximum Age
   help: The OIDC "max_age" parameter sent to the Authorization Server indicating a maximum acceptable time in seconds since the user's last authentication before requiring the user to reauthenticate. 0 indicates an immediate need to reauthenticate.
@@ -108,3 +110,7 @@ email:
   label: Email
 full_name:
   label: Full Name
+key:
+  label: Key
+value:
+  label: Value
diff --git a/addons/core/translations/resources/en-us.yaml b/addons/core/translations/resources/en-us.yaml
index fc4fa2c65..2a8bb2b67 100644
--- a/addons/core/translations/resources/en-us.yaml
+++ b/addons/core/translations/resources/en-us.yaml
@@ -150,8 +150,13 @@ session:
   credential:
     title: Credential
     title_plural: Credentials
+    secret:
+      label: Secret
     actions:
       detail: Credential library details
+      raw-api:
+        show: View raw API output
+        hide: Hide raw API output
 org:
   title: Org
   title_plural: Orgs
diff --git a/ui/desktop/app/styles/app.scss b/ui/desktop/app/styles/app.scss
index 4abf9c368..a58be8b4d 100644
--- a/ui/desktop/app/styles/app.scss
+++ b/ui/desktop/app/styles/app.scss
@@ -451,4 +451,10 @@ $chevron-down: url("data:image/svg+xml;utf-8,<svg viewBox='0 0 24 24' fill='%231
     border-top: sizing.rems(xxxxs) solid var(--ui-gray-subtler-3);
     padding: sizing.rems(s);
   }
+
+  // Allow text wrapping for copyable content in table
+  .rose-table .copyable {
+    white-space: inherit;
+    word-break: break-word;
+  }
 }
diff --git a/ui/desktop/app/templates/scopes/scope/projects/targets.hbs b/ui/desktop/app/templates/scopes/scope/projects/targets.hbs
index 3656e29d1..f8f3cb97c 100644
--- a/ui/desktop/app/templates/scopes/scope/projects/targets.hbs
+++ b/ui/desktop/app/templates/scopes/scope/projects/targets.hbs
@@ -18,87 +18,121 @@
           @dismissButtonText={{t 'actions.ok'}}
         >
           <:body>
-            <h3>{{t 'resources.target.messages.proxy_url.title'}}
-              {{!-- (<code>{{t 'resources.target.types.tcp'}}</code>)</h3> --}}
-              ({{t 'resources.target.types.tcp'}})</h3>
+            <h3>
+              {{t 'resources.target.messages.proxy_url.title'}}
+              ({{t 'resources.target.types.tcp'}})
+            </h3>
             <p>
               <Copyable
                 @text={{session.proxy}}
                 @buttonText={{t 'actions.copy-to-clipboard'}}
                 @acknowledgeText={{t 'states.copied'}}
               >
-                <code>{{session.proxy_address}}:{{session.proxy_port}}</code>
+                <code>{{session.proxy}}</code>
               </Copyable>
             </p>
 
-            <Rose::Separator />
+            {{#if session.credentials}}
+              <Rose::Separator />
 
-            {{! TODO: Conditional for when credentials aren't available
-            older versions of cli }}
-            <h3>{{t 'resources.session.credential.title_plural'}}</h3>
-            {{!-- <Card
-              @heading={{t 'resources.session.credential.title'}}
-              @icon='app-icons/credentials'
-            >
-              <:header>
-                <Rose::Dropdown
-                  @text={{t 'resources.session.credential.actions.detail'}}
-                  @style='condensed'
-                  @dropdownRight={{true}}
-                  as |dropdown|
+              <h3>{{t 'resources.session.credential.title_plural'}}</h3>
+
+              {{#each session.credentials as |credential|}}
+                <Card
+                  @heading={{concat
+                    (t 'resources.session.credential.title')
+                    ' ('
+                    credential.purpose
+                    ')'
+                  }}
+                  @icon='app-icons/credentials'
                 >
-                  <dropdown.key-value>
-                    <:key>{{t 'form.id.label'}}</:key>
-                    <:value>cl_nbv9375hLHs</:value>
-                  </dropdown.key-value>
-                  <dropdown.key-value>
-                    <:key>{{t 'form.name.label'}}</:key>
-                    <:value>Key/Value</:value>
-                  </dropdown.key-value>
-                  <dropdown.key-value>
-                    <:key>{{t 'form.description.label'}}</:key>
-                    <:value>Lorem ipsum dolor, sit amet consectetur adipisicing
-                      elit. Ut nobis, nemo cum omnis saepe reprehenderit eaque
-                      non odit iste magni quod voluptatem soluta dolor beatae
-                      libero consequatur, perferendis rem molestias.</:value>
-                  </dropdown.key-value>
-                </Rose::Dropdown>
-              </:header>
-              <:body>
-                {{! TODO: Iterate through all credentials }}
-                <Rose::Table @style='condensed' as |table|>
-                  <table.header as |header|>
-                    <header.row as |row|>
-                      <row.headerCell>Key</row.headerCell>
-                      <row.headerCell colspan='2'>Value</row.headerCell>
-                    </header.row>
-                  </table.header>
-                  <table.body as |body|>
-                    <body.row as |row|>
-                      <row.headerCell>foo</row.headerCell>
-                      <row.cell>Value</row.cell>
-                    </body.row>
-                    <body.row as |row|>
-                      <row.headerCell>ttl</row.headerCell>
-                      <row.cell>Test</row.cell>
-                    </body.row>
-                  </table.body>
-                </Rose::Table>
-              </:body>
-              <:footer>
-                <Reveal
-                  @textWhenOpen='Hide content'
-                  @textWhenClose='View content'
-                >
-                  <pre>
-                    <code>
-                      { "auth": null, "lease_duration": 3600, "lease_id": "",
-                      "renewable": false }
-                    </code>
-                  </pre>
-                </Reveal>
-              </:footer>
-            </Card> --}}
+                  <:header>
+                    <Rose::Dropdown
+                      @text={{t 'resources.session.credential.actions.detail'}}
+                      @style='condensed'
+                      @dropdownRight={{true}}
+                      @ignoreClickInside={{true}}
+                      as |dropdown|
+                    >
+                      <dropdown.key-value>
+                        <:key>{{t 'form.id.label'}}</:key>
+                        <:value>
+                          <Copyable
+                            @text={{credential.credential_library_id}}
+                            @buttonText={{t 'actions.copy-to-clipboard'}}
+                            @acknowledgeText={{t 'states.copied'}}
+                          >
+                            <code>{{credential.credential_library_id}}</code>
+                          </Copyable>
+                        </:value>
+                      </dropdown.key-value>
+                      <dropdown.key-value>
+                        <:key>{{t 'form.type.label'}}</:key>
+                        <:value>{{credential.credential_library_type}}</:value>
+                      </dropdown.key-value>
+                      <dropdown.key-value>
+                        <:key>{{t 'form.name.label'}}</:key>
+                        <:value>{{credential.credential_library_name}}</:value>
+                      </dropdown.key-value>
+                      <dropdown.key-value>
+                        <:key>{{t 'form.description.label'}}</:key>
+                        <:value
+                        >{{credential.credential_library_description}}</:value>
+                      </dropdown.key-value>
+                    </Rose::Dropdown>
+                  </:header>
+                  <:body>
+                    <Rose::Table @style='condensed' as |table|>
+                      <table.header as |header|>
+                        <header.row as |row|>
+                          <row.headerCell>{{t
+                              'form.key.label'
+                            }}</row.headerCell>
+                          <row.headerCell colspan='2'>{{t
+                              'form.value.label'
+                            }}</row.headerCell>
+                        </header.row>
+                      </table.header>
+                      <table.body as |body|>
+                        {{#if credential.secret}}
+                          <body.row as |row|>
+                            <row.headerCell>{{t
+                                'form.secret.label'
+                              }}</row.headerCell>
+                            <row.cell colspan='2'>
+                              <Copyable
+                                @text={{credential.secret}}
+                                @buttonText={{t 'actions.copy-to-clipboard'}}
+                                @acknowledgeText={{t 'states.copied'}}
+                              >
+                                {{credential.secret}}
+                              </Copyable>
+                            </row.cell>
+                          </body.row>
+                        {{/if}}
+                      </table.body>
+                    </Rose::Table>
+                  </:body>
+                  <:footer>
+                    <Reveal
+                      @textWhenOpen={{t
+                        'resources.session.credential.actions.raw-api.hide'
+                      }}
+                      @textWhenClose={{t
+                        'resources.session.credential.actions.raw-api.show'
+                      }}
+                    >
+                      <pre>
+                        <code>
+                          {{credential.rawCredential}}
+                        </code>
+                      </pre>
+                    </Reveal>
+                  </:footer>
+                </Card>
+              {{/each}}
+            {{/if}}
           </:body>
           <:footer>
             <div>
@@ -116,4 +150,4 @@
   {{/each}}
 {{/each}}
 
-{{outlet}}
+{{outlet}}
\ No newline at end of file