Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 3708c30

Browse files
Added toast.destroy()
Destroys a previous toast based on assigned id.
1 parent 683179c commit 3708c30

File tree

3 files changed

+20
-24
lines changed

3 files changed

+20
-24
lines changed

‎client/packages/lowcoder/src/comps/hooks/toastComp.ts‎

Lines changed: 14 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -37,36 +37,27 @@ const showNotification = (
3737
text && notificationInstance[level](notificationArgs);
3838
};
3939

40+
const destroy = (
41+
params: EvalParamType[]
42+
) => {
43+
// Extract the id from the params
44+
const id = params[0] as React.Key;
45+
46+
// Call notificationInstance.destroy with the provided id
47+
notificationInstance.destroy(id);
48+
};
49+
4050
//what we would like to expose: title, text, duration, id, btn-obj, onClose, placement
4151

4252
const ToastCompBase = simpleMultiComp({});
4353

4454
export let ToastComp = withExposingConfigs(ToastCompBase, []);
4555

46-
/*
47-
export declare const NotificationPlacements: readonly ["top", "topLeft", "topRight", "bottom", "bottomLeft", "bottomRight"];
48-
export type NotificationPlacement = (typeof NotificationPlacements)[number];
49-
export type IconType = 'success' | 'info' | 'error' | 'warning';
50-
export interface ArgsProps {
51-
message: React.ReactNode;
52-
description?: React.ReactNode;
53-
btn?: React.ReactNode;
54-
key?: React.Key;
55-
onClose?: () => void;
56-
duration?: number | null;
57-
icon?: React.ReactNode;
58-
placement?: NotificationPlacement;
59-
style?: React.CSSProperties;
60-
className?: string;
61-
readonly type?: IconType;
62-
onClick?: () => void;
63-
closeIcon?: React.ReactNode;
64-
props?: DivProps;
65-
role?: 'alert' | 'status';
66-
}
67-
*/
68-
6956
ToastComp = withMethodExposing(ToastComp, [
57+
{
58+
method: { name: "destroy", description: trans("toastComp.destroy"), params: params },
59+
execute: (comp, params) => destroy(params),
60+
},
7061
{
7162
method: { name: "open", description: trans("toastComp.info"), params: params },
7263
execute: (comp, params) => {

‎client/packages/lowcoder/src/i18n/locales/en.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1781,6 +1781,7 @@ export const en = {
17811781
"error": "Send an Error Notification"
17821782
},
17831783
"toastComp": {
1784+
"destroy": "close a Notification",
17841785
"info": "Send a Notification",
17851786
"loading": "Send a Loading Notification",
17861787
"success": "Send a Success Notification",

‎docs/build-apps/write-javascript/built-in-javascript-functions.md‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -127,7 +127,9 @@ message.error("Query runs with error", { duration: 10 })
127127

128128
Use `toast` methods to send a notification, which displays at the top of the screen and lasts for 3 seconds by default. Each of the following five methods supports a unique display style. After 3 toasts they will be stacked.
129129

130-
The id field can be used to update previous toasts.
130+
The id field can be used to update previous toasts. Or used to destroy the previous toast.
131+
132+
Destroy function used without an id will remove all toast.
131133

132134
```javascript
133135
// toast.open( title: string, options?: { message?: string, duration?: number = 3, id?: string, placement?: "top" | "topLeft" | "topRight" | "bottom" | "bottomRight", "bottomRight" = "bottomRight" } )
@@ -140,6 +142,8 @@ toast.success("Query runs successfully", { duration: 10 })
140142
toast.warn("Duplicate Action", {message: "The email was previously sent on Jan 3rd. Click the button again to send.", duration: 5})
141143
// toast.error( title: string, options?: { message?: string, duration?: number = 3, id?: string, placement?: "top" | "topLeft" | "topRight" | "bottom" | "bottomRight", "bottomRight" = "bottomRight" } )
142144
toast.error("Your credentials were invalid", {message: "You have 5 tries left", duration: 5})
145+
//toast.destroy(id?: string)
146+
toast.destroy()
143147
```
144148

145149
<figure><img src="../../.gitbook/assets/builtin-js-toasts.png" alt=""><figcaption></figcaption></figure>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /