diff --git a/addons/core/translations/actions/en-us.yaml b/addons/core/translations/actions/en-us.yaml
index 2c501df04..dd00b107b 100644
--- a/addons/core/translations/actions/en-us.yaml
+++ b/addons/core/translations/actions/en-us.yaml
@@ -32,3 +32,4 @@ change-password: Change Password
 edit-form: Edit Form
 change-origin: Change Origin URL
 change-state: Change State
+close: Close
diff --git a/ui/desktop/app/components/dialog-detail/index.hbs b/ui/desktop/app/components/dialog-detail/index.hbs
index e7394f141..df3ca1b50 100644
--- a/ui/desktop/app/components/dialog-detail/index.hbs
+++ b/ui/desktop/app/components/dialog-detail/index.hbs
@@ -8,29 +8,15 @@
   @modal={{true}}
   as |dialog|
 >
+  {{yield (hash
+    notification=(component 'rose/notification' class='connection-dialog-notification')
+  )}}
+
   <dialog.body>
-
-    {{!-- <Copyable
-      @text={{concat @session.proxy_address ':' @session.proxy_port}}
-      @buttonText={{t 'actions.copy-to-clipboard'}}
-      @acknowledgeText={{t 'states.copied'}}
-    >
-      {{t
-        'states.connection.success.description'
-        port=session.proxy_port
-        address=session.proxy_address
-        protocol='tcp'
-      }}
-    </Copyable>
-
-    <div class='connection-dialog-successfully'>Succesfully connected</div>
-
-    <h3>Proxy URL</h3>
-    <div class="proxy-url">
-      <p>www.verylongurl.com/section1/subsection2/how-to-tell-the-world-this-is-a-very-long-url-example</p>
-      <Rose::Icon @name="copy-action" @size={{size}} />
-    </div>
-
+    {{yield (hash
+      body=(component 'rose/anonymous')
+    )}}
+    {{!--
     <Rose::Separator />
     <h3>Credentials</h3>
     <div class="credentials-card">
@@ -121,25 +107,11 @@
         <Rose::Separator />
         <div>Code</div>
       </div>
-    </div> --}}
-  </dialog.body>
+    </div>--}}
+  </dialog.body> 
   <dialog.footer>
-    <div>
-      <Rose::Button
-        @style='secondary'
-        {{!-- {{on 'click' (route-action 'acknowledge' session)}} --}}
-      >
-        {{t 'actions.ok'}}
-      </Rose::Button>
-    </div>
-    <div>
-      <Rose::LinkButton
-        @route='index'
-        @style='inline-link-action'
-        @iconRight='chevron-right'
-      >
-        {{@value}}
-      </Rose::LinkButton>
-    </div>
+    {{yield (hash
+      footer=(component 'rose/anonymous')
+    )}}
   </dialog.footer>
 </Rose::Dialog>
\ No newline at end of file
diff --git a/ui/desktop/app/styles/app.scss b/ui/desktop/app/styles/app.scss
index 485e9c824..e742bc718 100644
--- a/ui/desktop/app/styles/app.scss
+++ b/ui/desktop/app/styles/app.scss
@@ -213,7 +213,6 @@
   .copyable-button {
     margin: 0;
     padding: 0 sizing.rems(xxs);
-    position: relative;
     top: -2px;
   }
 
@@ -326,68 +325,63 @@
   text-align: center;
 }
 
