Add PWA detection analytics event

[annarhughes]

Overview

This task is related to PWA epic #1197 . This task involves adding analytics events to be triggered on each app load, sending either WEB_APP_LOADED or PWA_LOADED depending on whether the user is using a PWA or normal web app.

Action Items

• Add logic to determine if the user is using a PWA or web app - see resources below
• Send analytics events on app load, WEB_APP_LOADED or PWA_LOADED using our existing logEvent() function - see more about our events in Add PWA analytics events #1208. Include the eventUserData params and an additional browser param with the event, i.e. logEvent(PWA_LOADED, eventUserData)

Resources/Instructions

To test that analytics events are being triggered, check the console log where events should be shown.

Note these resources are guides to general pwa/browser detection, but there may be a better solution for next.js or next-pwa
https://web.dev/learn/pwa/detection
https://stackoverflow.com/questions/41742390/javascript-to-check-if-pwa-or-mobile-web

const isInStandaloneMode = () =>
      (window.matchMedia('(display-mode: standalone)').matches) || (window.navigator.standalone) || document.referrer.includes('android-app://');

 if (isInStandaloneMode()) {
    console.log("webapp is installed")
}

[Bibhavshah]

Hi, I would like to work on the issue. And if possible can you give more explanation into the issue. So, that I understand it better?

[kyleecodes]

Hi @Bibhavshah thank you for your interest! Do you have a specific question?

[niksanand1717]

@kyleecodes can you assign me this task? I have already made some progress on this and have read the docs provided in the description above.