Would love if notifications from successful/failed queries were slightly bigger and/or able to be positioned right in the center of the screen! The smaller ones sometimes get missed by the user and I've had to build a modal for each success/failure which is bulky and time consuming.
Hey eslinz!
With multipage you could make this modal in the global scope and pass in the error context into the single globally scoped modal. Would something like this speed things up ?
Hi @eslinz, we can customize the position of the notifications but we can't place it in the center of the screen. It's was design decision as it's easier to miss them there because of the contents of the app.
Increasing the duration time may help with visibility.
Notification settings:
On the other hand, we should be able to use a single modal to show success/error notifications if we need more customization. To do this, create a state variable with a default value of: {title: "", description:""}
and on Success/Failure of your queries, use variable.setValue()
to update these properties. If we need to handle many errors, we can use a slightly more complex structure like:
// variable name: notifications
// default value: { errors: {customers: [], orders: []}, success: {customers: []}, orders:[]}}
// example after population using notifications.setValue():
{
errors: {
customers: [],
orders: ["we couldn't find and order with that order number", "no orders found for this customer"]
},
success: {
customers: ["customer added successfully", "showing 20/100 customers"],
orders: []
}
}
To clear them, we can add an event handler to run when the modal closes:
notifications.setValue({ errors: {customers: [], orders: []}, success: {customers: []}, orders:[]}})
.
To render many success and error notifications we can use two List View components and use each key in the notifications
object as their data source.
Let me know if you have any questions!