Razorpay

Build a paginated data table with a page-size selector and Prev/Next navigation.

Pagination

Build a Toast component in React that renders a variant-based icon, a message, and a dismissible close button at the bottom right of the screen.

Make the Toast provider manage state so that submitting the form adds a new toast and clicking the close button dismisses that specific toast.

Let users dismiss every visible toast at once by pressing the Escape key, using a reusable custom hook.

Debouncing enhances performance by delaying function execution until a certain period of inactivity, preventing unnecessary calls.