fix: handle frozen page lifecycle state (#1658)

plugins/page-lifecycle.client.ts

@@ -0,0 +1,37 @@
+import lifecycle from 'page-lifecycle/dist/lifecycle.mjs'
+import { ELK_PAGE_LIFECYCLE_FROZEN } from '~/constants'
+import { closeDatabases } from '~/utils/elk-idb'
+
+export default defineNuxtPlugin(() => {
+  const state = ref(lifecycle.state)
+  const frozenListeners: (() => void)[] = []
+
+  lifecycle.addEventListener('statechange', (evt) => {
+    if (evt.newState === 'freeze')
+      frozenListeners.forEach(listener => listener())
+    else
+      state.value = evt.newState
+  })
+
+  const addFrozenListener = (listener: () => void) => {
+    frozenListeners.push(listener)
+  }
+
+  if (useAppConfig().pwaEnabled) {
+    addFrozenListener(() => {
+      if (navigator.serviceWorker.controller)
+        navigator.serviceWorker.controller.postMessage(ELK_PAGE_LIFECYCLE_FROZEN)
+
+      closeDatabases()
+    })
+  }
+
+  return {
+    provide: {
+      pageLifecycle: reactive({
+        state,
+        addFrozenListener,
+      }),
+    },
+  }
+})