From 201bda93a2c1b0d0e2f039198d5bb5a564d52d1d Mon Sep 17 00:00:00 2001
From: Bernd Bestel <bernd@berrnd.de>
Date: Fri, 10 Jan 2025 17:15:09 +0100
Subject: [PATCH] Revamped modal iframe dialog handling

---
 changelog/77_UNRELEASED_xxxx-xx-xx.md       |   4 +-
 package.json                                |   2 -
 public/css/grocy.css                        |  18 +++-
 public/js/grocy.js                          | 103 ++++++++++++++------
 public/js/grocy_datatables.js               |   4 +-
 public/viewjs/components/barcodescanner.js  |   4 +-
 public/viewjs/consume.js                    |   4 +-
 public/viewjs/equipment.js                  |   2 +-
 public/viewjs/inventory.js                  |   4 +-
 public/viewjs/mealplan.js                   |   2 +-
 public/viewjs/productbarcodeform.js         |   8 +-
 public/viewjs/productgroupform.js           |   4 +-
 public/viewjs/productgroups.js              |   2 +-
 public/viewjs/purchase.js                   |   8 +-
 public/viewjs/quantityunitconversionform.js |   8 +-
 public/viewjs/recipeform.js                 |   4 +-
 public/viewjs/recipeposform.js              |   4 +-
 public/viewjs/recipes.js                    |   4 +-
 public/viewjs/shoppinglist.js               |   8 +-
 public/viewjs/shoppinglistform.js           |   4 +-
 public/viewjs/shoppinglistitemform.js       |  16 +--
 public/viewjs/stockentries.js               |  17 +++-
 public/viewjs/stockentryform.js             |   5 +-
 public/viewjs/transfer.js                   |   4 +-
 views/about.blade.php                       |   2 +
 views/batteriesoverview.blade.php           |   3 +-
 views/choresoverview.blade.php              |   3 +-
 views/layout/default.blade.php              |   4 -
 views/recipes.blade.php                     |   2 +-
 views/stockentries.blade.php                |   6 +-
 views/stockjournal.blade.php                |   6 +-
 views/stockoverview.blade.php               |   7 +-
 yarn.lock                                   |  17 ----
 33 files changed, 175 insertions(+), 118 deletions(-)

diff --git a/changelog/77_UNRELEASED_xxxx-xx-xx.md b/changelog/77_UNRELEASED_xxxx-xx-xx.md
index c841fe15..20666abb 100644
--- a/changelog/77_UNRELEASED_xxxx-xx-xx.md
+++ b/changelog/77_UNRELEASED_xxxx-xx-xx.md
@@ -54,7 +54,9 @@
 
 ### General
 
-- xxx
+- Optimized nested modal dialogs:
+  - Nested dialogs are now no longer displayed "in each other" and instead "on top of each other"
+  - Wide dialogs (e.g. all showing a table, like showing stock entries of a product from the stock overview more/context menu per line) now use the full screen width
 
 ### API
 
diff --git a/package.json b/package.json
index 217625f6..e719e6cb 100644
--- a/package.json
+++ b/package.json
@@ -6,8 +6,6 @@
 		"@ericblade/quagga2": "^1.2.1",
 		"@fontsource/roboto": "^5.1.1",
 		"@fortawesome/fontawesome-free": "^6.1.1",
-		"@iframe-resizer/child": "^5.3.2",
-		"@iframe-resizer/parent": "^5.3.2",
 		"animate.css": "^3.7.2",
 		"bootbox": "^6.0.0",
 		"bootstrap": "^4.5.2",
diff --git a/public/css/grocy.css b/public/css/grocy.css
index e7e6e8de..86a7a8ae 100755
--- a/public/css/grocy.css
+++ b/public/css/grocy.css
@@ -113,9 +113,6 @@ button.disabled {
 
 iframe.embed-responsive {
 	border: 0;
-	width: 1px;
-	min-width: 100%;
-	min-height: 700px;
 }
 
 /* Hide the default up/down arrow buttons for number inputs because we use our own buttons in numberpicker */
@@ -278,6 +275,21 @@ a:not([href]) {
 	z-index: 99998;
 }
 
+@media (min-width: 576px) {
+	.form .modal-dialog {
+		max-width: 650px;
+	}
+
+	.table .modal-dialog {
+		max-width: 90%;
+	}
+}
+
+.dropdown-menu {
+	max-height: 100vh;
+	overflow-y: auto;
+}
+
 /* Third party component customizations - DataTables */
 .dataTable td {
 	vertical-align: middle !important;
diff --git a/public/js/grocy.js b/public/js/grocy.js
index a57cab8d..ec41f9d9 100644
--- a/public/js/grocy.js
+++ b/public/js/grocy.js
@@ -538,28 +538,39 @@ if ($(".custom-file-label").length > 0)
 	$("<style>").html('.custom-file-label::after { content: "' + __t("Select file") + '"; }').appendTo("head");
 }
 
-ResizeResponsiveEmbeds = function(fillEntireViewport = false)
+ResizeResponsiveEmbeds = function()
 {
-	if (!fillEntireViewport)
+	$("iframe.embed-responsive").each(function()
 	{
-		var maxHeight = $("body").height() - $("#mainNav").outerHeight() - 62;
-	}
-	else
-	{
-		var maxHeight = $("body").height();
-	}
+		$(this).attr("height", $(this)[0].contentWindow.document.body.scrollHeight.toString() + "px");
+	});
 
+	var maxHeight = $("body").height() - $("#mainNav").outerHeight() - 62;
+	if ($("body").hasClass("fullscreen-card"))
+	{
+		maxHeight = $("body").height();
+	}
 	$("embed.embed-responsive").attr("height", maxHeight.toString() + "px");
 }
-$(window).on('resize', function()
+$(window).on("resize", function()
 {
-	ResizeResponsiveEmbeds($("body").hasClass("fullscreen-card"));
+	ResizeResponsiveEmbeds();
 });
-
-if (GetUriParam("embedded"))
+$("iframe").on("load", function()
 {
-	window.parent.iframeResize({ "checkOrigin": false, "warningTimeout": 0, "license": "GPLv3" }, "iframe.embed-responsive");
-}
+	ResizeResponsiveEmbeds();
+});
+$(document).on("shown.bs.modal", function(e)
+{
+	ResizeResponsiveEmbeds();
+});
+$("body").children().each(function(index, child)
+{
+	new ResizeObserver(function()
+	{
+		window.parent.postMessage(WindowMessageBag("ResizeResponsiveEmbeds"), Grocy.BaseUrl);
+	}).observe(child);
+});
 
 function WindowMessageBag(message, payload = null)
 {
@@ -696,13 +707,34 @@ $(window).on("message", function(e)
 {
 	var data = e.originalEvent.data;
 
-	if (data.Message === "ShowSuccessMessage")
+	if (data.Message == "ShowSuccessMessage")
 	{
 		toastr.success(data.Payload);
 	}
-	else if (data.Message === "CloseAllModals")
+	else if (data.Message == "CloseLastModal")
 	{
-		bootbox.hideAll();
+		$(".modal").last().modal("hide");
+	}
+	else if (data.Message == "ResizeResponsiveEmbeds")
+	{
+		ResizeResponsiveEmbeds();
+	}
+	else if (data.Message == "IframeModal")
+	{
+		IframeModal(data.Payload.Link, data.Payload.DialogType);
+	}
+	else if (data.Message == "Reload")
+	{
+		window.location.reload();
+	}
+	else if (data.Message == "BroadcastMessage")
+	{
+		// data.Payload is the original WindowMessageBag => distribute to this window + all child iframes
+		window.postMessage(data.Payload, Grocy.BaseUrl);
+		$("iframe.embed-responsive").each(function()
+		{
+			$(this)[0].contentWindow.postMessage(data.Payload, Grocy.BaseUrl);
+		});
 	}
 });
 
@@ -710,25 +742,46 @@ $(document).on("click", ".show-as-dialog-link", function(e)
 {
 	e.preventDefault();
 
-	var link = $(e.currentTarget).attr("href");
+	var element = $(e.currentTarget);
+	var link = element.attr("href");
 
+	var dialogType = "form";
+	if (element.hasAttr("data-dialog-type"))
+	{
+		dialogType = element.attr("data-dialog-type")
+	}
+
+	if (window.top != window.self)
+	{
+		window.top.postMessage(WindowMessageBag("IframeModal", { "Link": link, "DialogType": dialogType }), Grocy.BaseUrl);
+
+	}
+	else
+	{
+		IframeModal(link, dialogType);
+	}
+});
+
+function IframeModal(link, dialogClass = "form")
+{
 	bootbox.dialog({
 		message: '<iframe class="embed-responsive" src="' + link + '"></iframe>',
 		size: 'large',
 		backdrop: true,
 		closeButton: false,
+		className: dialogClass,
 		buttons: {
 			cancel: {
 				label: __t('Close'),
 				className: 'btn-secondary responsive-button',
 				callback: function()
 				{
-					bootbox.hideAll();
+					$(".modal").last().modal("hide");
 				}
 			}
 		}
 	});
-});
+}
 
 // Init Bootstrap tooltips
 $('[data-toggle="tooltip"]').tooltip();
@@ -780,16 +833,6 @@ $('.dropdown-item').has('.form-check input[type=checkbox]').on('click', function
 	}
 });
 
-$(window).on("message", function(e)
-{
-	var data = e.originalEvent.data;
-
-	if (data.Message === "Reload")
-	{
-		window.location.reload();
-	}
-});
-
 $('[data-toggle="tooltip"][data-html="true"]').on("shown.bs.tooltip", function()
 {
 	RefreshLocaleNumberDisplay(".tooltip");
diff --git a/public/js/grocy_datatables.js b/public/js/grocy_datatables.js
index 58efd8c3..d450a75e 100644
--- a/public/js/grocy_datatables.js
+++ b/public/js/grocy_datatables.js
@@ -320,7 +320,7 @@ $(".change-table-columns-visibility-button").on("click", function(e)
 								// Delete state settings
 								dataTable.state.clear();
 							}
-							bootbox.hideAll();
+							$(".modal").last().modal("hide");
 						}
 					});
 				}
@@ -330,7 +330,7 @@ $(".change-table-columns-visibility-button").on("click", function(e)
 				className: 'btn-primary responsive-button',
 				callback: function()
 				{
-					bootbox.hideAll();
+					$(".modal").last().modal("hide");
 				}
 			}
 		}
diff --git a/public/viewjs/components/barcodescanner.js b/public/viewjs/components/barcodescanner.js
index 7a10b704..c8c887f1 100644
--- a/public/viewjs/components/barcodescanner.js
+++ b/public/viewjs/components/barcodescanner.js
@@ -124,7 +124,7 @@ Grocy.Components.BarcodeScanner.StartScanning = function()
 			window.localStorage.removeItem("cameraId");
 			setTimeout(function()
 			{
-				bootbox.hideAll();
+				$(".modal").last().modal("hide");
 			}, 500);
 			return;
 		}
