web/elements: fix token copy button not working on chrome...

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>

web/src/elements/buttons/TokenCopyButton.ts

@@ -60,12 +60,22 @@ export class TokenCopyButton extends ActionButton {
                     return;
                 }
                 this.setLoading();
+                // Because safari is stupid, it only allows navigator.clipboard.write directly
+                // in the @click handler.
+                // And also chrome is stupid, because it doesn't accept Promises as values for
+                // ClipboardItem, so now there's two implementations
+                if (
+                    navigator.userAgent.includes("Safari") &&
+                    !navigator.userAgent.includes("Chrome")
+                ) {
                     navigator.clipboard.write([
                         new ClipboardItem({
                             "text/plain": (this.callAction() as Promise<string>)
                                 .then((key: string) => {
                                     this.setDone(SUCCESS_CLASS);
-                                return key;
+                                    return new Blob([key], {
+                                        type: "text/plain",
+                                    });
                                 })
                                 .catch((err: Error) => {
                                     this.setDone(ERROR_CLASS);
@@ -73,6 +83,20 @@ export class TokenCopyButton extends ActionButton {
                                 }),
                         }),
                     ]);
+                } else {
+                    (this.callAction() as Promise<string>)
+                        .then((key: string) => {
+                            navigator.clipboard.writeText(key).then(() => {
+                                this.setDone(SUCCESS_CLASS);
+                            });
+                        })
+                        .catch((err: Response | undefined) => {
+                            return err?.json().then((errResp) => {
+                                this.setDone(ERROR_CLASS);
+                                throw new Error(errResp["detail"]);
+                            });
+                        });
+                }
             }}
         >
             ${this.isRunning

web/src/pages/outposts/OutpostDeploymentModal.ts

@@ -42,6 +42,7 @@ export class OutpostDeploymentModal extends ModalButton {
                         </label>
                         <div>
                             <ak-token-copy-button
+                                class="pf-m-primary"
                                 identifier="${ifDefined(this.outpost?.tokenIdentifier)}"
                             >
                                 ${t`Click to copy token`}