Feat: Snapshots - Add a link to share the review urls (adobe#176)

* Feat: Snapshots - Add a link to share the review urls

Fix: adobe/da-live#756

* Update hover color

* Update snapshot.css

Minor CSS tweak to make button have the same padding visually.

---------

Co-authored-by: Chris Millar <cmillar@adobe.com>

Author: 2 people

nx/blocks/snapshot-admin/views/snapshot.css

@@ -237,6 +237,15 @@ svg.icon {
       align-items: center;
       gap: 8px;
     }
+
+    button {
+      padding: 4px 6px;
+      border-radius: 4px;
+
+      &:not(:disabled):hover {
+        background: var(--s2-gray-50);
+      }
+    }
   }
 
   .nx-snapshot-sub-heading-actions {

nx/blocks/snapshot-admin/views/snapshot.js

@@ -165,8 +165,8 @@ class NxSnapshot extends LitElement {
     this.handleSave(false);
   }
 
-  handleShare() {
-    const aemPaths = this._manifest.resources.map((res) => res.aemPreview);
+  handleShare(type = 'aemPreview') {
+    const aemPaths = this._manifest.resources.map((res) => res[type]);
     const blob = new Blob([aemPaths.join('\n')], { type: 'text/plain' });
     const data = [new ClipboardItem({ [blob.type]: blob })];
     navigator.clipboard.write(data);
@@ -382,7 +382,8 @@ class NxSnapshot extends LitElement {
             <p>
               ${showEdit ? html`URLs` : html`${count} URL${s}`}
               ${showEdit ? this.renderCancelUrlBtn() : this.renderEditUrlBtn()}
-              ${showEdit ? nothing : html`<button @click=${this.handleShare}>Share</button>`}
+              ${showEdit ? nothing : html`<button @click=${() => this.handleShare('aemPreview')}>Share URLs</button>`}
+              ${showEdit ? nothing : html`<button @click=${() => this.handleShare('url')}>Share Review URLs</button>`}
             </p>
           </div>
           ${showEdit ? this.renderEditUrls() : this.renderUrls()}