From 6b34901d94d7c9332accae7ab907ba77c4e247a1 Mon Sep 17 00:00:00 2001
From: Cotes Chung <11371340+cotes2020@users.noreply.github.com>
Date: Tue, 13 Feb 2024 23:35:32 +0800
Subject: [PATCH] refactor(pwa): revert to JS and Liquid mixing

The gem package won't be able to pass `/sw.min.js` to the user end
---
 .gitignore                            |  2 --
 _includes/head.html                   |  9 ---------
 {_javascript => assets/js}/pwa/app.js | 20 ++++++++------------
 {_javascript => assets/js}/pwa/sw.js  | 14 +++++++-------
 jekyll-theme-chirpy.gemspec           |  2 +-
 package.json                          |  4 ++--
 rollup.config.js                      | 20 +++++---------------
 tools/init                            |  2 +-
 tools/release                         |  3 +--
 9 files changed, 25 insertions(+), 51 deletions(-)
 rename {_javascript => assets/js}/pwa/app.js (73%)
 rename {_javascript => assets/js}/pwa/sw.js (84%)

diff --git a/.gitignore b/.gitignore
index 3fdfa27..cee9e12 100644
--- a/.gitignore
+++ b/.gitignore
@@ -18,6 +18,4 @@ package-lock.json
 .idea
 
 # Misc
-*.map
-sw.min.js
 assets/js/dist
diff --git a/_includes/head.html b/_includes/head.html
index 839af65..9bad78a 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -50,15 +50,6 @@
 
   {{ seo_tags }}
 
-  <!-- PWA cache settings -->
-  <meta
-    name="pwa-cache"
-    content="{{ site.pwa.cache.enabled | default: 'false' }}"
-    {%- if site.baseurl and site.baseurl != empty -%}
-      data-baseurl="{{ site.baseurl }}"
-    {%- endif -%}
-  >
-
   <title>
     {%- unless page.layout == 'home' -%}
       {{ page.title | append: ' | ' }}
diff --git a/_javascript/pwa/app.js b/assets/js/pwa/app.js
similarity index 73%
rename from _javascript/pwa/app.js
rename to assets/js/pwa/app.js
index 5add2d7..8599fe3 100644
--- a/_javascript/pwa/app.js
+++ b/assets/js/pwa/app.js
@@ -1,22 +1,18 @@
-/* PWA loader */
+---
+layout: compress
+permalink: /assets/js/dist/:basename.min.js
+---
 
 if ('serviceWorker' in navigator) {
-  const meta = document.querySelector('meta[name="pwa-cache"]');
-  const isEnabled = meta.content === 'true';
+  const isEnabled = '{{ site.pwa.enabled }}' === 'true';
 
   if (isEnabled) {
-    let swUrl = '/sw.min.js';
-    const baseUrl = meta.getAttribute('data-baseurl');
-
-    if (baseUrl !== null) {
-      swUrl = `${baseUrl}${swUrl}?baseurl=${encodeURIComponent(baseUrl)}`;
-    }
-
+    const swUrl = '{{ '/sw.min.js' | relative_url }}';
     const $notification = $('#notification');
     const $btnRefresh = $('#notification .toast-body>button');
 
     navigator.serviceWorker.register(swUrl).then((registration) => {
-      // In case the user ignores the notification
+      {% comment %}In case the user ignores the notification{% endcomment %}
       if (registration.waiting) {
         $notification.toast('show');
       }
@@ -41,7 +37,7 @@ if ('serviceWorker' in navigator) {
 
     let refreshing = false;
 
-    // Detect controller change and refresh all the opened tabs
+    {% comment %}Detect controller change and refresh all the opened tabs{% endcomment %}
     navigator.serviceWorker.addEventListener('controllerchange', () => {
       if (!refreshing) {
         window.location.reload();
diff --git a/_javascript/pwa/sw.js b/assets/js/pwa/sw.js
similarity index 84%
rename from _javascript/pwa/sw.js
rename to assets/js/pwa/sw.js
index cb2bdef..adc707e 100644
--- a/_javascript/pwa/sw.js
+++ b/assets/js/pwa/sw.js
@@ -1,10 +1,10 @@
-/* PWA service worker */
+---
+layout: compress
+permalink: /:basename.min.js
+# PWA service worker
+---
 
-const swconfPath = '/assets/js/data/swconf.js';
-const params = new URL(location).searchParams;
-const swconfUrl = params.has('baseurl')
-  ? `${params.get('baseurl')}${swconfPath}`
-  : swconfPath;
+const swconfUrl = '{{ '/assets/js/data/swconf.js' | relative_url }}';
 
 importScripts(swconfUrl);
 const purge = swconf.purge;
@@ -88,7 +88,7 @@ self.addEventListener('fetch', (event) => {
           return response;
         }
 
-        // See : <https://developers.google.com/web/fundamentals/primers/service-workers#cache_and_return_requests>
+        {% comment %}See: <https://developers.google.com/web/fundamentals/primers/service-workers#cache_and_return_requests>{% endcomment %}
         let responseToCache = response.clone();
 
         caches.open(swconf.cacheName).then((cache) => {
diff --git a/jekyll-theme-chirpy.gemspec b/jekyll-theme-chirpy.gemspec
index d1898cd..2f01881 100644
--- a/jekyll-theme-chirpy.gemspec
+++ b/jekyll-theme-chirpy.gemspec
@@ -11,7 +11,7 @@ Gem::Specification.new do |spec|
   spec.license       = "MIT"
 
   spec.files         = `git ls-files -z`.split("\x0").select { |f|
-    f.match(%r!^((_(includes|layouts|sass|(data\/(locales|origin)))|assets)\/|sw|README|LICENSE)!i)
+    f.match(%r!^((_(includes|layouts|sass|(data\/(locales|origin)))|assets)\/|README|LICENSE)!i)
   }
 
   spec.metadata = {
diff --git a/package.json b/package.json
index eaa1c55..334a506 100644
--- a/package.json
+++ b/package.json
@@ -13,9 +13,9 @@
   },
   "homepage": "https://github.com/cotes2020/jekyll-theme-chirpy/",
   "scripts": {
-    "prebuild": "npx rimraf assets/js/dist sw.min.js*",
+    "prebuild": "npx rimraf assets/js/dist",
     "build": "NODE_ENV=production npx rollup -c --bundleConfigAsCjs",
-    "prewatch": "npx rimraf assets/js/dist sw.min.js*",
+    "prewatch": "npx rimraf assets/js/dist",
     "watch": "npx rollup -c --bundleConfigAsCjs -w",
     "test": "npx stylelint _sass/**/*.scss",
     "fixlint": "npm run test -- --fix"
diff --git a/rollup.config.js b/rollup.config.js
index 1aee2b8..7f2d14a 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -7,25 +7,17 @@ const SRC_DEFAULT = '_javascript';
 const DIST_DEFAULT = 'assets/js/dist';
 const isProd = process.env.NODE_ENV === 'production';
 
-function build(filename, opts) {
-  let src = SRC_DEFAULT;
-  let dist = DIST_DEFAULT;
-
-  if (typeof opts !== 'undefined') {
-    src = opts.src || src;
-    dist = opts.dist || dist;
-  }
-
+function build(filename) {
   return {
-    input: [`${src}/${filename}.js`],
+    input: [`${SRC_DEFAULT}/${filename}.js`],
     output: {
-      file: `${dist}/${filename}.min.js`,
+      file: `${DIST_DEFAULT}/${filename}.min.js`,
       format: 'iife',
       name: 'Chirpy',
       sourcemap: !isProd
     },
     watch: {
-      include: `${src}/**`
+      include: `${SRC_DEFAULT}/**`
     },
     plugins: [
       babel({
@@ -50,7 +42,5 @@ export default [
   build('categories'),
   build('page'),
   build('post'),
-  build('misc'),
-  build('app', { src: `${SRC_DEFAULT}/pwa` }),
-  build('sw', { src: `${SRC_DEFAULT}/pwa`, dist: '.' })
+  build('misc')
 ];
diff --git a/tools/init b/tools/init
index d8c7059..5baac5d 100755
--- a/tools/init
+++ b/tools/init
@@ -103,7 +103,7 @@ init_files() {
   npm i && npm run build
 
   # track the js output
-  _sedi "/^assets.*\/dist/d;/^sw.*\.js/d" .gitignore
+  _sedi "/^assets.*\/dist/d" .gitignore
 }
 
 commit() {
diff --git a/tools/release b/tools/release
index 771f697..bb54a0b 100755
--- a/tools/release
+++ b/tools/release
@@ -27,7 +27,6 @@ NODE_CONFIG="package.json"
 CHANGE_LOG="docs/CHANGELOG.md"
 
 JS_DIST="assets/js/dist"
-PWA_SW="sw.min.js"
 BACKUP_PATH="$(mktemp -d)"
 
 FILES=(
@@ -159,7 +158,7 @@ build_gem() {
   rm -f ./*.gem
 
   npm run build
-  git add "$JS_DIST" "$PWA_SW" -f # add JS distribution files to gem
+  git add "$JS_DIST" -f # add JS distribution files to gem
   gem build "$GEM_SPEC"
   cp "$JS_DIST"/* "$BACKUP_PATH"