mirror of
https://github.com/tiqi-group/pydase.git
synced 2025-04-20 08:20:02 +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
|
||||
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
|
||||
dispatch({
|
||||
type: 'UPDATE_ATTRIBUTE',
|
||||
@ -153,25 +150,13 @@ const App = () => {
|
||||
}
|
||||
|
||||
// Creating a new notification
|
||||
const newNotification = {
|
||||
id: Math.random(),
|
||||
time: timeString,
|
||||
text: `${parent_path}.${name} changed to ${notificationMsg}.`
|
||||
};
|
||||
|
||||
const newNotification = `${parent_path}.${name} changed to ${notificationMsg}.`;
|
||||
// Adding the new notification to the list
|
||||
notify(newNotification);
|
||||
}
|
||||
|
||||
function onException(value: ExceptionMessage) {
|
||||
const currentTime = new Date();
|
||||
const timeString = currentTime.toISOString().substr(11, 8);
|
||||
|
||||
const newNotification = {
|
||||
id: Math.random(),
|
||||
time: timeString,
|
||||
text: `${value.data.type}: ${value.data.exception}.`
|
||||
};
|
||||
const newNotification = `${value.data.type}: ${value.data.exception}.`;
|
||||
notifyException(newNotification);
|
||||
}
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
import React from 'react';
|
||||
import { ToastContainer, Toast } from 'react-bootstrap';
|
||||
|
||||
type Notification = {
|
||||
export type Notification = {
|
||||
id: number;
|
||||
time: string;
|
||||
text: string;
|
||||
|
@ -1,16 +1,20 @@
|
||||
import { useState } from 'react';
|
||||
type NotificationMsg = {
|
||||
id: number;
|
||||
time: string;
|
||||
text: string;
|
||||
};
|
||||
import { Notification } from '../components/NotificationsComponent';
|
||||
|
||||
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
|
||||
setNotifications((prevNotifications) => [message, ...prevNotifications]);
|
||||
setNotifications((prevNotifications) => [
|
||||
{ id, text, time: timeString },
|
||||
...prevNotifications
|
||||
]);
|
||||
};
|
||||
|
||||
const removeNotificationById = (id: number) => {
|
||||
|
@ -1,13 +1,13 @@
|
||||
{
|
||||
"files": {
|
||||
"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",
|
||||
"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": [
|
||||
"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