mirror of
https://github.com/tiqi-group/pydase.git
synced 2025-04-21 00:40:01 +02:00
feat: updating useNotification hook
- automatically generates id and timestamp - components just have to provide a message
This commit is contained in:
parent
6e4909ece5
commit
04e0e9e8b2
@ -132,9 +132,6 @@ const App = () => {
|
|||||||
// Extracting data from the notification
|
// Extracting data from the notification
|
||||||
const { parent_path, name, value: newValue } = value.data;
|
const { parent_path, name, value: newValue } = value.data;
|
||||||
|
|
||||||
// Getting the current time in the required format
|
|
||||||
const timeString = new Date().toISOString().substring(11, 19);
|
|
||||||
|
|
||||||
// Dispatching the update to the reducer
|
// Dispatching the update to the reducer
|
||||||
dispatch({
|
dispatch({
|
||||||
type: 'UPDATE_ATTRIBUTE',
|
type: 'UPDATE_ATTRIBUTE',
|
||||||
@ -153,25 +150,13 @@ const App = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Creating a new notification
|
// Creating a new notification
|
||||||
const newNotification = {
|
const newNotification = `${parent_path}.${name} changed to ${notificationMsg}.`;
|
||||||
id: Math.random(),
|
|
||||||
time: timeString,
|
|
||||||
text: `${parent_path}.${name} changed to ${notificationMsg}.`
|
|
||||||
};
|
|
||||||
|
|
||||||
// Adding the new notification to the list
|
// Adding the new notification to the list
|
||||||
notify(newNotification);
|
notify(newNotification);
|
||||||
}
|
}
|
||||||
|
|
||||||
function onException(value: ExceptionMessage) {
|
function onException(value: ExceptionMessage) {
|
||||||
const currentTime = new Date();
|
const newNotification = `${value.data.type}: ${value.data.exception}.`;
|
||||||
const timeString = currentTime.toISOString().substr(11, 8);
|
|
||||||
|
|
||||||
const newNotification = {
|
|
||||||
id: Math.random(),
|
|
||||||
time: timeString,
|
|
||||||
text: `${value.data.type}: ${value.data.exception}.`
|
|
||||||
};
|
|
||||||
notifyException(newNotification);
|
notifyException(newNotification);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { ToastContainer, Toast } from 'react-bootstrap';
|
import { ToastContainer, Toast } from 'react-bootstrap';
|
||||||
|
|
||||||
type Notification = {
|
export type Notification = {
|
||||||
id: number;
|
id: number;
|
||||||
time: string;
|
time: string;
|
||||||
text: string;
|
text: string;
|
||||||
|
@ -1,16 +1,20 @@
|
|||||||
import { useState } from 'react';
|
import { useState } from 'react';
|
||||||
type NotificationMsg = {
|
import { Notification } from '../components/NotificationsComponent';
|
||||||
id: number;
|
|
||||||
time: string;
|
|
||||||
text: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const useNotification = () => {
|
export const useNotification = () => {
|
||||||
const [notifications, setNotifications] = useState([]);
|
const [notifications, setNotifications] = useState<Notification[]>([]);
|
||||||
|
|
||||||
|
const notify = (text: string) => {
|
||||||
|
// Getting the current time in the required format
|
||||||
|
const timeString = new Date().toISOString().substring(11, 19);
|
||||||
|
// Adding an id to the notification to provide a way of removing it
|
||||||
|
const id = Math.random();
|
||||||
|
|
||||||
const notify = (message: NotificationMsg) => {
|
|
||||||
// Custom logic for notifications
|
// Custom logic for notifications
|
||||||
setNotifications((prevNotifications) => [message, ...prevNotifications]);
|
setNotifications((prevNotifications) => [
|
||||||
|
{ id, text, time: timeString },
|
||||||
|
...prevNotifications
|
||||||
|
]);
|
||||||
};
|
};
|
||||||
|
|
||||||
const removeNotificationById = (id: number) => {
|
const removeNotificationById = (id: number) => {
|
||||||
|
@ -1,13 +1,13 @@
|
|||||||
{
|
{
|
||||||
"files": {
|
"files": {
|
||||||
"main.css": "/static/css/main.398bc7f8.css",
|
"main.css": "/static/css/main.398bc7f8.css",
|
||||||
"main.js": "/static/js/main.95543987.js",
|
"main.js": "/static/js/main.799e0879.js",
|
||||||
"index.html": "/index.html",
|
"index.html": "/index.html",
|
||||||
"main.398bc7f8.css.map": "/static/css/main.398bc7f8.css.map",
|
"main.398bc7f8.css.map": "/static/css/main.398bc7f8.css.map",
|
||||||
"main.95543987.js.map": "/static/js/main.95543987.js.map"
|
"main.799e0879.js.map": "/static/js/main.799e0879.js.map"
|
||||||
},
|
},
|
||||||
"entrypoints": [
|
"entrypoints": [
|
||||||
"static/css/main.398bc7f8.css",
|
"static/css/main.398bc7f8.css",
|
||||||
"static/js/main.95543987.js"
|
"static/js/main.799e0879.js"
|
||||||
]
|
]
|
||||||
}
|
}
|
@ -1 +1 @@
|
|||||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site displaying a pydase UI."/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>pydase App</title><script defer="defer" src="/static/js/main.95543987.js"></script><link href="/static/css/main.398bc7f8.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site displaying a pydase UI."/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>pydase App</title><script defer="defer" src="/static/js/main.799e0879.js"></script><link href="/static/css/main.398bc7f8.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
File diff suppressed because one or more lines are too long
1
src/pydase/frontend/static/js/main.799e0879.js.map
Normal file
1
src/pydase/frontend/static/js/main.799e0879.js.map
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user