web: improve display of action buttons with non-primary classes

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

authentik/events/monitored_tasks.py

@@ -3,7 +3,6 @@ from dataclasses import dataclass, field
 from datetime import datetime
 from enum import Enum
 from timeit import default_timer
-from traceback import format_tb
 from typing import Any, Optional
 
 from celery import Task
@@ -42,8 +41,7 @@ class TaskResult:
 
     def with_error(self, exc: Exception) -> "TaskResult":
         """Since errors might not always be pickle-able, set the traceback"""
-        self.messages.extend(format_tb(exc.__traceback__))
-        self.messages.append(str(exc))
+        self.messages.extend(exception_to_string(exc).splitlines())
         return self
 
 

web/src/authentik.css

@@ -74,7 +74,7 @@ html > form > input {
 }
 
 .pf-m-success {
-    color: var(--pf-global--success-color--100);
+    color: var(--pf-global--success-color--100) !important;
 }
 .pf-m-warning {
     color: var(--pf-global--warning-color--100);

web/src/constants.ts

@@ -1,4 +1,4 @@
-export const PRIMARY_CLASS = "pf-m-primary";
+export const SECONDARY_CLASS = "pf-m-secondary";
 export const SUCCESS_CLASS = "pf-m-success";
 export const ERROR_CLASS = "pf-m-danger";
 export const PROGRESS_CLASS = "pf-m-in-progress";

web/src/elements/buttons/SpinnerButton.ts

@@ -12,7 +12,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 { PFSize } from "../Spinner";
-import { ERROR_CLASS, PRIMARY_CLASS, PROGRESS_CLASS, SUCCESS_CLASS } from "../../constants";
+import { ERROR_CLASS, PROGRESS_CLASS, SUCCESS_CLASS } from "../../constants";
 
 @customElement("ak-spinner-button")
 export class SpinnerButton extends LitElement {
@@ -39,7 +39,6 @@ export class SpinnerButton extends LitElement {
 
     constructor() {
         super();
-        this.classList.add(PRIMARY_CLASS);
     }
 
     setLoading(): void {
@@ -51,10 +50,10 @@ export class SpinnerButton extends LitElement {
     setDone(statusClass: string): void {
         this.isRunning = false;
         this.classList.remove(PROGRESS_CLASS);
-        this.classList.replace(PRIMARY_CLASS, statusClass);
+        this.classList.add(statusClass);
         this.requestUpdate();
         setTimeout(() => {
-            this.classList.replace(statusClass, PRIMARY_CLASS);
+            this.classList.remove(statusClass);
             this.requestUpdate();
         }, 1000);
     }

web/src/elements/buttons/TokenCopyButton.ts

@@ -1,6 +1,6 @@
 import { customElement, property } from "lit-element";
 import { CoreApi } from "@goauthentik/api";
-import { PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants";
+import { SECONDARY_CLASS, SUCCESS_CLASS } from "../../constants";
 import { DEFAULT_CONFIG } from "../../api/Config";
 import { ActionButton } from "./ActionButton";
 
@@ -10,7 +10,7 @@ export class TokenCopyButton extends ActionButton {
     identifier?: string;
 
     @property()
-    buttonClass: string = PRIMARY_CLASS;
+    buttonClass: string = SECONDARY_CLASS;
 
     apiRequest: () => Promise<unknown> = () => {
         this.setLoading();
@@ -28,7 +28,7 @@ export class TokenCopyButton extends ActionButton {
                 return navigator.clipboard.writeText(token.key).then(() => {
                     this.buttonClass = SUCCESS_CLASS;
                     setTimeout(() => {
-                        this.buttonClass = PRIMARY_CLASS;
+                        this.buttonClass = SECONDARY_CLASS;
                     }, 1500);
                 });
             })

web/src/pages/providers/saml/SAMLProviderViewPage.ts

@@ -215,7 +215,6 @@ export class SAMLProviderViewPage extends LitElement {
                                           ${t`Download`}
                                       </a>
                                       <ak-action-button
-                                          class="pf-m-secondary"
                                           .apiRequest=${() => {
                                               const fullUrl =
                                                   window.location.origin +

web/src/pages/system-tasks/SystemTaskListPage.ts

@@ -104,6 +104,7 @@ export class SystemTaskListPage extends TablePage<Task> {
             html`${item.taskFinishTimestamp.toLocaleString()}`,
             this.taskStatus(item),
             html`<ak-action-button
+                class="pf-m-plain"
                 .apiRequest=${() => {
                     return new AdminApi(DEFAULT_CONFIG)
                         .adminSystemTasksRetryCreate({
@@ -119,7 +120,7 @@ export class SystemTaskListPage extends TablePage<Task> {
                         });
                 }}
             >
-                ${t`Retry Task`}
+                <i class="fas fa-sync-alt" aria-hidden="true"></i>
             </ak-action-button>`,
         ];
     }