+
 // Dialog Detail
 // These styles are a Work In Progress. Expect changes (lots of them)
 .connection-dialog {
-  .connection-dialog-successfully {
-    // background: green;
+  .rose-notification {
+    border-left: 0;
+    border-right: 0;
+    border-top: 0;
+    box-shadow: none;
+    margin-bottom: 0;
   }
 
-  .proxy-url {
+  .rose-dialog-footer {
+    align-items: center;
     display: flex;
-
-    p {
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-  }
-
-  .credentials-card {
-    display: flex;
-    flex-direction: column;
-    margin-bottom: 12px;
-
-    &:last-child { margin-bottom: 0; }
-
-    .credentials-card-header {
+    
+    div:nth-child(1) {
       display: flex;
-      flex-direction: row;
+      justify-content: flex-start;
+      width: 50%;
+    }
+      
+    div:nth-child(2) {
+      display: flex;
+      justify-content: flex-end;
+      width: 50%;
+    }
+  }
 
-      div {
-        display: flex;
-        width: 50%;
+  // .credentials-card {
+  //   display: flex;
+  //   flex-direction: column;
+  //   margin-bottom: 12px;
+
+  //   &:last-child { margin-bottom: 0; }
+
+  //   .credentials-card-header {
+  //     display: flex;
+  //     flex-direction: row;
+
+  //     div {
+  //       display: flex;
+  //       width: 50%;
         
-        &:last-child {
-          justify-content: flex-end;
-        }
-      }
-      // border-bottom: 1px solid grey;
-    }
+  //       &:last-child {
+  //         justify-content: flex-end;
+  //       }
+  //     }
+  //     // border-bottom: 1px solid grey;
+  //   }
 
-    .credentials-card-body {
-      // background: yellow;
-    }
+  //   .credentials-card-body {
+  //     // background: yellow;
+  //   }
 
-    .credentials-card-footer {
-      // background: pink;
-    }
-  }
-}
-
-.rose-dialog-footer {
-  align-items: center;
-  display: flex;
-
-  div:nth-child(1) {
-    display: flex;
-    justify-content: flex-start;
-    width: 50%;
-  }
-  
-  div:nth-child(2) {
-    display: flex;
-    justify-content: flex-end;
-    width: 50%;
-  }
+  //   .credentials-card-footer {
+  //     // background: pink;
+  //   }
+  // }
 }
diff --git a/ui/desktop/app/templates/scopes/scope/projects/targets.hbs b/ui/desktop/app/templates/scopes/scope/projects/targets.hbs
index 2e147f1f3..af84c6adf 100644
--- a/ui/desktop/app/templates/scopes/scope/projects/targets.hbs
+++ b/ui/desktop/app/templates/scopes/scope/projects/targets.hbs
@@ -4,17 +4,19 @@
   {{#each target.sessions as |session|}}
     {{#if session.started_desktop_client}}
       {{#unless session.acknowledged}}
-        <Rose::Dialog
-          @heading={{t 'states.success'}}
-          @dismissButtonText={{t 'actions.ok'}}
-          @icon='check-circle-fill'
-          @style='success'
-          @modal={{true}}
+        <DialogDetail
+          @heading={{concat 'Target connection details: ' session.id}}
           @dismiss={{route-action 'acknowledge' session}}
-          as |dialog|
+          @dismissButtonText={{t 'actions.ok'}}
+          as |dialogDetail|
         >
-          <dialog.body>
+          <dialogDetail.notification
+            @style='success'
+            @heading='Successfully connected'
+          ></dialogDetail.notification>
 
+          <dialogDetail.body>
+            <h3>Proxy URL</h3>
             <Copyable
               @text={{concat session.proxy_address ':' session.proxy_port}}
               @buttonText={{t 'actions.copy-to-clipboard'}}
@@ -28,25 +30,31 @@
               }}
             </Copyable>
 
-          </dialog.body>
-          <dialog.footer>
-            <Rose::Button
-              @style='primary'
-              {{on 'click' (route-action 'acknowledge' session)}}
+            <Rose::Separator />
+
+            <h3>Credentials</h3>
+
+          </dialogDetail.body>
+          <dialogDetail.footer>
+            <div>
+              <Rose::Button
+                @style='secondary'
+                {{on 'click' (route-action 'acknowledge' session)}}
+              >
+                {{t 'actions.close'}}
+              </Rose::Button>
+            </div>
+            <div>
+            {{! <Rose::LinkButton
+              @route='index'
+              @style='inline-link-action'
+              @iconRight='chevron-right'
             >
-              {{t 'actions.ok'}}
-            </Rose::Button>
-          </dialog.footer>
-        </Rose::Dialog>
-        {{!-- <DialogDetail
-          @heading={{t 'states.success'}}
-          @dismiss={{route-action 'acknowledge' session}}
-          @dismissButtonText={{t 'actions.ok'}}
-          @icon='check-circle-fill'
-          @style='success'
-          @session={{session}}
-        >
-        </DialogDetail> --}}
+              
+            </Rose::LinkButton> }}
+            </div>
+          </dialogDetail.footer>
+        </DialogDetail>
       {{/unless}}
     {{/if}}
   {{/each}}
diff --git a/yarn.lock b/yarn.lock
index 18d3e1c74..2ae88ecc3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7617,7 +7617,25 @@ debug@^3.0.0, debug@^3.0.1, debug@^3.1.0, debug@^3.1.1, debug@^3.2.6:
   dependencies:
     ms "^2.1.1"
 
+<<<<<<< HEAD
 debuglog@^1.0.1:
+=======
+<<<<<<< HEAD
+debuglog@*, debuglog@^1.0.1:
+=======
+<<<<<<< HEAD
+=======
+debug@~4.1.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
+  dependencies:
+    ms "^2.1.1"
+
+>>>>>>> aee23f84 (Stop using a bare dialog and start using the Dialog Detail component)
+debuglog@^1.0.1:
+>>>>>>> e9b16588 (Stop using a bare dialog and start using the Dialog Detail component)
+>>>>>>> 842918fe (Stop using a bare dialog and start using the Dialog Detail component)
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
   integrity sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=