Skip to content

Update Confirmation Modal/Alert

This issue started out as an update to the delete-everything-button, but its main focus was updating the layout of the confirmation alert. So now it is about that :)

So the delete-everything confirmation alert will serve as a model for confirmation alerts/modal in general.

What is to be done?

Update .confirm

  • Add async method .confirm to RccOverlayService
  • .confirm should trigger an overlay like in the layout below (for bengal theme, and keep the current look for the default theme)
  • the overlay should have:
    • a message
    • a confirm button
    • a cancel button
  • Copy the call signature of RccAlertController.confirm

Reject or resolve?

RESOLVE: Make sure to only resolve the returned promise, when the user clicked the confirm button.

REJECT: If the user clicked the cancel button, reject with a UserCanceledError. If the modal/alert closes for any other reason: reject with UserCanceledError, unless it is an error, then reject with that error.

Alert or Modal?

At the moment the .confirm method lives on RccAlertController. The new one though should be added to RccOverlayService. I am unsure about whether the new method should use RccAlertController or RccModalController. Switching to RccModalController might make things difficult in terms of keeping the old look for the default theme.

If you go with RccModalController, for default theme: Just make it look roughly like before.

Colors

Use Create (confirm) and View (cancel) color category. (Does not exactly match the layout, will have to rethink)

Update delete-everything button

  • Make it use the new .confirm method on RccOverlayService (see executeHandlerAction below)
  • When the .confirmcall resolves, go to homescreen (root) and trigger a reload (as long as the page does not reload the user will keep seeing his old data, that was supposed to be deleted)
  • Update the wording to match the layout (if needed)

executeHandlerAction

The delete-everything button uses an Action with a confirmMessage; see here: DeleteStorageMainMenuEntryModule /lib/features/src/storage/delete-storage/delete-storage-main-menu-entry.module.ts

Actions with a confirmMessage will trigger a confirmationModal before the Action is executed: ActionService.executeHandlerAction: lib/common/src/actions/action.service.ts

Where to start

  • RccOverlayService: /lib/common/src/overlays/overlay.service.ts
  • RccAlertController.confirm: /lib/common/src/modals-provider/base-alert-controller.service.ts
  • IonicAlertController: (How the app makes use of the Actual ionic AlertController /lib/ionic/src/ionic-modals/ionic-alert-controller.service.ts
  • DeleteStorageMainMenuEntryModule: /lib/features/src/storage/delete-storage/delete-storage-main-menu-entry.module.ts
  • ActionService.executeHandlerAction: lib/common/src/actions/action.service.ts

Figma:

Clickup:

Edited by Andreas Pittrich