Getting user confirmation

In this section, you’ll learn how to show modal views in order to get confirmation from the user. First, you’ll learn how to implement a successful scenario, where an action generates a successful outcome that you want the user to be aware of. Then, you’ll learn how to implement an error scenario where something went wrong and you don’t want the user to move forward without acknowledging the issue.

Displaying a success confirmation

Let’s start by implementing a modal view that’s displayed as a result of the user successfully performing an action. Here’s the Modal component, which is used to show the user a confirmation modal:

type Props = ModalProps & {
  onPressConfirm: () => void;
  onPressCancel: () => void;
};
export default function ConfirmationModal({
  onPressConfirm,
  onPressCancel,
  ...modalProps
}: Props) {
  return (
    <Modal transparent onRequestClose={() => {}} ...