[PWA] Add export usage data logic.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-map-db",
-  "version": "2.1.51",
+  "version": "2.1.52",
   "private": true,
   "homepage": "https://mindapps.org",
   "enableLogRocket": true,

src/components/layout/ApplicationBar.tsx

@@ -14,7 +14,7 @@ import { columns } from '../application/GenericDialog/SignUpSurvey';
 import DialogButton, { renderDialogModule } from '../application/GenericDialog/DialogButton';
 import { useSelector } from 'react-redux';
 import { useDialogState } from '../application/GenericDialog/useDialogState';
-import { useSignedIn, useFullScreen, useIsAdmin, useIsTestUser, useSignedInRater } from '../../hooks';
+import { useSignedIn, useFullScreen, useIsAdmin, useIsTestUser, useSignedInRater, trackingColumns } from '../../hooks';
 import TabSelectorToolBar from '../general/TabSelector/TabSelectorToolBar';
 import * as Icons from '@mui/icons-material';
 import { useLayout, useLeftDrawer, useSetUser } from './store';
@@ -25,6 +25,7 @@ import { useLocation } from 'react-router';
 import { useAppBarHeightSetRef } from './hooks';
 import { useGetSignUpSurveys } from '../../database/useGetSignUpSurveys';
 import { exportTableCsv } from '../../database/store';
+import { useGetPwaUsage } from '../../database/useGetPwaUsage';
 
 const useStyles = makeStyles(({ breakpoints, palette, layout }: any) =>
   createStyles({
@@ -101,13 +102,20 @@ export default function ApplicationBar({ trigger }) {
   const open = Boolean(anchorEl);
 
   const { getSignUpSurveys } = useGetSignUpSurveys();
+  const { getPwaUsage } = useGetPwaUsage();
 
   const handleExportSignUpSurveys = React.useCallback(async () => {
     var data = await getSignUpSurveys();
     console.log('Exporting sign up surveys...', { data, columns });
     exportTableCsv(data, columns);
   }, [getSignUpSurveys]);
 
+  const handleExportPwaUsage = React.useCallback(async () => {
+    var data = await getPwaUsage();
+    console.log('Exporting pwa usage...', { data, trackingColumns });
+    exportTableCsv(data, trackingColumns);
+  }, [getPwaUsage]);
+
   const setUser = useSetUser();
 
   const handleLogout = React.useCallback(() => {
@@ -265,6 +273,9 @@ export default function ApplicationBar({ trigger }) {
                               <MenuItem key='export-sign-up-surveys' onClick={handleExportSignUpSurveys}>
                                 Export Sign Up Surveys
                               </MenuItem>,
+                              <MenuItem key='export-sign-up-surveys' onClick={handleExportPwaUsage}>
+                                Export PWA Usage
+                              </MenuItem>,
                               <MenuItem key='logout' onClick={handleLogout}>
                                 Logout
                               </MenuItem>

src/database/useGetPwaUsage.tsx

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { dynamo, tables } from './dbConfig';
+import { useSignedIn } from '../hooks';
+
+export const useGetPwaUsage = () => {
+  const signedIn = useSignedIn();
+
+  // Load data from the database
+  const getPwaUsage = React.useCallback(async () => {
+    let scanResults = [];
+    if (signedIn) {
+      let items;
+      var params = {
+        TableName: tables.tracking,
+        ExclusiveStartKey: undefined
+      };
+      do {
+        items = await dynamo.scan(params).promise();
+        items.Items.forEach(i => scanResults.push(i));
+        console.log({ items, scanResults });
+        params.ExclusiveStartKey = items.LastEvaluatedKey;
+      } while (typeof items.LastEvaluatedKey != 'undefined');
+    }
+    return scanResults;
+  }, [signedIn]);
+
+  return { getPwaUsage };
+};

src/hooks.tsx

@@ -98,6 +98,26 @@ export const isBingBot = () => {
   return isGoogleBot;
 };
 
+export const trackingColumns = [
+  '_id',
+  'firstAccessDate',
+  'firstAccessTimestamp',
+  'lastActiveDate',
+  'lastActiveTimestamp',
+  'environment',
+  'pathname',
+  'host',
+  'userAgent',
+  'firstAccessDatePwa',
+  'firstAccessTimestampPwa',
+  'lastActiveDatePwa',
+  'lastActiveTimestampPwa',
+  'environmentPwa',
+  'pathnamePwa',
+  'hostPwa',
+  'userAgentPwa'
+].map(name => ({ name }));
+
 export const useTracking = ({ isPwa = false }) => {
   const [trackingId, setTrackingId] = useTrackingId();
 
@@ -114,7 +134,7 @@ export const useTracking = ({ isPwa = false }) => {
   }, [trackingId, setTrackingId]);
 
   React.useEffect(() => {
-    if (/*!isDev() && */ isClient && !isGoogleBot() && !isBingBot()) {
+    if (!isDev() && isClient && !isGoogleBot() && !isBingBot()) {
       if (!isEmpty(trackingId)) {
         // Store tracking info
         console.log('Reading metadata...');
@@ -126,6 +146,7 @@ export const useTracking = ({ isPwa = false }) => {
             console.log('Received metadata', response);
             const prev = response?.Item ?? {};
             var newData = {
+              _id: trackingId,
               ...prev // merge any existing data prior to udpating
             };