UI: HDS adoption replace <CopyButton> part 4 #22749
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
malinac02
added
ui
pr/no-changelog
hashicorp-contributed-pr
…/VAULT-19015/replace-CopyButton-part-4
…ippet and replacing with <Hds::Copy::Snippet
…/VAULT-19015/replace-CopyButton-part-4
malinac02
commented
Sep 7, 2023
There was a problem hiding this comment.
Before and after looks the same. Normally, the HDS copy button has an icon, but here the icon is hidden (transparent) and there is still a flash message for success (spoke with Design about this)
…o be more organized
malinac02
commented
Sep 7, 2023
malinac02
commented
Sep 7, 2023
There was a problem hiding this comment.
Another place where the old and new copy buttons look identical, as the HDS copy button icon is hidden. And there is still a flash message for success. Spoke with Design about this
malinac02
commented
Sep 7, 2023
There was a problem hiding this comment.
Another place where copy button looks identical before and after and has a flash message still. Spoke with Design about this
malinac02
commented
Sep 7, 2023
There was a problem hiding this comment.
This copy button was strange because of the Chevron icon. Spoke with Yankun about this and decided to no longer have the Chevron and to have the HDS copy icon instead
Before:
After:
|
Build Results: |
hellobontempo
added a commit
that referenced
this pull request
Sep 15, 2023
* Part 1: Upgrade HDS to 2.9.0 (#22311) * UI: HDS adoption replace <CopyButton> part 2 (#22356) * certificate-card.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * scope-form.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * fix tests caused by changing certificate-card. change hds copy button in certificate-card.hbs * json-editor.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * masked-input.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * fix error with certificate-card.hbs copy button * fix tests that deal with certificate-card.hbs * add class to hds copy buttons to maintain similar styling to curent UI * info-table-row.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * undo change that should instead by merged in from main * change tooltip copy button to white. cleanup * add extra tet for oidc scope form. edit css class for the white icon copy button * fix tests * UI: HDS adoption replace <CopyButton> part 3 (#22614) * encrypt.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * decrypt.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * datakey.hbs. replace 6 <CopyButton> with <Hds::Copy::Button> * rewrap.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * hmac.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * fix typo * add copy-close class to copy & close buttons * export.hbs: replace 2 <CopyButton> with <Hds::Copy::Button>. fix styling * sign.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * fix test caused by changing <pre> tag to <code> in export.hbs * rename class * add extra style to class needed for part 4 of copy button replacement * UI: HDS adoption replace <CopyButton> part 4 (#22749) * user-menu.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * transit-form-show.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * configure-ssh-secret.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * tool-hash.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * tool-random.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * tool-rewrap.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * tool-unwrap.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * tool-wrap.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * paths.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * code-snippet.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * cleanup css for code-snippet. add comments for getting rid of code-snippet and replacing with <Hds::Copy::Snippet * change code-snippet copy icon to gray to match original design * change code-snippet class * accounts.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * hover-copy-button.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * add.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * show.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * copy-secret-dropdown.hbs: replace 1 <CopyButton> with <Hds::Copy::Button> * change styling of 'link' copy buttons * generate-credentials.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * transform-show-transformation.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * sign.hbs: replace 2 <CopyButton> with <Hds::Copy::Button> * hide some copy buttons' icons and use original flash message * undo cleanup of scss file so that I can put cleanup all into one PR to be more organized * update code snippet copy button * UI: HDS adoption replace <CopyButton> part 5: Cleanup (#22884) * remove unecessary code-snippet.scssn class * remove copy classes from masked-input.scss * remove copy button class from text-file.scss * uninstall ember-cli-clipboard 0.16.0 since there is no longer structure <CopyButton> * remove copyright message from code-snippet.scss to avoid merge conflicts with main, where the file is deleted * replace 2 classes with one * remove unecessary class from copy button * cleanup classes * revert changes to avoid merge conflicts * remove is-block class * conditionally render private key * add more info to comment * remove HoverCopyButton * add missing selector * fix control group padding --------- Co-authored-by: [email protected] <[email protected]> Co-authored-by: claire bontempo <[email protected]> * rename class to transparent background * remove unused test selectors * replace transit actions with Copy::Snippet * replace transfrom code blocks with code snippet component * revert extra css fiddling * misc cleanup, unused action * remove copy & close buttons from transit modals * remove is- from class naming * remove hds-copy-button class * add other grey class * more small cleanup * add -top to margin * add changelog --------- Co-authored-by: [email protected] <[email protected]> Co-authored-by: claire bontempo <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This is the 4th of 5 subtasks for the replacement of the structure
<CopyButton>with the<Hds::Copy::Button>. This PR replaces the remaining copy buttons in the codebase.I spoke with Yankun about the design of each of the copy buttons, so everything in this PR has been discussed with Design already. I included pictures in the comments of all the copy buttons that had trickier or different design than the rest.
If of interest, pictures of all changes from this PR are in this slideshow. The speaker notes have information on how to navigate to the HDS copy button so you can see it in the UI. Most changes apart from those I commented are pretty straightforward; their style matches the structure copy buttons except for adding the copy icon which is apart of the HDS copy button