Skip to content

Commit a428591

Browse files
authored
Refactor toast module (#26677)
1. Do not use "async" 2. Call `hideToast` instead of `removeElement` for manual closing
1 parent e4b2bdf commit a428591

File tree

3 files changed

+15
-20
lines changed

3 files changed

+15
-20
lines changed

web_src/js/features/common-global.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -95,14 +95,14 @@ async function fetchActionDoRequest(actionElem, url, opt) {
9595
const data = await resp.json();
9696
// the code was quite messy, sometimes the backend uses "err", sometimes it uses "error", and even "user_error"
9797
// but at the moment, as a new approach, we only use "errorMessage" here, backend can use JSONError() to respond.
98-
await showErrorToast(data.errorMessage || `server error: ${resp.status}`);
98+
showErrorToast(data.errorMessage || `server error: ${resp.status}`);
9999
} else {
100-
await showErrorToast(`server error: ${resp.status}`);
100+
showErrorToast(`server error: ${resp.status}`);
101101
}
102102
} catch (e) {
103103
console.error('error when doRequest', e);
104104
actionElem.classList.remove('is-loading', 'small-loading-icon');
105-
await showErrorToast(i18n.network_error);
105+
showErrorToast(i18n.network_error);
106106
}
107107
}
108108

web_src/js/modules/toast.js

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {htmlEscape} from 'escape-goat';
22
import {svg} from '../svg.js';
3-
import Toastify from 'toastify-js';
3+
import Toastify from 'toastify-js'; // don't use "async import", because when network error occurs, the "async import" also fails and nothing is shown
44

55
const levels = {
66
info: {
@@ -21,9 +21,7 @@ const levels = {
2121
};
2222

2323
// See https://github.com/apvarun/toastify-js#api for options
24-
async function showToast(message, level, {gravity, position, duration, ...other} = {}) {
25-
if (!message) return;
26-
24+
function showToast(message, level, {gravity, position, duration, ...other} = {}) {
2725
const {icon, background, duration: levelDuration} = levels[level ?? 'info'];
2826

2927
const toast = Toastify({
@@ -41,20 +39,17 @@ async function showToast(message, level, {gravity, position, duration, ...other}
4139
});
4240

4341
toast.showToast();
44-
45-
toast.toastElement.querySelector('.toast-close').addEventListener('click', () => {
46-
toast.removeElement(toast.toastElement);
47-
});
42+
toast.toastElement.querySelector('.toast-close').addEventListener('click', () => toast.hideToast());
4843
}
4944

50-
export async function showInfoToast(message, opts) {
51-
return await showToast(message, 'info', opts);
45+
export function showInfoToast(message, opts) {
46+
return showToast(message, 'info', opts);
5247
}
5348

54-
export async function showWarningToast(message, opts) {
55-
return await showToast(message, 'warning', opts);
49+
export function showWarningToast(message, opts) {
50+
return showToast(message, 'warning', opts);
5651
}
5752

58-
export async function showErrorToast(message, opts) {
59-
return await showToast(message, 'error', opts);
53+
export function showErrorToast(message, opts) {
54+
return showToast(message, 'error', opts);
6055
}

web_src/js/modules/toast.test.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,16 @@ import {test, expect} from 'vitest';
22
import {showInfoToast, showErrorToast, showWarningToast} from './toast.js';
33

44
test('showInfoToast', async () => {
5-
await showInfoToast('success 😀', {duration: -1});
5+
showInfoToast('success 😀', {duration: -1});
66
expect(document.querySelector('.toastify')).toBeTruthy();
77
});
88

99
test('showWarningToast', async () => {
10-
await showWarningToast('warning 😐', {duration: -1});
10+
showWarningToast('warning 😐', {duration: -1});
1111
expect(document.querySelector('.toastify')).toBeTruthy();
1212
});
1313

1414
test('showErrorToast', async () => {
15-
await showErrorToast('error 🙁', {duration: -1});
15+
showErrorToast('error 🙁', {duration: -1});
1616
expect(document.querySelector('.toastify')).toBeTruthy();
1717
});

0 commit comments

Comments
 (0)