Skip to content

Conversation

@anwarulislam
Copy link
Member

@anwarulislam anwarulislam commented May 22, 2024

This PR adds support for multiple actions.

Example:

 toast.message('Event has been created', {
  action: [
    {
      label: 'Cancel',
      onClick: (e, toast) => toast.deleteToast(200)
    },
    {
      label: 'Confirm',
      onClick: () => console.log('Confirm')
    }
  ],
  duration: 10000000
})

Added new callback parameter in onClick function which through we can now pass the deleteToast function. And call it if it's needed. The function accepts delay as parameter to delete the toast.

Copy link
Member

@jamesgeorge007 jamesgeorge007 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking good, left a few comments. Also, we could rename the deleteToast method as part of the toast instance received in the onClick callback to dismiss to be consistent with the existing API.

Copy link
Member

@jamesgeorge007 jamesgeorge007 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, left a few minor comments, not blockers per se, can be revisited separately.

Comment on lines +294 to +296
setTimeout(() => {
emit('removeToast', props.toast)
}, TIME_BEFORE_UNMOUNT)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It'll be good to obtain a reference to the timeout ID returned by the inner setTimeout call and clear it during the unmount phase.

setTimeout(() => {
emit('removeToast', props.toast)
}, TIME_BEFORE_UNMOUNT)
return timeoutId
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need not return the timeoutID since it's available in the global scope and consumed in the unmount life cycle hook.

Comment on lines +211 to +216
action: {
label: 'Confirm',
onClick: () => {
toast.dismiss()
}
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Referring to the toast instance from the onClick callback here can prevent closing other toasts.

@AndrewBastin AndrewBastin merged commit 79bb083 into main May 30, 2024
@AndrewBastin AndrewBastin deleted the feat/actions branch May 30, 2024 15:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants