From 5e652364c94cbb6a4eb6530f03ba942647ac8871 Mon Sep 17 00:00:00 2001
From: sbwalker <shaun.walker@siliqon.com>
Date: Tue, 16 May 2023 08:00:48 -0400
Subject: [PATCH] migrate PWA script injection

---
 Oqtane.Client/UI/PageState.cs       |  1 +
 Oqtane.Client/UI/SiteRouter.razor   |  1 +
 Oqtane.Client/UI/ThemeBuilder.razor | 67 +++++++++++++++++++++++++++--
 Oqtane.Server/Pages/_Host.cshtml    |  8 ----
 Oqtane.Server/Pages/_Host.cshtml.cs | 46 --------------------
 5 files changed, 65 insertions(+), 58 deletions(-)

diff --git a/Oqtane.Client/UI/PageState.cs b/Oqtane.Client/UI/PageState.cs
index 70cc5ef5..f8df3572 100644
--- a/Oqtane.Client/UI/PageState.cs
+++ b/Oqtane.Client/UI/PageState.cs
@@ -13,6 +13,7 @@ namespace Oqtane.UI
         public Page Page { get; set; }
         public User User { get; set; }
         public Uri Uri { get; set; }
+        public Route Route { get; set; }
         public Dictionary<string, string> QueryString { get; set; }
         public string UrlParameters { get; set; }
         public int ModuleId { get; set; }
diff --git a/Oqtane.Client/UI/SiteRouter.razor b/Oqtane.Client/UI/SiteRouter.razor
index f544ee39..a68bd1c1 100644
--- a/Oqtane.Client/UI/SiteRouter.razor
+++ b/Oqtane.Client/UI/SiteRouter.razor
@@ -223,6 +223,7 @@
                         Page = page,
                         User = user,
                         Uri = new Uri(_absoluteUri, UriKind.Absolute),
+                        Route = route,
                         QueryString = querystring,
                         UrlParameters = route.UrlParameters,
                         ModuleId = moduleid,
diff --git a/Oqtane.Client/UI/ThemeBuilder.razor b/Oqtane.Client/UI/ThemeBuilder.razor
index 15b9bc83..da7fede3 100644
--- a/Oqtane.Client/UI/ThemeBuilder.razor
+++ b/Oqtane.Client/UI/ThemeBuilder.razor
@@ -30,15 +30,33 @@
         }
 
         // set page head content
-        var content = "";
+        var headcontent = "";
+        // favicon
         var favicon = "favicon.ico";
         if (PageState.Site.FaviconFileId != null)
         {
             favicon = Utilities.FileUrl(PageState.Alias, PageState.Site.FaviconFileId.Value);
         }
-        content += $"<link id=\"app-favicon\" rel=\"shortcut icon\" type=\"image/x-icon\" href=\"{favicon}\" />\n";
-        content += PageState.Page.Meta ?? "";
-        SiteState.Properties.HeadContent = content;
+        headcontent += $"<link id=\"app-favicon\" rel=\"shortcut icon\" type=\"image/x-icon\" href=\"{favicon}\" />\n";
+        // PWA manifest
+        if (PageState.Site.PwaIsEnabled && PageState.Site.PwaAppIconFileId != null && PageState.Site.PwaSplashIconFileId != null)
+        {
+            headcontent += "<link id=\"app-manifest\" rel=\"manifest\" />";
+        }
+        // meta
+        headcontent += PageState.Page.Meta ?? "";
+        SiteState.Properties.HeadContent = headcontent;
+
+        // set page body content
+        var bodycontent = "";
+        if (PageState.Site.PwaIsEnabled && PageState.Site.PwaAppIconFileId != null && PageState.Site.PwaSplashIconFileId != null)
+        {
+            bodycontent += CreatePWAScript(PageState.Alias, PageState.Site, PageState.Route);
+        }
+        if (bodycontent != "")
+        {
+            SiteState.Properties.BodyContent = bodycontent;
+        }
 
 		DynamicComponent = builder =>
 		{
@@ -68,4 +86,45 @@
 		await interop.RemoveElementsById("app-stylesheet-page-", "", "app-stylesheet-page-" + batch + "-00");
 		await interop.RemoveElementsById("app-stylesheet-module-", "", "app-stylesheet-module-" + batch + "-00");
 	}
+
+    private string CreatePWAScript(Alias alias, Site site, Route route)
+    {
+        return
+        "<script>" + Environment.NewLine +
+        "    // PWA Manifest" + Environment.NewLine +
+        "    setTimeout(() => {" + Environment.NewLine +
+        "        var manifest = {" + Environment.NewLine +
+        "            \"name\": \"" + site.Name + "\"," + Environment.NewLine +
+        "            \"short_name\": \"" + site.Name + "\"," + Environment.NewLine +
+        "            \"start_url\": \"" + route.SiteUrl + "/\"," + Environment.NewLine +
+        "            \"display\": \"standalone\"," + Environment.NewLine +
+        "            \"background_color\": \"#fff\"," + Environment.NewLine +
+        "            \"description\": \"" + site.Name + "\"," + Environment.NewLine +
+        "            \"icons\": [{" + Environment.NewLine +
+        "                \"src\": \"" + route.RootUrl + Utilities.FileUrl(alias, site.PwaAppIconFileId.Value) + "\"," + Environment.NewLine +
+        "                \"sizes\": \"192x192\"," + Environment.NewLine +
+        "                \"type\": \"image/png\"" + Environment.NewLine +
+        "                }, {" + Environment.NewLine +
+        "                \"src\": \"" + route.RootUrl + Utilities.FileUrl(alias, site.PwaSplashIconFileId.Value) + "\"," + Environment.NewLine +
+        "                \"sizes\": \"512x512\"," + Environment.NewLine +
+        "                \"type\": \"image/png\"" + Environment.NewLine +
+        "            }]" + Environment.NewLine +
+        "       };" + Environment.NewLine +
+        "       const serialized = JSON.stringify(manifest);" + Environment.NewLine +
+        "       const blob = new Blob([serialized], {type: 'application/javascript'});" + Environment.NewLine +
+        "       const url = URL.createObjectURL(blob);" + Environment.NewLine +
+        "       document.getElementById('app-manifest').setAttribute('href', url);" + Environment.NewLine +
+        "    }, 1000);" + Environment.NewLine +
+        "</script>" + Environment.NewLine +
+        "<script>" + Environment.NewLine +
+        "    // PWA Service Worker" + Environment.NewLine +
+        "    if ('serviceWorker' in navigator) {" + Environment.NewLine +
+        "        navigator.serviceWorker.register('/service-worker.js').then(function(registration) {" + Environment.NewLine +
+        "            console.log('ServiceWorker Registration Successful');" + Environment.NewLine +
+        "        }).catch (function(err) {" + Environment.NewLine +
+        "            console.log('ServiceWorker Registration Failed ', err);" + Environment.NewLine +
+        "        });" + Environment.NewLine +
+        "    };" + Environment.NewLine +
+        "</script>";
+    }
 }
diff --git a/Oqtane.Server/Pages/_Host.cshtml b/Oqtane.Server/Pages/_Host.cshtml
index 9583c040..1fae6e3b 100644
--- a/Oqtane.Server/Pages/_Host.cshtml
+++ b/Oqtane.Server/Pages/_Host.cshtml
@@ -8,10 +8,6 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <base href="~/" />
-	@if (!string.IsNullOrEmpty(Model.PWAScript))
-	{
-		<link id="app-manifest" rel="manifest" />
-	}
     <script src="js/app.js"></script>
     <script src="js/loadjs.min.js"></script>
     <link rel="stylesheet" href="css/app.css" />
@@ -52,10 +48,6 @@
 		{
 			@Html.Raw(Model.ReconnectScript)
 		}
-		@if (!string.IsNullOrEmpty(Model.PWAScript))
-		{
-			@Html.Raw(Model.PWAScript)
-		}
 		@Html.Raw(Model.BodyResources)
         <component type="typeof(Oqtane.Body)" render-mode="@((RenderMode)Enum.Parse(typeof(RenderMode), Model.RenderMode, true))" />
     }
diff --git a/Oqtane.Server/Pages/_Host.cshtml.cs b/Oqtane.Server/Pages/_Host.cshtml.cs
index 82689923..b7a9e338 100644
--- a/Oqtane.Server/Pages/_Host.cshtml.cs
+++ b/Oqtane.Server/Pages/_Host.cshtml.cs
@@ -65,7 +65,6 @@ namespace Oqtane.Pages
         public string RemoteIPAddress = "";
         public string HeadResources = "";
         public string BodyResources = "";
-        public string PWAScript = "";
         public string ReconnectScript = "";
         public string Message = "";
 
@@ -126,10 +125,6 @@ namespace Oqtane.Pages
                         {
                             ReconnectScript = CreateReconnectScript();
                         }
-                        if (site.PwaIsEnabled && site.PwaAppIconFileId != null && site.PwaSplashIconFileId != null)
-                        {
-                            PWAScript = CreatePWAScript(alias, site, route);
-                        }
                         var ThemeType = site.DefaultThemeType;
 
                         // get jwt token for downstream APIs
@@ -357,47 +352,6 @@ namespace Oqtane.Pages
             }
         }
 
-        private string CreatePWAScript(Alias alias, Site site, Route route)
-        {
-            return
-            "<script>" + Environment.NewLine +
-            "    // PWA Manifest" + Environment.NewLine +
-            "    setTimeout(() => {" + Environment.NewLine +
-            "        var manifest = {" + Environment.NewLine +
-            "            \"name\": \"" + site.Name + "\"," + Environment.NewLine +
-            "            \"short_name\": \"" + site.Name + "\"," + Environment.NewLine +
-            "            \"start_url\": \"" + route.SiteUrl + "/\"," + Environment.NewLine +
-            "            \"display\": \"standalone\"," + Environment.NewLine +
-            "            \"background_color\": \"#fff\"," + Environment.NewLine +
-            "            \"description\": \"" + site.Name + "\"," + Environment.NewLine +
-            "            \"icons\": [{" + Environment.NewLine +
-            "                \"src\": \"" + route.RootUrl + Utilities.FileUrl(alias, site.PwaAppIconFileId.Value) + "\"," + Environment.NewLine +
-            "                \"sizes\": \"192x192\"," + Environment.NewLine +
-            "                \"type\": \"image/png\"" + Environment.NewLine +
-            "                }, {" + Environment.NewLine +
-            "                \"src\": \"" + route.RootUrl + Utilities.FileUrl(alias, site.PwaSplashIconFileId.Value) + "\"," + Environment.NewLine +
-            "                \"sizes\": \"512x512\"," + Environment.NewLine +
-            "                \"type\": \"image/png\"" + Environment.NewLine +
-            "            }]" + Environment.NewLine +
-            "       };" + Environment.NewLine +
-            "       const serialized = JSON.stringify(manifest);" + Environment.NewLine +
-            "       const blob = new Blob([serialized], {type: 'application/javascript'});" + Environment.NewLine +
-            "       const url = URL.createObjectURL(blob);" + Environment.NewLine +
-            "       document.getElementById('app-manifest').setAttribute('href', url);" + Environment.NewLine +
-            "    }, 1000);" + Environment.NewLine +
-            "</script>" + Environment.NewLine +
-            "<script>" + Environment.NewLine +
-            "    // PWA Service Worker" + Environment.NewLine +
-            "    if ('serviceWorker' in navigator) {" + Environment.NewLine +
-            "        navigator.serviceWorker.register('/service-worker.js').then(function(registration) {" + Environment.NewLine +
-            "            console.log('ServiceWorker Registration Successful');" + Environment.NewLine +
-            "        }).catch (function(err) {" + Environment.NewLine +
-            "            console.log('ServiceWorker Registration Failed ', err);" + Environment.NewLine +
-            "        });" + Environment.NewLine +
-            "    };" + Environment.NewLine +
-            "</script>";
-        }
-
         private string CreateReconnectScript()
         {
             return