web/elements: rewrite SpinnerButton to promises, fix spinner button with forms after errors
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
		@ -1,5 +1,4 @@
 | 
			
		||||
import { customElement, property } from "lit-element";
 | 
			
		||||
import { ERROR_CLASS, SUCCESS_CLASS } from "../../constants";
 | 
			
		||||
import { SpinnerButton } from "./SpinnerButton";
 | 
			
		||||
import { showMessage } from "../messages/MessageContainer";
 | 
			
		||||
import { MessageLevel } from "../messages/Message";
 | 
			
		||||
@ -16,14 +15,9 @@ export class ActionButton extends SpinnerButton {
 | 
			
		||||
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
 | 
			
		||||
    apiRequest: () => Promise<any> = () => { throw new Error(); };
 | 
			
		||||
 | 
			
		||||
    callAction = (): void => {
 | 
			
		||||
        if (this.isRunning === true) {
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
    callAction = (): Promise<void> => {
 | 
			
		||||
        this.setLoading();
 | 
			
		||||
        this.apiRequest().then(() => {
 | 
			
		||||
            this.setDone(SUCCESS_CLASS);
 | 
			
		||||
        }).catch((e: Error | Response) => {
 | 
			
		||||
        return this.apiRequest().catch((e: Error | Response) => {
 | 
			
		||||
            if (e instanceof Error) {
 | 
			
		||||
                showMessage({
 | 
			
		||||
                    level: MessageLevel.error,
 | 
			
		||||
@ -37,7 +31,7 @@ export class ActionButton extends SpinnerButton {
 | 
			
		||||
                    });
 | 
			
		||||
                });
 | 
			
		||||
            }
 | 
			
		||||
            this.setDone(ERROR_CLASS);
 | 
			
		||||
            throw e;
 | 
			
		||||
        });
 | 
			
		||||
    };
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -4,7 +4,7 @@ import PFButton from "@patternfly/patternfly/components/Button/button.css";
 | 
			
		||||
import PFSpinner from "@patternfly/patternfly/components/Spinner/spinner.css";
 | 
			
		||||
import AKGlobal from "../../authentik.css";
 | 
			
		||||
import { SpinnerSize } from "../Spinner";
 | 
			
		||||
import { PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants";
 | 
			
		||||
import { ERROR_CLASS, PRIMARY_CLASS, PROGRESS_CLASS, SUCCESS_CLASS } from "../../constants";
 | 
			
		||||
 | 
			
		||||
@customElement("ak-spinner-button")
 | 
			
		||||
export class SpinnerButton extends LitElement {
 | 
			
		||||
@ -12,7 +12,7 @@ export class SpinnerButton extends LitElement {
 | 
			
		||||
    isRunning = false;
 | 
			
		||||
 | 
			
		||||
    @property()
 | 
			
		||||
    callAction?: () => void;
 | 
			
		||||
    callAction?: () => Promise<void>;
 | 
			
		||||
 | 
			
		||||
    static get styles(): CSSResult[] {
 | 
			
		||||
        return [
 | 
			
		||||
@ -60,7 +60,11 @@ export class SpinnerButton extends LitElement {
 | 
			
		||||
                }
 | 
			
		||||
                this.setLoading();
 | 
			
		||||
                if (this.callAction) {
 | 
			
		||||
                    this.callAction();
 | 
			
		||||
                    this.callAction().then(() => {
 | 
			
		||||
                        this.setDone(SUCCESS_CLASS);
 | 
			
		||||
                    }).catch(() => {
 | 
			
		||||
                        this.setDone(ERROR_CLASS);
 | 
			
		||||
                    });
 | 
			
		||||
                }
 | 
			
		||||
            }}>
 | 
			
		||||
            ${this.isRunning
 | 
			
		||||
 | 
			
		||||
		Reference in New Issue
	
	Block a user