trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

web/elements: use ActionButton as base for TokeCopyButton

Browse source 
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-04-11 00:52:51 +02:00
parent d76db3caba
commit 335c5a0b80
1 changed files with 14 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
web/src/elements/buttons/TokenCopyButton.ts
View file

@ -1,59 +1,39 @@
import { css, CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
import PFButton from "@patternfly/patternfly/components/Button/button.css";
import { customElement, property } from "lit-element";
import { CoreApi } from "authentik-api";
import { ERROR_CLASS, PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants";
import { PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants";
import { DEFAULT_CONFIG } from "../../api/Config";
import AKGlobal from "../../authentik.css";
import { ActionButton } from "./ActionButton";
@customElement("ak-token-copy-button")
export class TokenCopyButton extends LitElement {
export class TokenCopyButton extends ActionButton {
@property()
identifier?: string;
@property()
buttonClass: string = PRIMARY_CLASS;
static get styles(): CSSResult[] {
return [
PFBase,
PFButton,
AKGlobal,
css`
button {
transition: background-color 0.3s ease 0s;
}
`,
];
}
onClick(): void {
apiRequest: () => Promise<unknown> = () => {
this.setLoading();
if (!this.identifier) {
this.buttonClass = ERROR_CLASS;
setTimeout(() => {
this.buttonClass = PRIMARY_CLASS;
}, 1500);
return;
return Promise.reject();
}
new CoreApi(DEFAULT_CONFIG).coreTokensViewKey({
return new CoreApi(DEFAULT_CONFIG).coreTokensViewKey({
identifier: this.identifier
}).then((token) => {
if (!token.key) {
this.buttonClass = ERROR_CLASS;
return;
return Promise.reject();
}
navigator.clipboard.writeText(token.key).then(() => {
return navigator.clipboard.writeText(token.key).then(() => {
this.buttonClass = SUCCESS_CLASS;
setTimeout(() => {
this.buttonClass = PRIMARY_CLASS;
}, 1500);
});
}).catch((err: Response) => {
return err.json();
}).then(errResp => {
throw new Error(errResp["detail"]);
});
}
render(): TemplateResult {
return html`<button @click=${() => this.onClick()} class="pf-c-button ${this.buttonClass}">
<slot></slot>
</button>`;
}
}