diff --git a/frontend/frontend/src/pages/App/AppTrends.js b/frontend/frontend/src/pages/App/AppTrends.js
index df04de31..c6d95506 100644
--- a/frontend/frontend/src/pages/App/AppTrends.js
+++ b/frontend/frontend/src/pages/App/AppTrends.js
@@ -14,8 +14,40 @@ import {
useIsAuthenticated,
useUserKey,
} from '../../redux/selectors/userSelectors';
+import { toast, ToastContainer } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
function App() {
+ const toMessage = (input) => {
+ if (typeof input === 'string') return input;
+ if (input.reason.message) return input.reason.message;
+ if (input.message) return input.message;
+ try {
+ return JSON.stringify(input);
+ } catch {
+ return 'Unknown error';
+ }
+ };
+
+ const showError = (event) => {
+ toast.error(toMessage(event), {
+ position: 'bottom-right',
+ autoClose: 1500,
+ hideProgressBar: true,
+ closeOnClick: false,
+ pauseOnHover: true,
+ draggable: false,
+ progress: undefined,
+ });
+ };
+
+ window.addEventListener('error', (event) => {
+ showError(event);
+ });
+ window.addEventListener('unhandledrejection', (event) => {
+ showError(event);
+ });
+
const userKey = useUserKey();
const isAuthenticated = useIsAuthenticated();
const [stage, setStage] = useState(isAuthenticated ? 1 : 0);
@@ -50,6 +82,7 @@ function App() {