SORMAS-Foundation#1613 added cancel button on the unsaved changes dialog

Author: lgal

sormas-api/src/main/java/de/symeda/sormas/api/i18n/Strings.java

@@ -757,6 +757,7 @@ public interface Strings {
 	String text = "text";
 	String toCase = "toCase";
 	String total = "total";
+	String unsavedChanges_cancel = "unsavedChanges.cancel";
 	String unsavedChanges_discard = "unsavedChanges.discard";
 	String unsavedChanges_save = "unsavedChanges.save";
 	String unsavedChanges_warningMessage = "unsavedChanges.warningMessage";

sormas-api/src/main/resources/strings.properties

@@ -807,6 +807,7 @@ unsavedChanges.warningTitle = Confirm navigation
 unsavedChanges.warningMessage = You have unsaved changes on this form.
 unsavedChanges.discard = Discard changes
 unsavedChanges.save = Save changes
+unsavedChanges.cancel = Cancel navigation
 
 headingNetworkDiagramTooManyContacts = Too many contacts
 warningNetworkDiagramTooManyContacts = There are %d contacts and it is possible that your browser will freeze while displaying the diagram.<br/>Please choose a smaller time window.

sormas-ui/src/main/java/de/symeda/sormas/ui/utils/AbstractDetailView.java

@@ -7,6 +7,7 @@
 import com.vaadin.ui.Label;
 import com.vaadin.ui.UI;
 import com.vaadin.ui.Window;
+import com.vaadin.ui.themes.ValoTheme;
 
 import de.symeda.sormas.api.ReferenceDto;
 import de.symeda.sormas.api.i18n.I18nProperties;
@@ -70,28 +71,56 @@ protected boolean findReferenceByParams(String params) {
 	@Override
 	public void beforeLeave(ViewBeforeLeaveEvent event) {
 		if (subComponent.isDirty()) {
-			Window warningPopup = VaadinUiUtil.showConfirmationPopup(
-				I18nProperties.getString(Strings.unsavedChanges_warningTitle),
-				new Label(I18nProperties.getString(Strings.unsavedChanges_warningMessage)),
-				I18nProperties.getString(Strings.unsavedChanges_save),
-				I18nProperties.getString(Strings.unsavedChanges_discard),
-				400,
-				(confirmed) -> {
-					if (confirmed) {
-						subComponent.commitAndHandle();
-					} else {
-						subComponent.discard();
-					}
-
-					event.navigate();
-				});
-
-			warningPopup.setClosable(true);
+			showNavigationConfirmPopup(event);
 		} else {
 			event.navigate();
 		}
 	}
 
+	private void showNavigationConfirmPopup(ViewBeforeLeaveEvent event) {
+		Window warningPopup = VaadinUiUtil.showConfirmationPopup(
+			I18nProperties.getString(Strings.unsavedChanges_warningTitle),
+			new Label(I18nProperties.getString(Strings.unsavedChanges_warningMessage)),
+			popupWindow -> {
+				ConfirmationComponent confirmationComponent = new ConfirmationComponent(false, null) {
+
+					private static final long serialVersionUID = 3664636750443474734L;
+
+					@Override
+					protected void onConfirm() {
+						subComponent.commitAndHandle();
+						popupWindow.close();
+						event.navigate();
+					}
+
+					@Override
+					protected void onCancel() {
+						subComponent.discard();
+						popupWindow.close();
+						event.navigate();
+					}
+				};
+
+				confirmationComponent.getConfirmButton().setCaption(I18nProperties.getString(Strings.unsavedChanges_save));
+				confirmationComponent.getCancelButton().setCaption(I18nProperties.getString(Strings.unsavedChanges_discard));
+
+				confirmationComponent.addExtraButton(
+					ButtonHelper.createButtonWithCaption(
+						Strings.unsavedChanges_cancel,
+						I18nProperties.getString(Strings.unsavedChanges_cancel),
+						null,
+						ValoTheme.BUTTON_LINK),
+					buttonEvent -> {
+						popupWindow.close();
+					});
+
+				return confirmationComponent;
+			},
+			600);
+
+		warningPopup.setClosable(true);
+	}
+
 	/**
 	 * @return The root object displayed on this View.
 	 */

sormas-ui/src/main/java/de/symeda/sormas/ui/utils/ConfirmationComponent.java

@@ -37,14 +37,23 @@ public abstract class ConfirmationComponent extends HorizontalLayout {
 
 	private transient List<DoneListener> doneListeners = new ArrayList<DoneListener>();
 
+	private final boolean inverseOrder;
 	private Button confirmButton;
 	private Button cancelButton;
+	private final String cancelButtonStyle;
 
 	public ConfirmationComponent() {
 		this(false);
 	}
 
 	public ConfirmationComponent(boolean inverseOrder) {
+		this(inverseOrder, ValoTheme.BUTTON_PRIMARY);
+	}
+
+	public ConfirmationComponent(boolean inverseOrder, String cancelButtonStyle) {
+		this.inverseOrder = inverseOrder;
+		this.cancelButtonStyle = cancelButtonStyle;
+
 		setSpacing(true);
 		setSizeUndefined();
 
@@ -59,6 +68,15 @@ public ConfirmationComponent(boolean inverseOrder) {
 			addComponent(discardButton);
 	}
 
+	public void addExtraButton(Button button, Button.ClickListener handler) {
+		button.addClickListener(e -> {
+			handler.buttonClick(e);
+			onDone();
+		});
+
+		addComponent(button, inverseOrder ? getComponentCount() - 1 : 0);
+	}
+
 	public Button getConfirmButton() {
 		if (confirmButton == null) {
 			confirmButton = ButtonHelper.createButton(Captions.actionConfirm, event -> {
@@ -75,7 +93,7 @@ public Button getCancelButton() {
 			cancelButton = ButtonHelper.createButton(Captions.actionCancel, event -> {
 				onCancel();
 				onDone();
-			}, ValoTheme.BUTTON_LINK);
+			}, cancelButtonStyle);
 		}
 
 		return cancelButton;

sormas-ui/src/main/java/de/symeda/sormas/ui/utils/VaadinUiUtil.java

@@ -18,6 +18,7 @@
 package de.symeda.sormas.ui.utils;
 
 import java.util.function.Consumer;
+import java.util.function.Function;
 
 import com.vaadin.icons.VaadinIcons;
 import com.vaadin.server.Sizeable.Unit;
@@ -153,6 +154,37 @@ public static Window showConfirmationPopup(
 		Integer width,
 		Consumer<Boolean> resultConsumer) {
 
+		return showConfirmationPopup(caption, content, popupWindow -> {
+			ConfirmationComponent confirmationComponent = new ConfirmationComponent(false) {
+
+				private static final long serialVersionUID = 1L;
+
+				@Override
+				protected void onConfirm() {
+					resultConsumer.accept(true);
+					popupWindow.close();
+				}
+
+				@Override
+				protected void onCancel() {
+					resultConsumer.accept(false);
+					popupWindow.close();
+				}
+			};
+
+			confirmationComponent.getConfirmButton().setCaption(confirmCaption);
+			confirmationComponent.getCancelButton().setCaption(cancelCaption);
+
+			return confirmationComponent;
+		}, width);
+	}
+
+	public static Window showConfirmationPopup(
+		String caption,
+		Component content,
+		Function<Window, ConfirmationComponent> confirmationComponentProvider,
+		Integer width) {
+
 		Window popupWindow = VaadinUiUtil.createPopupWindow();
 		if (width != null) {
 			popupWindow.setWidth(width, Unit.PIXELS);
@@ -166,33 +198,18 @@ public static Window showConfirmationPopup(
 		content.setWidth(100, Unit.PERCENTAGE);
 		layout.addComponent(content);
 
-		ConfirmationComponent confirmationComponent = new ConfirmationComponent(false) {
-
-			private static final long serialVersionUID = 1L;
-
-			@Override
-			protected void onConfirm() {
-				resultConsumer.accept(true);
-				popupWindow.close();
-			}
-
-			@Override
-			protected void onCancel() {
-				resultConsumer.accept(false);
-				popupWindow.close();
-			}
-		};
-		confirmationComponent.getConfirmButton().setCaption(confirmCaption);
-		confirmationComponent.getCancelButton().setCaption(cancelCaption);
+		ConfirmationComponent confirmationComponent = confirmationComponentProvider.apply(popupWindow);
 
 		layout.addComponent(confirmationComponent);
 		layout.setComponentAlignment(confirmationComponent, Alignment.BOTTOM_RIGHT);
 		layout.setWidth(100, Unit.PERCENTAGE);
 		layout.setSpacing(true);
+
 		popupWindow.setContent(layout);
 		popupWindow.setClosable(false);
 
 		UI.getCurrent().addWindow(popupWindow);
+
 		return popupWindow;
 	}