Remove service worker logger (#2265)

* Remove service worker logger

* Use async/await for togglePushSubscription

* Remove commented out logger calls in service worker

* Remove message channel between service worker and app

The listener for messages from the service worker was removed in a previous commit.

* Remove unused OS detection for service worker

Author: ekzyis

api/slack/index.js

@@ -86,7 +86,7 @@ export default gql`
 
   input SettingsInput {
     autoDropBolt11s: Boolean!
-    diagnostics: Boolean!
+    diagnostics: Boolean @deprecated
     noReferralLinks: Boolean!
     fiatCurrency: String!
     satsFilter: Int!
@@ -162,7 +162,7 @@ export default gql`
     mirrors SettingsInput
     """
     autoDropBolt11s: Boolean!
-    diagnostics: Boolean!
+    diagnostics: Boolean @deprecated
     noReferralLinks: Boolean!
     fiatCurrency: String!
     satsFilter: Int!

api/typeDefs/user.js

@@ -3,7 +3,6 @@ import { StaticLayout } from './layout'
 import styles from '@/styles/error.module.css'
 import Image from 'react-bootstrap/Image'
 import copy from 'clipboard-copy'
-import { LoggerContext } from './logger'
 import Button from 'react-bootstrap/Button'
 import { useToast } from './toast'
 import { decodeMinifiedStackTrace } from '@/lib/stacktrace'
@@ -36,8 +35,6 @@ class ErrorBoundary extends Component {
     // You can use your own error logging service here
     console.log({ error, errorInfo })
     this.setState({ errorInfo })
-    const logger = this.context
-    logger?.error(this.getErrorDetails())
   }
 
   render () {
@@ -59,8 +56,6 @@ class ErrorBoundary extends Component {
   }
 }
 
-ErrorBoundary.contextType = LoggerContext
-
 export default ErrorBoundary
 
 // This button is a functional component so we can use `useToast` hook, which

components/error-boundary.js

@@ -1,20 +1,17 @@
 import { createContext, useContext, useEffect, useState, useCallback, useMemo } from 'react'
 import { Workbox } from 'workbox-window'
 import { gql, useMutation } from '@apollo/client'
-import { detectOS, useServiceWorkerLogger } from './logger'
 
 const applicationServerKey = process.env.NEXT_PUBLIC_VAPID_PUBKEY
 
 const ServiceWorkerContext = createContext()
 
 // message types for communication between app and service worker
-export const MESSAGE_PORT = 'MESSAGE_PORT' // message to exchange message channel on which service worker will send messages back to app
 export const ACTION_PORT = 'ACTION_PORT' // message to exchange action channel on which service worker will send actions back to app
 export const SYNC_SUBSCRIPTION = 'SYNC_SUBSCRIPTION' // trigger onPushSubscriptionChange event in service worker manually
 export const RESUBSCRIBE = 'RESUBSCRIBE' // trigger resubscribing to push notifications (sw -> app)
 export const DELETE_SUBSCRIPTION = 'DELETE_SUBSCRIPTION' // delete subscription in IndexedDB (app -> sw)
 export const STORE_SUBSCRIPTION = 'STORE_SUBSCRIPTION' // store subscription in IndexedDB (app -> sw)
-export const STORE_OS = 'STORE_OS' // store OS in service worker
 
 export const ServiceWorkerProvider = ({ children }) => {
   const [registration, setRegistration] = useState(null)
@@ -44,7 +41,6 @@ export const ServiceWorkerProvider = ({ children }) => {
           }
         }
       `)
-  const logger = useServiceWorkerLogger()
 
   // I am not entirely sure if this is needed since at least in Brave,
   // using `registration.pushManager.subscribe` also prompts the user.
@@ -77,7 +73,6 @@ export const ServiceWorkerProvider = ({ children }) => {
     // see https://stackoverflow.com/a/69624651
     let pushSubscription = await registration.pushManager.subscribe(subscribeOptions)
     const { endpoint } = pushSubscription
-    logger.info('subscribed to push notifications', { endpoint })
     // convert keys from ArrayBuffer to string
     pushSubscription = JSON.parse(JSON.stringify(pushSubscription))
     // Send subscription to service worker to save it so we can use it later during `pushsubscriptionchange`
@@ -86,42 +81,35 @@ export const ServiceWorkerProvider = ({ children }) => {
       action: STORE_SUBSCRIPTION,
       subscription: pushSubscription
     })
-    logger.info('sent STORE_SUBSCRIPTION to service worker', { endpoint })
     // send subscription to server
     const variables = {
       endpoint,
       p256dh: pushSubscription.keys.p256dh,
       auth: pushSubscription.keys.auth
     }
     await savePushSubscription({ variables })
-    logger.info('sent push subscription to server', { endpoint })
   }
 
   const unsubscribeFromPushNotifications = async (subscription) => {
     await subscription.unsubscribe()
     const { endpoint } = subscription
-    logger.info('unsubscribed from push notifications', { endpoint })
     await deletePushSubscription({ variables: { endpoint } })
     // also delete push subscription in IndexedDB so we can tell if the user disabled push subscriptions
     // or we lost the push subscription due to a bug
     navigator.serviceWorker.controller.postMessage({ action: DELETE_SUBSCRIPTION })
-    logger.info('deleted push subscription from server', { endpoint })
   }
 
   const togglePushSubscription = useCallback(async () => {
     const pushSubscription = await registration.pushManager.getSubscription()
     if (pushSubscription) {
-      return unsubscribeFromPushNotifications(pushSubscription)
+      return await unsubscribeFromPushNotifications(pushSubscription)
+    }
+    await subscribeToPushNotifications()
+    // request persistent storage: https://web.dev/learn/pwa/offline-data#data_persistence
+    const persisted = await navigator?.storage?.persisted?.()
+    if (!persisted && navigator?.storage?.persist) {
+      return await navigator.storage.persist()
     }
-    return subscribeToPushNotifications().then(async () => {
-      // request persistent storage: https://web.dev/learn/pwa/offline-data#data_persistence
-      const persisted = await navigator?.storage?.persisted?.()
-      if (!persisted && navigator?.storage?.persist) {
-        return navigator.storage.persist().then(persistent => {
-          logger.info('persistent storage:', persistent)
-        }).catch(logger.error)
-      }
-    })
   })
 
   useEffect(() => {
@@ -133,13 +121,11 @@ export const ServiceWorkerProvider = ({ children }) => {
     setPermission({ notification: 'Notification' in window ? window.Notification.permission : 'denied' })
 
     if (!('serviceWorker' in navigator)) {
-      logger.info('device does not support service worker')
       return
     }
 
     const wb = new Workbox('/sw.js', { scope: '/' })
     wb.register().then(registration => {
-      logger.info('service worker registration successful')
       setRegistration(registration)
     })
   }, [])
@@ -158,10 +144,7 @@ export const ServiceWorkerProvider = ({ children }) => {
     // since (a lot of) browsers don't support the pushsubscriptionchange event,
     // we sync with server manually by checking on every page reload if the push subscription changed.
     // see https://medium.com/@madridserginho/how-to-handle-webpush-api-pushsubscriptionchange-event-in-modern-browsers-6e47840d756f
-    navigator?.serviceWorker?.controller?.postMessage?.({ action: STORE_OS, os: detectOS() })
-    logger.info('sent STORE_OS to service worker: ', detectOS())
     navigator?.serviceWorker?.controller?.postMessage?.({ action: SYNC_SUBSCRIPTION })
-    logger.info('sent SYNC_SUBSCRIPTION to service worker')
   }, [registration, permission.notification])
 
   const contextValue = useMemo(() => ({

components/logger.js

@@ -23,7 +23,6 @@ ${STREAK_FIELDS}
     photoId
     privates {
       autoDropBolt11s
-      diagnostics
       noReferralLinks
       fiatCurrency
       autoWithdrawMaxFeePercent
@@ -97,7 +96,6 @@ export const SETTINGS_FIELDS = gql`
       imgproxyOnly
       showImagesAndVideos
       hideWalletBalance
-      diagnostics
       noReferralLinks
       nostrPubkey
       nostrCrossposting

components/serviceworker.js

@@ -472,7 +472,6 @@ export const settingsSchema = object().shape({
   hideNostr: boolean(),
   hideTwitter: boolean(),
   hideWalletBalance: boolean(),
-  diagnostics: boolean(),
   noReferralLinks: boolean(),
   hideIsContributor: boolean(),
   disableFreebies: boolean().nullable(),

fragments/users.js

@@ -16,7 +16,6 @@ import { ServiceWorkerProvider } from '@/components/serviceworker'
 import { SSR } from '@/lib/constants'
 import NProgress from 'nprogress'
 import 'nprogress/nprogress.css'
-import { LoggerProvider } from '@/components/logger'
 import { ChainFeeProvider } from '@/components/chain-fee.js'
 import dynamic from 'next/dynamic'
 import { HasNewNotesProvider } from '@/components/use-has-new-notes'
@@ -114,28 +113,26 @@ export default function MyApp ({ Component, pageProps: { ...props } }) {
             <MeProvider me={me}>
               <WalletsProvider>
                 <HasNewNotesProvider>
-                  <LoggerProvider>
-                    <WebLnProvider>
-                      <ServiceWorkerProvider>
-                        <PriceProvider price={price}>
-                          <FireworksProvider>
-                            <ToastProvider>
-                              <ShowModalProvider>
-                                <BlockHeightProvider blockHeight={blockHeight}>
-                                  <ChainFeeProvider chainFee={chainFee}>
-                                    <ErrorBoundary>
-                                      <Component ssrData={ssrData} {...otherProps} />
-                                      {!router?.query?.disablePrompt && <PWAPrompt copyBody='This website has app functionality. Add it to your home screen to use it in fullscreen and receive notifications. In Safari:' promptOnVisit={2} />}
-                                    </ErrorBoundary>
-                                  </ChainFeeProvider>
-                                </BlockHeightProvider>
-                              </ShowModalProvider>
-                            </ToastProvider>
-                          </FireworksProvider>
-                        </PriceProvider>
-                      </ServiceWorkerProvider>
-                    </WebLnProvider>
-                  </LoggerProvider>
+                  <WebLnProvider>
+                    <ServiceWorkerProvider>
+                      <PriceProvider price={price}>
+                        <FireworksProvider>
+                          <ToastProvider>
+                            <ShowModalProvider>
+                              <BlockHeightProvider blockHeight={blockHeight}>
+                                <ChainFeeProvider chainFee={chainFee}>
+                                  <ErrorBoundary>
+                                    <Component ssrData={ssrData} {...otherProps} />
+                                    {!router?.query?.disablePrompt && <PWAPrompt copyBody='This website has app functionality. Add it to your home screen to use it in fullscreen and receive notifications. In Safari:' promptOnVisit={2} />}
+                                  </ErrorBoundary>
+                                </ChainFeeProvider>
+                              </BlockHeightProvider>
+                            </ShowModalProvider>
+                          </ToastProvider>
+                        </FireworksProvider>
+                      </PriceProvider>
+                    </ServiceWorkerProvider>
+                  </WebLnProvider>
                 </HasNewNotesProvider>
               </WalletsProvider>
             </MeProvider>