diff --git a/locales/en.yml b/locales/en.yml
index 24bb73a8..9e133bed 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -269,6 +269,9 @@ config_page:
websocket_port:
label: "WebSocket Port"
+ notifications:
+ save_success: "Settings have been saved"
+
plugin_notifications:
downloading: Downloading the plugin.
downloaded_success: Downloaded successfully.
diff --git a/locales/ja.yml b/locales/ja.yml
index bd0ffe60..b2ff2ad8 100644
--- a/locales/ja.yml
+++ b/locales/ja.yml
@@ -269,6 +269,9 @@ config_page:
websocket_port:
label: "WebSocket Port"
+ notifications:
+ save_success: "設定を保存しました。"
+
plugin_notifications:
downloading: プラグインをダウンロード中。
downloaded_success: プラグインのダウンロードが完了しました。
diff --git a/src-ui/app/others/snackbar_controller/ReactToastifyOverrideClass.scss b/src-ui/app/others/snackbar_controller/ReactToastifyOverrideClass.scss
index d8d3045e..5e0a2539 100644
--- a/src-ui/app/others/snackbar_controller/ReactToastifyOverrideClass.scss
+++ b/src-ui/app/others/snackbar_controller/ReactToastifyOverrideClass.scss
@@ -138,7 +138,7 @@
.fade_out {
opacity: 1;
animation-name: fade_out;
- animation-duration: 0.2s;
- animation-timing-function: ease-out;
+ animation-duration: 0.1s;
+ animation-timing-function: ease-in;
animation-fill-mode: forwards;
}
\ No newline at end of file
diff --git a/src-ui/app/others/snackbar_controller/SnackbarController.jsx b/src-ui/app/others/snackbar_controller/SnackbarController.jsx
index b617b98a..fe692c10 100644
--- a/src-ui/app/others/snackbar_controller/SnackbarController.jsx
+++ b/src-ui/app/others/snackbar_controller/SnackbarController.jsx
@@ -35,14 +35,13 @@ export const SnackbarController = () => {
}
);
- let hideDuration = 5000;
+ let hide_duration = 5000;
if (settings.options?.hide_duration === null) {
- hideDuration = false;
+ hide_duration = false;
} else if (Number(settings.options?.hide_duration)) {
- hideDuration = Number(settings.options?.hide_duration);
+ hide_duration = Number(settings.options?.hide_duration);
}
- const to_hide_progress_bar = (settings.options?.to_hide_progress_bar === true) ? true : false;
useEffect(() => {
if (!settings.is_open) return;
@@ -50,22 +49,29 @@ export const SnackbarController = () => {
const message_text = settings.message;
const category_id = settings.category_id ? settings.category_id : message_text;
- setContainerKey(prevKey => prevKey + 1);
+ const to_hide_progress_bar = (settings.options?.to_hide_progress_bar === true) ? true : false;
+
+ const asyncShowNotification = async () => {
+ setTimeout(() => {
+ toast(message_text, {
+ toastId: category_id,
+ type: settings.status,
+ autoClose: hide_duration,
+ transition: CustomTransition,
+ toastClassName: snackbar_classname,
+ hideProgressBar: to_hide_progress_bar,
+ progressClassName: styles.toast_progress,
+ closeButton: ,
+ onClose: () => {
+ closeNotification();
+ },
+ });
+ }, 100);
+ };
+
+ setContainerKey(prevKey => prevKey + 1);
+ asyncShowNotification();
- setTimeout(() => {
- toast(message_text, {
- toastId: category_id,
- type: settings.status,
- autoClose: hideDuration,
- transition: CustomTransition,
- toastClassName: snackbar_classname,
- progressClassName: styles.toast_progress,
- closeButton: ,
- onClose: () => {
- closeNotification();
- },
- });
- }, 50);
}, [settings]);
return (
@@ -73,7 +79,7 @@ export const SnackbarController = () => {
key={containerKey}
position="bottom-left"
transition={CustomTransition}
- hideProgressBar={to_hide_progress_bar}
+ hideProgressBar={false}
newestOnTop={false}
closeOnClick={false}
pauseOnFocusLoss={false}
diff --git a/src-ui/logics/common/useNotificationStatus.js b/src-ui/logics/common/useNotificationStatus.js
index 6c9614cd..9667aaba 100644
--- a/src-ui/logics/common/useNotificationStatus.js
+++ b/src-ui/logics/common/useNotificationStatus.js
@@ -1,7 +1,9 @@
import { useStore_NotificationStatus } from "@store";
+import { useI18n } from "@useI18n";
export const useNotificationStatus = () => {
const { currentNotificationStatus, updateNotificationStatus } = useStore_NotificationStatus();
+ const { t } = useI18n();
const showNotification_Warning = (message, options = {}) => {
updateNotificationStatus({
@@ -34,12 +36,12 @@ export const useNotificationStatus = () => {
};
const showNotification_SaveSuccess = (options = {}) => {
- options = { hide_duration: 2000, to_hide_progress_bar: true, ...options };
+ options = { hide_duration: 1000, to_hide_progress_bar: true, ...options };
updateNotificationStatus({
status: "success",
is_open: true,
- category_id: (options.category_id) ? options.category_id : null,
- message: "設定の適用と、保存が完了しました。",
+ category_id: "save_success",
+ message: t("config_page.notifications.save_success"),
options: options,
});
};
diff --git a/src-ui/logics/configs/plugins/usePlugins.js b/src-ui/logics/configs/plugins/usePlugins.js
index 42f7d5a9..a467aeb7 100644
--- a/src-ui/logics/configs/plugins/usePlugins.js
+++ b/src-ui/logics/configs/plugins/usePlugins.js
@@ -283,6 +283,10 @@ export const usePlugins = () => {
};
const toggleSavedPluginsStatus = (target_plugin_id) => {
+ const successPluginNotification = (message) => showNotification_Success(message, {
+ hide_duration: 1000,
+ category_id: "to_enable_plugin"
+ });
const is_exists = currentSavedPluginsStatus.data.some(
(d) => d.plugin_id === target_plugin_id
);
@@ -292,8 +296,8 @@ export const usePlugins = () => {
if (d.plugin_id === target_plugin_id) {
d.is_enabled = !d.is_enabled;
(d.is_enabled)
- ? showNotification_Success(t("plugin_notifications.is_enabled"))
- : showNotification_Success(t("plugin_notifications.is_disabled"));
+ ? successPluginNotification(t("plugin_notifications.is_enabled"))
+ : successPluginNotification(t("plugin_notifications.is_disabled"));
}
return d;
});
@@ -303,7 +307,7 @@ export const usePlugins = () => {
plugin_id: target_plugin_id,
is_enabled: true,
});
- showNotification_Success(t("plugin_notifications.is_enabled"))
+ successPluginNotification(t("plugin_notifications.is_enabled"))
}
// 「currentPluginsData.data」でis_downloadedがtrueのものだけ残す