@@ -142,7 +142,7 @@ Grocy.Components.BarcodeScanner.StopScanning = function()
 	Grocy.Components.BarcodeScanner.DecodedCodesCount = 0;
 	Grocy.Components.BarcodeScanner.DecodedCodesErrorCount = 0;
 
-	bootbox.hideAll();
+	$(".modal").last().modal("hide");
 }
 
 Grocy.Components.BarcodeScanner.TorchOn = function(track)
diff --git a/public/viewjs/consume.js b/public/viewjs/consume.js
index 8cc9b022..7b85c0a0 100644
--- a/public/viewjs/consume.js
+++ b/public/viewjs/consume.js
@@ -91,9 +91,9 @@
 
 					if (GetUriParam("embedded") !== undefined)
 					{
-						window.parent.postMessage(WindowMessageBag("ProductChanged", jsonForm.product_id), Grocy.BaseUrl);
+						window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", jsonForm.product_id)), Grocy.BaseUrl);
 						window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", successMessage), Grocy.BaseUrl);
-						window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+						window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 					}
 					else
 					{
diff --git a/public/viewjs/equipment.js b/public/viewjs/equipment.js
index d834c44f..921104d1 100644
--- a/public/viewjs/equipment.js
+++ b/public/viewjs/equipment.js
@@ -159,7 +159,7 @@ $(".selectedEquipmentInstructionManualToggleFullscreenButton").on('click', funct
 	card.find(".card-header").toggleClass("fixed-top");
 	card.find(".card-body").toggleClass("mt-5");
 	$("body").toggleClass("fullscreen-card");
-	ResizeResponsiveEmbeds(true);
+	ResizeResponsiveEmbeds();
 });
 
 $("#selectedEquipmentDescriptionToggleFullscreenButton").on('click', function(e)
diff --git a/public/viewjs/inventory.js b/public/viewjs/inventory.js
index 50a4cd79..16272ca0 100644
--- a/public/viewjs/inventory.js
+++ b/public/viewjs/inventory.js
@@ -130,9 +130,9 @@ $('#save-inventory-button').on('click', function(e)
 							{
 								Grocy.Components.UserfieldsForm.Save(function()
 								{
-									window.parent.postMessage(WindowMessageBag("ProductChanged", jsonForm.product_id), Grocy.BaseUrl);
+									window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", jsonForm.product_id)), Grocy.BaseUrl);
 									window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", successMessage), Grocy.BaseUrl);
-									window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+									window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 								});
 
 							}
diff --git a/public/viewjs/mealplan.js b/public/viewjs/mealplan.js
index b5870675..017f8f0a 100644
--- a/public/viewjs/mealplan.js
+++ b/public/viewjs/mealplan.js
@@ -937,7 +937,7 @@ $(document).on("click", ".display-recipe-button", function(e)
 						className: 'btn-secondary responsive-button',
 						callback: function()
 						{
-							bootbox.hideAll();
+							$(".modal").last().modal("hide");
 						}
 					}
 				}
diff --git a/public/viewjs/productbarcodeform.js b/public/viewjs/productbarcodeform.js
index 042db704..1745952a 100644
--- a/public/viewjs/productbarcodeform.js
+++ b/public/viewjs/productbarcodeform.js
@@ -27,8 +27,8 @@
 				Grocy.EditObjectId = result.created_object_id;
 				Grocy.Components.UserfieldsForm.Save()
 
-				window.parent.postMessage(WindowMessageBag("ProductBarcodesChanged"), U("/product/" + GetUriParam("product")));
-				window.parent.postMessage(WindowMessageBag("CloseAllModals"), U("/product/" + GetUriParam("product")));
+				window.parent.postMessage(WindowMessageBag("ProductBarcodesChanged"), Grocy.BaseUrl);
+				window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 			},
 			function(xhr)
 			{
@@ -43,8 +43,8 @@
 		Grocy.Api.Put('objects/product_barcodes/' + Grocy.EditObjectId, jsonData,
 			function(result)
 			{
-				window.parent.postMessage(WindowMessageBag("ProductBarcodesChanged"), U("/product/" + GetUriParam("product")));
-				window.parent.postMessage(WindowMessageBag("CloseAllModals"), U("/product/" + GetUriParam("product")));
+				window.parent.postMessage(WindowMessageBag("ProductBarcodesChanged"), Grocy.BaseUrl);
+				window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 			},
 			function(xhr)
 			{
diff --git a/public/viewjs/productgroupform.js b/public/viewjs/productgroupform.js
index 492d0118..2af5a8d0 100644
--- a/public/viewjs/productgroupform.js
+++ b/public/viewjs/productgroupform.js
@@ -23,7 +23,7 @@
 				Grocy.EditObjectId = result.created_object_id;
 				Grocy.Components.UserfieldsForm.Save(function()
 				{
-					window.parent.postMessage(WindowMessageBag("CloseAllModals"), U("/productgroups"));
+					window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 				});
 			},
 			function(xhr)
@@ -40,7 +40,7 @@
 			{
 				Grocy.Components.UserfieldsForm.Save(function()
 				{
-					window.parent.postMessage(WindowMessageBag("CloseAllModals"), U("/productgroups"));
+					window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 				});
 			},
 			function(xhr)
diff --git a/public/viewjs/productgroups.js b/public/viewjs/productgroups.js
index 81362566..603223d9 100644
--- a/public/viewjs/productgroups.js
+++ b/public/viewjs/productgroups.js
@@ -65,7 +65,7 @@ $(window).on("message", function(e)
 {
 	var data = e.originalEvent.data;
 
-	if (data.Message === "CloseAllModals")
+	if (data.Message === "CloseLastModal")
 	{
 		window.location.reload();
 	}
diff --git a/public/viewjs/purchase.js b/public/viewjs/purchase.js
index 7489b76d..ed1b662b 100644
--- a/public/viewjs/purchase.js
+++ b/public/viewjs/purchase.js
@@ -174,11 +174,11 @@ $('#save-purchase-button').on('click', function(e)
 					{
 						Grocy.Components.UserfieldsForm.Save(function()
 						{
-							window.parent.postMessage(WindowMessageBag("ProductChanged", jsonForm.product_id), Grocy.BaseUrl);
+							window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", jsonForm.product_id)), Grocy.BaseUrl);
 							window.parent.postMessage(WindowMessageBag("AfterItemAdded", GetUriParam("listitemid")), Grocy.BaseUrl);
 							window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", successMessage), Grocy.BaseUrl);
 							window.parent.postMessage(WindowMessageBag("Ready"), Grocy.BaseUrl);
-							window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+							window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 						});
 					}
 					else
@@ -627,7 +627,7 @@ function UndoStockBooking(bookingId)
 			Grocy.Api.Get('stock/bookings/' + bookingId.toString(),
 				function(result)
 				{
-					window.postMessage(WindowMessageBag("ProductChanged", result.product_id), Grocy.BaseUrl);
+					window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", result.product_id)), Grocy.BaseUrl);
 				},
 				function(xhr)
 				{
@@ -652,7 +652,7 @@ function UndoStockTransaction(transactionId)
 			Grocy.Api.Get('stock/transactions/' + transactionId.toString(),
 				function(result)
 				{
-					window.postMessage(WindowMessageBag("ProductChanged", result[0].product_id), Grocy.BaseUrl);
+					window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", result[0].product_id)), Grocy.BaseUrl);
 				},
 				function(xhr)
 				{
diff --git a/public/viewjs/quantityunitconversionform.js b/public/viewjs/quantityunitconversionform.js
index e821e29c..99b69191 100644
--- a/public/viewjs/quantityunitconversionform.js
+++ b/public/viewjs/quantityunitconversionform.js
@@ -37,8 +37,8 @@
 					}
 					else
 					{
-						window.parent.postMessage(WindowMessageBag("ProductQUConversionChanged"), U("/product/" + GetUriParam("product")));
-						window.parent.postMessage(WindowMessageBag("CloseAllModals"), U("/product/" + GetUriParam("product")));
+						window.parent.postMessage(WindowMessageBag("ProductQUConversionChanged"), Grocy.BaseUrl);
+						window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 					}
 				});
 			},
@@ -69,8 +69,8 @@
 					}
 					else
 					{
-						window.parent.postMessage(WindowMessageBag("ProductQUConversionChanged"), U("/product/" + GetUriParam("product")));
-						window.parent.postMessage(WindowMessageBag("CloseAllModals"), U("/product/" + GetUriParam("product")));
+						window.parent.postMessage(WindowMessageBag("ProductQUConversionChanged"), Grocy.BaseUrl);
+						window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 					}
 				});
 			},
diff --git a/public/viewjs/recipeform.js b/public/viewjs/recipeform.js
index e7842402..a74abbd9 100644
--- a/public/viewjs/recipeform.js
+++ b/public/viewjs/recipeform.js
@@ -229,7 +229,7 @@ $(document).on('click', '.recipe-pos-edit-button', function(e)
 				className: 'btn-secondary responsive-button',
 				callback: function()
 				{
-					bootbox.hideAll();
+					$(".modal").last().modal("hide");
 				}
 			}
 		}
