Feedback Hooks
Toast, notification, and feedback hooks
Hooks for user feedback and notifications.
Package
@tetherto/mdk-react-devkit
Hooks
@tetherto/mdk-react-devkit
Toast notifications
import { useNotification } from '@tetherto/mdk-react-devkit'Related API
When to use useNotification
Use useNotification when a React interaction must show a success, error,
information or warning toast. It is the styled notification surface; use
useNotifications when a
component only needs the headless unread counter.
useNotification example
import { Button, useNotification } from '@tetherto/mdk-react-devkit'
function SaveButton() {
const { notifySuccess, notifyError } = useNotification()
const handleSave = async () => {
try {
await saveData()
notifySuccess('Saved', 'Your changes have been saved.')
} catch {
notifyError('Save failed', 'Try again.', { dontClose: true })
}
}
return <Button onClick={handleSave}>Save</Button>
}@tetherto/mdk-react-devkit
Import the public APIs on this page from @tetherto/mdk-react-devkit.
useNotification
Custom hook for showing notifications backed by the headless notificationStore. Uses @tetherto/mdk-react-devkit/primitives Toast and Toaster components.
() => { notifySuccess: (message: string, description?: string | undefined, options?: NotificationOptions | undefined) => void; notifyError: (message: string, description?: string | undefined, options?: NotificationOptions | undefined) => vo… /* see source */