Adjust reload button on plugin actions (#1946)

Adjust the reload button on plugin actions after restart to be a proper button instead an link styled button.

gradle/changelog/reload_button.yaml

@@ -0,0 +1,2 @@
+- type: fixed
+  description: Adjust reload button on plugin actions ([#1946](https://github.com/scm-manager/scm-manager/pull/1946))

scm-ui/ui-webapp/public/locales/de/admin.json

@@ -74,11 +74,11 @@
       "dependencyNotification": "Mit diesem Plugin werden folgende Abhängigkeiten mit installiert bzw. aktualisiert, wenn sie noch nicht in der aktuellen Version vorhanden sind!",
       "optionalDependencyNotification": "Mit diesem Plugin werden folgende optionale Abhängigkeiten mit aktualisiert, falls sie installiert sind!",
       "dependencies": "Abhängigkeiten",
-      "installedNotification": "Das Plugin wurde erfolgreich installiert. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden:",
-      "updatedNotification": "Das Plugin wurde erfolgreich aktualisiert. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden:",
-      "uninstalledNotification": "Das Plugin wurde erfolgreich installiert. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden:",
-      "executedChangesNotification": "Die Plugin Änderungen wurden erfolgreich durchgeführt. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden:",
-      "reload": "jetzt neu laden",
+      "installedNotification": "Das Plugin wurde erfolgreich installiert. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden.",
+      "updatedNotification": "Das Plugin wurde erfolgreich aktualisiert. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden.",
+      "uninstalledNotification": "Das Plugin wurde erfolgreich installiert. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden.",
+      "executedChangesNotification": "Die Plugin Änderungen wurden erfolgreich durchgeführt. Um Änderungen an der UI zu sehen, muss die Seite neu geladen werden.",
+      "reload": "Seite neu laden",
       "restartNotification": "Der SCM-Manager sollte nur neu gestartet werden, wenn aktuell niemand damit arbeitet.",
       "executePending": "Die folgenden Plugin-Änderungen werden ausgeführt. Anschließend wird SCM-Manager neu gestartet.",
       "cancelPending": "Die folgenden Plugin-Änderungen werden abgebrochen und zurückgesetzt.",

scm-ui/ui-webapp/public/locales/en/admin.json

@@ -74,11 +74,11 @@
       "dependencyNotification": "With this plugin, the following dependencies will be installed/updated if their latest versions are not installed yet!",
       "optionalDependencyNotification": "With this plugin, the following optional dependencies will be updated if they are installed!",
       "dependencies": "Dependencies",
-      "installedNotification": "Successfully installed plugin. You have to reload the page, to see ui changes:",
-      "updatedNotification": "Successfully updated plugin. You have to reload the page, to see ui changes:",
-      "uninstalledNotification": "Successfully uninstalled plugin. You have to reload the page, to see ui changes:",
-      "executedChangesNotification": "Successfully executed plugin changes. You have to reload the page, to see ui changes:",
-      "reload": "reload now",
+      "installedNotification": "Successfully installed plugin. You have to reload the page, to see ui changes.",
+      "updatedNotification": "Successfully updated plugin. You have to reload the page, to see ui changes.",
+      "uninstalledNotification": "Successfully uninstalled plugin. You have to reload the page, to see ui changes.",
+      "executedChangesNotification": "Successfully executed plugin changes. You have to reload the page, to see ui changes.",
+      "reload": "Reload now",
       "restartNotification": "You should only restart SCM-Manager if no one else is currently working with it.",
       "executePending": "The following plugin changes will be executed and after that the SCM-Manager will be restarted.",
       "cancelPending": "The following plugin changes will be canceled.",

scm-ui/ui-webapp/src/admin/plugins/components/PluginActionModal.tsx

@@ -141,15 +141,26 @@ const PluginActionModal: FC<Props> = ({
 
   const footer = (
     <ButtonGroup>
-      <Button
-        color="warning"
-        label={label}
-        loading={loading}
-        action={execute}
-        disabled={!!error || success}
-        ref={initialFocusRef}
-      />
-      <Button label={t("plugins.modal.abort")} action={onClose} />
+      {success ? (
+        <Button
+          label={t("plugins.modal.reload")}
+          action={() => window.location.reload()}
+          color="success"
+          icon="sync-alt"
+        />
+      ) : (
+        <>
+          <Button
+            color="warning"
+            label={label}
+            loading={loading}
+            action={execute}
+            disabled={!!error || success}
+            ref={initialFocusRef}
+          />
+          <Button label={t("plugins.modal.abort")} action={onClose} />
+        </>
+      )}
     </ButtonGroup>
   );
 

scm-ui/ui-webapp/src/admin/plugins/components/PluginModal.tsx

@@ -103,15 +103,26 @@ const PluginModal: FC<Props> = ({ onClose, pluginAction, plugin }) => {
     }
     return (
       <ButtonGroup>
-        <Button
-          label={t(label)}
-          color={color}
-          action={handlePluginAction}
-          loading={loading}
-          disabled={!!error || isDone}
-          ref={initialFocusRef}
-        />
-        <Button label={t("plugins.modal.abort")} action={onClose} />
+        {isDone ? (
+          <Button
+            label={t("plugins.modal.reload")}
+            action={() => window.location.reload()}
+            color="success"
+            icon="sync-alt"
+          />
+        ) : (
+          <>
+            <Button
+              label={t(label)}
+              color={color}
+              action={handlePluginAction}
+              loading={loading}
+              disabled={!!error || isDone}
+              ref={initialFocusRef}
+            />
+            <Button label={t("plugins.modal.abort")} action={onClose} />
+          </>
+        )}
       </ButtonGroup>
     );
   };

scm-ui/ui-webapp/src/admin/plugins/components/SuccessNotification.tsx

@@ -23,7 +23,7 @@
  */
 import React from "react";
 import { WithTranslation, withTranslation } from "react-i18next";
-import { NoStyleButton, Notification } from "@scm-manager/ui-components";
+import { Notification } from "@scm-manager/ui-components";
 import { PluginAction } from "../containers/PluginsOverview";
 
 type Props = WithTranslation & {
@@ -44,15 +44,7 @@ class InstallSuccessNotification extends React.Component<Props> {
   };
 
   render() {
-    const { t } = this.props;
-    return (
-      <Notification type="success">
-        {this.createMessageForPluginAction()}{" "}
-        <NoStyleButton onClick={_ => window.location.reload(true)} className="has-text-info">
-          {t("plugins.modal.reload")}
-        </NoStyleButton>
-      </Notification>
-    );
+    return <Notification type="success">{this.createMessageForPluginAction()}</Notification>;
   }
 }