@@ -275,7 +275,7 @@ $("#recipe-pos-add-button").on("click", function(e)
 				className: 'btn-secondary responsive-button',
 				callback: function()
 				{
-					bootbox.hideAll();
+					$(".modal").last().modal("hide");
 				}
 			}
 		}
diff --git a/public/viewjs/recipeposform.js b/public/viewjs/recipeposform.js
index 236a3ca5..74b3043b 100644
--- a/public/viewjs/recipeposform.js
+++ b/public/viewjs/recipeposform.js
@@ -47,7 +47,7 @@ $('#save-recipe-pos-button').on('click', function(e)
 			function(result)
 			{
 				window.parent.postMessage(WindowMessageBag("IngredientsChanged"), Grocy.BaseUrl);
-				window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+				window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 			},
 			function(xhr)
 			{
@@ -62,7 +62,7 @@ $('#save-recipe-pos-button').on('click', function(e)
 			function(result)
 			{
 				window.parent.postMessage(WindowMessageBag("IngredientsChanged"), Grocy.BaseUrl);
-				window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+				window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 			},
 			function(xhr)
 			{
diff --git a/public/viewjs/recipes.js b/public/viewjs/recipes.js
index 7b33bc37..e0f7fd36 100644
--- a/public/viewjs/recipes.js
+++ b/public/viewjs/recipes.js
@@ -301,7 +301,7 @@ recipesTables.on('select', function(e, dt, type, indexes)
 						className: 'btn-secondary responsive-button',
 						callback: function()
 						{
-							bootbox.hideAll();
+							$(".modal").last().modal("hide");
 						}
 					}
 				}
@@ -333,7 +333,7 @@ $(".recipe-gallery-item").on("click", function(e)
 					className: 'btn-secondary responsive-button',
 					callback: function()
 					{
-						bootbox.hideAll();
+						$(".modal").last().modal("hide");
 					}
 				}
 			}
diff --git a/public/viewjs/shoppinglist.js b/public/viewjs/shoppinglist.js
index 983b736d..e5189e1b 100644
--- a/public/viewjs/shoppinglist.js
+++ b/public/viewjs/shoppinglist.js
@@ -431,7 +431,7 @@ $(document).on("click", "#print-shopping-list-button", function(e)
 			className: 'btn-secondary',
 			callback: function()
 			{
-				bootbox.hideAll();
+				$(".modal").last().modal("hide");
 			}
 		},
 		printtp: {
@@ -439,7 +439,7 @@ $(document).on("click", "#print-shopping-list-button", function(e)
 			className: 'btn-secondary',
 			callback: function()
 			{
-				bootbox.hideAll();
+				$(".modal").last().modal("hide");
 				var printHeader = $("#print-show-header").prop("checked");
 				var thermalPrintDialog = bootbox.dialog({
 					title: __t('Printing'),
@@ -451,7 +451,7 @@ $(document).on("click", "#print-shopping-list-button", function(e)
 					Grocy.Api.Get('print/shoppinglist/thermal?list=' + $("#selected-shopping-list").val() + '&printHeader=' + printHeader,
 						function(result)
 						{
-							bootbox.hideAll();
+							$(".modal").last().modal("hide");
 						},
 						function(xhr)
 						{
@@ -481,7 +481,7 @@ $(document).on("click", "#print-shopping-list-button", function(e)
 			className: 'btn-primary responsive-button',
 			callback: function()
 			{
-				bootbox.hideAll();
+				$(".modal").last().modal("hide");
 				$('.modal-backdrop').remove();
 				$(".print-timestamp").text(moment().format("l LT"));
 
diff --git a/public/viewjs/shoppinglistform.js b/public/viewjs/shoppinglistform.js
index db58ee69..44c23e49 100644
--- a/public/viewjs/shoppinglistform.js
+++ b/public/viewjs/shoppinglistform.js
@@ -25,7 +25,7 @@
 				{
 					window.parent.postMessage(WindowMessageBag("ShoppingListChanged", result.created_object_id), Grocy.BaseUrl);
 					window.parent.postMessage(WindowMessageBag("Ready"), Grocy.BaseUrl);
-					window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+					window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 				});
 			},
 			function(xhr)
@@ -44,7 +44,7 @@
 				{
 					window.parent.postMessage(WindowMessageBag("ShoppingListChanged", Grocy.EditObjectId), Grocy.BaseUrl);
 					window.parent.postMessage(WindowMessageBag("Ready"), Grocy.BaseUrl);
-					window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+					window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 				},
 				function(xhr)
 				{
diff --git a/public/viewjs/shoppinglistitemform.js b/public/viewjs/shoppinglistitemform.js
index a6119215..aa9555d4 100644
--- a/public/viewjs/shoppinglistitemform.js
+++ b/public/viewjs/shoppinglistitemform.js
@@ -70,7 +70,7 @@ $('#save-shoppinglist-button').on('click', function(e)
 							}
 
 							window.parent.postMessage(WindowMessageBag("ShoppingListChanged", $("#shopping_list_id").val().toString()), Grocy.BaseUrl);
-							window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+							window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 						},
 						function(xhr)
 						{
@@ -111,7 +111,7 @@ $('#save-shoppinglist-button').on('click', function(e)
 								}
 
 								window.parent.postMessage(WindowMessageBag("ShoppingListChanged", $("#shopping_list_id").val().toString()), Grocy.BaseUrl);
-								window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+								window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 							},
 							function(xhr)
 							{
@@ -122,7 +122,7 @@ $('#save-shoppinglist-button').on('click', function(e)
 					else
 					{
 						window.parent.postMessage(WindowMessageBag("ShoppingListChanged", $("#shopping_list_id").val().toString()), Grocy.BaseUrl);
-						window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+						window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 					}
 				}
 				else
@@ -151,9 +151,13 @@ $('#save-shoppinglist-button').on('click', function(e)
 						Grocy.Api.Get('stock/products/' + jsonData.product_id,
 							function(productDetails)
 							{
-								window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", __t("Added %1$s of %2$s to the shopping list \"%3$s\"", displayAmount.toLocaleString({ minimumFractionDigits: 0, maximumFractionDigits: Grocy.UserSettings.stock_decimal_places_amounts }) + " " + __n(displayAmount, $("#qu_id option:selected").text(), $("#qu_id option:selected").attr("data-qu-name-plural"), true), productDetails.product.name, $("#shopping_list_id option:selected").text())), Grocy.BaseUrl);
+								if (GetUriParam("product") !== undefined)
+								{
+									window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", __t("Added %1$s of %2$s to the shopping list \"%3$s\"", displayAmount.toLocaleString({ minimumFractionDigits: 0, maximumFractionDigits: Grocy.UserSettings.stock_decimal_places_amounts }) + " " + __n(displayAmount, $("#qu_id option:selected").text(), $("#qu_id option:selected").attr("data-qu-name-plural"), true), productDetails.product.name, $("#shopping_list_id option:selected").text())), Grocy.BaseUrl);
+								}
+
 								window.parent.postMessage(WindowMessageBag("ShoppingListChanged", $("#shopping_list_id").val().toString()), Grocy.BaseUrl);
-								window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+								window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 							},
 							function(xhr)
 							{
@@ -164,7 +168,7 @@ $('#save-shoppinglist-button').on('click', function(e)
 					else
 					{
 						window.parent.postMessage(WindowMessageBag("ShoppingListChanged", $("#shopping_list_id").val().toString()), Grocy.BaseUrl);
-						window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+						window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 					}
 				}
 				else
diff --git a/public/viewjs/stockentries.js b/public/viewjs/stockentries.js
index 15d5602c..75bcf0cc 100644
--- a/public/viewjs/stockentries.js
+++ b/public/viewjs/stockentries.js
@@ -84,11 +84,12 @@ $(document).on('click', '.stock-consume-button', function(e)
 					{
 						toastMessage += "<br>(" + __t("Spoiled") + ")";
 					}
-					toastMessage += '<br><a class="btn btn-secondary btn-sm mt-2" href="#" onclick="UndoStockBookingEntry(' + bookingResponse[0].id + ',' + stockRowId + ')"><i class="fa-solid fa-undo"></i> ' + __t("Undo") + '</a>';
+					toastMessage += '<br><a class="btn btn-secondary btn-sm mt-2" href="#" onclick="UndoStockBookingEntry(' + bookingResponse[0].id + ',' + stockRowId + ', ' + bookingResponse[0].product_id + ')"><i class="fa-solid fa-undo"></i> ' + __t("Undo") + '</a>';
 
 					Grocy.FrontendHelpers.EndUiBusy();
 					RefreshStockEntryRow(stockRowId);
 					toastr.success(toastMessage);
+					window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", productId)), Grocy.BaseUrl);
 				},
 				function(xhr)
 				{
@@ -127,7 +128,7 @@ $(document).on('click', '.product-open-button', function(e)
 				{
 					button.addClass("disabled");
 					Grocy.FrontendHelpers.EndUiBusy();
-					toastr.success(__t('Marked %1$s of %2$s as opened', openAmount.toLocaleString({ minimumFractionDigits: 0, maximumFractionDigits: Grocy.UserSettings.stock_decimal_places_amounts }) + " " + __n(openAmount, result.quantity_unit_stock.name, result.quantity_unit_stock.name_plural, true), result.product.name) + '<br><a class="btn btn-secondary btn-sm mt-2" href="#" onclick="UndoStockBookingEntry(' + bookingResponse[0].id + ',' + stockRowId + ')"><i class="fa-solid fa-undo"></i> ' + __t("Undo") + '</a>');
+					toastr.success(__t('Marked %1$s of %2$s as opened', openAmount.toLocaleString({ minimumFractionDigits: 0, maximumFractionDigits: Grocy.UserSettings.stock_decimal_places_amounts }) + " " + __n(openAmount, result.quantity_unit_stock.name, result.quantity_unit_stock.name_plural, true), result.product.name) + '<br><a class="btn btn-secondary btn-sm mt-2" href="#" onclick="UndoStockBookingEntry(' + bookingResponse[0].id + ',' + stockRowId + ', ' + productId + ')"><i class="fa-solid fa-undo"></i> ' + __t("Undo") + '</a>');
 
 					if (result.product.move_on_open == 1 && result.default_consume_location != null)
 					{
@@ -135,6 +136,7 @@ $(document).on('click', '.product-open-button', function(e)
 					}
 
 					RefreshStockEntryRow(stockRowId);
+					window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", productId)), Grocy.BaseUrl);
 				},
 				function(xhr)
 				{
@@ -309,20 +311,25 @@ $(window).on("message", function(e)
 {
 	var data = e.originalEvent.data;
 
-	if (data.Message === "StockEntryChanged")
+	if (data.Message == "StockEntryChanged")
 	{
 		RefreshStockEntryRow(data.Payload);
 	}
+	else if (data.Message == "ProductChanged")
+	{
+		window.location.reload();
+	}
 });
 
 Grocy.Components.ProductPicker.GetPicker().trigger('change');
 
-function UndoStockBookingEntry(bookingId, stockRowId)
+function UndoStockBookingEntry(bookingId, stockRowId, productId)
 {
 	Grocy.Api.Post('stock/bookings/' + bookingId.toString() + '/undo', {},
 		function(result)
 		{
-			window.postMessage(WindowMessageBag("StockEntryChanged", stockRowId), Grocy.BaseUrl);
+			window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("StockEntryChanged", stockRowId)), Grocy.BaseUrl);
+			window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", productId)), Grocy.BaseUrl);
 			toastr.success(__t("Booking successfully undone"));
 		},
 		function(xhr)
diff --git a/public/viewjs/stockentryform.js b/public/viewjs/stockentryform.js
index dc217287..d36e692d 100644
--- a/public/viewjs/stockentryform.js
+++ b/public/viewjs/stockentryform.js
@@ -62,10 +62,11 @@
 			{
 				var successMessage = __t('Stock entry successfully updated') + '<br><a class="btn btn-secondary btn-sm mt-2" href="#" onclick="UndoStockBookingEntry(\'' + result.id + '\',\'' + Grocy.EditObjectRowId + '\')"><i class="fa-solid fa-undo"></i> ' + __t("Undo") + '</a>';
 
-				window.parent.postMessage(WindowMessageBag("StockEntryChanged", Grocy.EditObjectRowId), Grocy.BaseUrl);
+				window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("StockEntryChanged", Grocy.EditObjectRowId)), Grocy.BaseUrl);
+				window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", Grocy.EditObjectProductId)), Grocy.BaseUrl);
 				window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", successMessage), Grocy.BaseUrl);
 				window.parent.postMessage(WindowMessageBag("Ready"), Grocy.BaseUrl);
-				window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+				window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 			});
 		},
 		function(xhr)
diff --git a/public/viewjs/transfer.js b/public/viewjs/transfer.js
index 1bc1158a..b70040aa 100644
--- a/public/viewjs/transfer.js
+++ b/public/viewjs/transfer.js
@@ -70,9 +70,9 @@
 
 					if (GetUriParam("embedded") !== undefined)
 					{
-						window.parent.postMessage(WindowMessageBag("ProductChanged", jsonForm.product_id), Grocy.BaseUrl);
+						window.top.postMessage(WindowMessageBag("BroadcastMessage", WindowMessageBag("ProductChanged", jsonForm.product_id)), Grocy.BaseUrl);
 						window.parent.postMessage(WindowMessageBag("ShowSuccessMessage", successMessage), Grocy.BaseUrl);
-						window.parent.postMessage(WindowMessageBag("CloseAllModals"), Grocy.BaseUrl);
+						window.parent.postMessage(WindowMessageBag("CloseLastModal"), Grocy.BaseUrl);
 					}
 					else
 					{
diff --git a/views/about.blade.php b/views/about.blade.php
index 7bca7ae9..254cdfd6 100644
--- a/views/about.blade.php
+++ b/views/about.blade.php
@@ -7,6 +7,8 @@
 	<div class="col-12 col-md-6 text-center">
 		<h2 class="title">@yield('title')</h2>
 
+		<hr class="my-2">
+
 		<ul class="nav nav-tabs grocy-tabs justify-content-center mt-3">
 			<li class="nav-item">
 				<a class="nav-link discrete-link active"
diff --git a/views/batteriesoverview.blade.php b/views/batteriesoverview.blade.php
index 1abadfbd..7cb043f9 100644
--- a/views/batteriesoverview.blade.php
+++ b/views/batteriesoverview.blade.php
@@ -137,7 +137,8 @@
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/batteriesjournal?embedded&battery=') }}{{ $currentBatteryEntry->battery_id }}">
+									href="{{ $U('/batteriesjournal?embedded&battery=') }}{{ $currentBatteryEntry->battery_id }}"
+									data-dialog-type="table">
 									<span class="dropdown-item-text">{{ $__t('Battery journal') }}</span>
 								</a>
 								<a class="dropdown-item permission-MASTER_DATA_EDIT show-as-dialog-link"
diff --git a/views/choresoverview.blade.php b/views/choresoverview.blade.php
index ec39debd..52640c8e 100644
--- a/views/choresoverview.blade.php
+++ b/views/choresoverview.blade.php
@@ -182,7 +182,8 @@
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/choresjournal?embedded&chore=') }}{{ $curentChoreEntry->chore_id }}">
+									href="{{ $U('/choresjournal?embedded&chore=') }}{{ $curentChoreEntry->chore_id }}"
+									data-dialog-type="table">
 									<span class="dropdown-item-text">{{ $__t('Chore journal') }}</span>
 								</a>
 								<a class="dropdown-item permission-MASTER_DATA_EDIT"
diff --git a/views/layout/default.blade.php b/views/layout/default.blade.php
index e0667774..37061968 100644
--- a/views/layout/default.blade.php
+++ b/views/layout/default.blade.php
@@ -747,10 +747,6 @@
 	<script src="{{ $U('/packages/chartjs-plugin-doughnutlabel/dist/chartjs-plugin-doughnutlabel.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/packages/chartjs-plugin-piechart-outlabels/dist/chartjs-plugin-piechart-outlabels.min.js?v=', true) }}{{ $version}}"></script>
 	@endif
-	@if($embedded)
-	<script src="{{ $U('/packages/@iframe-resizer/child/index.umd.js?v=', true) }}{{ $version}}"></script>
-	@endif
-	<script src="{{ $U('/packages/@iframe-resizer/parent/index.umd.js?v=', true) }}{{ $version}}"></script>
 
 	<script src="{{ $U('/js/extensions.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/js/grocy_menu_layout.js?v=', true) }}{{ $version }}"></script>
diff --git a/views/recipes.blade.php b/views/recipes.blade.php
index 68461aee..b12a33ec 100644
--- a/views/recipes.blade.php
+++ b/views/recipes.blade.php
@@ -305,7 +305,7 @@
 		<div id="selectedRecipeCard"
 			class="card grocy-card">
 			@if(count($allRecipes) > 1)
-			<div class="card-header card-header-fullscreen mb-1 d-print-none">
+			<div class="card-header card-header-fullscreen mb-1 pt-0 d-print-none">
 				<ul class="nav nav-tabs grocy-tabs card-header-tabs">
 					@foreach($allRecipes as $index=>$recipe)
 					<li class="nav-item">
diff --git a/views/stockentries.blade.php b/views/stockentries.blade.php
index 52d85087..aa3d3979 100644
--- a/views/stockentries.blade.php
+++ b/views/stockentries.blade.php
@@ -208,12 +208,14 @@
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/stockjournal?embedded&product=') }}{{ $stockEntry->product_id }}">
+									href="{{ $U('/stockjournal?embedded&product=') }}{{ $stockEntry->product_id }}"
+									data-dialog-type="table">
 									{{ $__t('Stock journal') }}
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/stockjournal/summary?embedded&product=') }}{{ $stockEntry->product_id }}">
+									href="{{ $U('/stockjournal/summary?embedded&product=') }}{{ $stockEntry->product_id }}"
+									data-dialog-type="table">
 									{{ $__t('Stock journal summary') }}
 								</a>
 								<a class="dropdown-item link-return"
diff --git a/views/stockjournal.blade.php b/views/stockjournal.blade.php
index 0398cfdc..58f16c08 100644
--- a/views/stockjournal.blade.php
+++ b/views/stockjournal.blade.php
@@ -23,7 +23,7 @@
 	</div>
 	<div class="related-links collapse d-md-flex order-2 width-xs-sm-100"
 		id="related-links">
-		<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right"
+		<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right hide-when-embedded"
 			href="{{ $U('/stockjournal/summary') }}">
 			{{ $__t('Journal summary') }}
 		</a>
@@ -226,12 +226,14 @@
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
 									href="{{ $U('/stockentries?embedded&product=') }}{{ $stockLogEntry->product_id }}"
+									data-dialog-type="table"
 									data-product-id="{{ $stockLogEntry->product_id }}">
 									<span class="dropdown-item-text">{{ $__t('Stock entries') }}</span>
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/stockjournal/summary?embedded&product_id=') }}{{ $stockLogEntry->product_id }}">
+									href="{{ $U('/stockjournal/summary?embedded&product_id=') }}{{ $stockLogEntry->product_id }}"
+									data-dialog-type="table">
 									<span class="dropdown-item-text">{{ $__t('Stock journal summary') }}</span>
 								</a>
 								<a class="dropdown-item permission-MASTER_DATA_EDIT link-return"
diff --git a/views/stockoverview.blade.php b/views/stockoverview.blade.php
index 4243c6e9..fb083058 100755
--- a/views/stockoverview.blade.php
+++ b/views/stockoverview.blade.php
@@ -288,17 +288,20 @@
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
 									href="{{ $U('/stockentries?embedded&product=') }}{{ $currentStockEntry->product_id }}"
+									data-dialog-type="table"
 									data-product-id="{{ $currentStockEntry->product_id }}">
 									<span class="dropdown-item-text">{{ $__t('Stock entries') }}</span>
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/stockjournal?embedded&product=') }}{{ $currentStockEntry->product_id }}">
+									href="{{ $U('/stockjournal?embedded&product=') }}{{ $currentStockEntry->product_id }}"
+									data-dialog-type="table">
 									<span class="dropdown-item-text">{{ $__t('Stock journal') }}</span>
 								</a>
 								<a class="dropdown-item show-as-dialog-link"
 									type="button"
-									href="{{ $U('/stockjournal/summary?embedded&product_id=') }}{{ $currentStockEntry->product_id }}">
+									href="{{ $U('/stockjournal/summary?embedded&product_id=') }}{{ $currentStockEntry->product_id }}"
+									data-dialog-type="table">
 									<span class="dropdown-item-text">{{ $__t('Stock journal summary') }}</span>
 								</a>
 								<a class="dropdown-item permission-MASTER_DATA_EDIT link-return"
diff --git a/yarn.lock b/yarn.lock
index c4f7969d..f706e7f2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -38,23 +38,6 @@
   resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free/-/fontawesome-free-6.7.2.tgz#8249de9b7e22fcb3ceb5e66090c30a1d5492b81a"
   integrity sha512-JUOtgFW6k9u4Y+xeIaEiLr3+cjoUPiAuLXoyKOJSia6Duzb7pq+A76P9ZdPDoAoxHdHzq6gE9/jKBGXlZT8FbA==
 
-"@iframe-resizer/child@^5.3.2":
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/@iframe-resizer/child/-/child-5.3.2.tgz#a7035d277cd9dab69f5e4a04db5b4a765c2f1f18"
-  integrity sha512-y4uX26NzdAU1XRURiFCQCNTuLI04WTGUFQNcG4hfNZGvWO/BnfQ3fiVokQwZjnaQH7mzbGE2SLJqYUb1JIqF1Q==
-
-"@iframe-resizer/core@5.3.2":
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/@iframe-resizer/core/-/core-5.3.2.tgz#0c7f10341bcf18236756b291a16588ffe7fcb2da"
-  integrity sha512-is6VXW1m/9y7ZUwyjUuHu5101TPFa69Rv8jNY0HrT5svwb1ICPZKeaoVzDw0TTBBa5eE7XfEFcXCeiP6UR9W3w==
-
-"@iframe-resizer/parent@^5.3.2":
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/@iframe-resizer/parent/-/parent-5.3.2.tgz#5edb16cce4484f5ec0627a8bda82d104c7bd4463"
-  integrity sha512-xjrQpRtsC9p1pBUKewYI9cmHoxomhGGSvspLq7Xgh4uYiifORaHqrqOnAgWKsV6Gl83s16g3RE1v1hRM7ZNOMQ==
-  dependencies:
-    "@iframe-resizer/core" "5.3.2"
-
 "@scarf/scarf@=1.4.0":
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/@scarf/scarf/-/scarf-1.4.0.tgz#3bbb984085dbd6d982494538b523be1ce6562972"