DEV Community

Akshay S
Akshay S

Posted on

An Better way to call mui alert dialog

Installation

Install mui-react-alert with npm

  npm i mui-react-alert
Enter fullscreen mode Exit fullscreen mode

Demo

https://codesandbox.io/s/funny-mestorf-k2dcph

Usage/Examples

App.tsx

import { AlertDialog } from "mui-react-alert";

function App() {
  return (
    <div className="App">
      <AlertDialog />
    </div>
  );
}

export default App;

Enter fullscreen mode Exit fullscreen mode

Button.tsx

import { showAlertConfirmarion } from "mui-react-alert";

function Button() {
  return (
      <button
      onClick={() => {
          showAlertConfirmarion({
          title: "Use Google's location service?",
          cancelLabel: "DISAGREE",
          confirmLabel: "AGREE",
          subtitle:
            "Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.",
          onConfirmation: function (): void {
            alert("Say hello");
          },
        });
      }}
    >
      Show alert dialog
    </button>
  );
}

export default Button;

Enter fullscreen mode Exit fullscreen mode

Top comments (0)