Stop using a bare dialog and start using the Dialog Detail component
This commit is contained in:
Carlos Alcaide committed
1 parent
ecda08164a
commit
50c7bfc659
5 files changed
+114
-121
No files matched your search
@@ -32,3 +32,4 @@ change-password: Change Password
|
||||
edit-form: Edit Form
|
||||
change-origin: Change Origin URL
|
||||
change-state: Change State
|
||||
close: Close
|
||||
@@ -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>
|
||||
@@ -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;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
@@ -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}}
|
||||
|
||||
@@ -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=
|
||||
|
||||
Reference in new issue
Block a user