feat: update uninstall URL with analytics ID (#20)

* bugfix: use correct casing/spacing on workspace amenities string (#14) * bugfix: correct string casing on workspace amenities Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * revert unnecessary changes Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * remove umused workflows Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * feat: add url to open onInstalled (#17) * bugfix: use correct casing/spacing on workspace amenities string (#14) (#15) * bugfix: correct string casing on workspace amenities * feat: add url to open onInstalled Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * feat: update manifest Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * feat: update uninstall URL with analytics ID (#19) * feat: update URL with aanalytics id on uninstall Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * feat: return if no env is found Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com> * feat: pull out analytics and rollbar into shared utils Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com>
Patrick-Erichsen · Oct 29, 2021 · 6f185cf · 6f185cf
1 parent aabeeef
commit 6f185cf
Show file tree

Hide file tree

Showing 15 changed files with 60 additions and 29 deletions.
diff --git a/.gitignore b/.gitignore
@@ -117,8 +117,11 @@ jspm_packages/
 # Test Coverage
 coverage/
 
+# Development Build Code
+dev-build
+
 # Production Build Code
-dist/
+prod-build
 
 # Typescript v1 declaration files
 typings/

diff --git a/assets/manifest.json b/assets/manifest.json
@@ -1,6 +1,6 @@
 {
   "name": "Offie - Airbnb Wifi Reviews",
-  "description": "View Airbnb Wifi and workspace info from the search results page",
+  "description": "View Airbnb Wifi and workspace info from the search results page.",
   "manifest_version": 3,
   "version": "0.0.3",
   "icons": {

diff --git a/src/background/index.ts b/src/background/index.ts
@@ -1,18 +1,35 @@
+import mixpanel from 'mixpanel-browser';
+import { rollbar, initAnalytics, logUrlChange } from '../utils';
 import { ChromeUrlUpdate } from '../types/Chrome';
 
+initAnalytics();
+
 chrome.tabs.onUpdated.addListener((tabId, { url }) => {
     if (url) {
+        logUrlChange(url);
+
         const newUrl: ChromeUrlUpdate = { event: 'URL_UPDATE', url };
 
         chrome.tabs.sendMessage(tabId, newUrl);
     }
 });
 
 chrome.runtime.onInstalled.addListener(() => {
-    chrome.runtime.setUninstallURL('https://offie.co/uninstall');
+    const environment = process.env.NODE_ENV;
+
+    if (!environment) {
+        rollbar.error(`Failed to find NODE_ENV env var!`);
+        return;
+    }
+
+    if (process.env.NODE_ENV === 'production') {
+        chrome.runtime.setUninstallURL(
+            `https://offie.co/uninstall?id=${mixpanel.get_distinct_id()}`
+        );
 
-    chrome.tabs.create({
-        url: 'https://offie.co/welcome',
-        active: true,
-    });
+        chrome.tabs.create({
+            url: 'https://offie.co/welcome',
+            active: true,
+        });
+    }
 });
diff --git a/src/content/App.tsx b/src/content/App.tsx
@@ -2,7 +2,6 @@ import { useState } from 'react';
 import { useUrlChangeChrome } from './hooks/useUrlChangeChrome';
 import { OffiePortals } from './components/OffiePortals';
 import { hasWifiOrWorkspaceFilter, isHomesSearchPage } from './utils';
-import * as analytics from './analytics';
 
 export const App = (): JSX.Element | null => {
     const [isVisible, setIsVisible] = useState<boolean>(false);
@@ -15,7 +14,6 @@ export const App = (): JSX.Element | null => {
             const newIsVisible = hasWifiOrWorkspaceFilter(newUrl);
 
             setIsVisible(newIsVisible);
-            analytics.logUrlChange(newUrl);
         }
     });
 

diff --git a/src/content/api.ts b/src/content/api.ts
@@ -1,6 +1,6 @@
 /* eslint-disable import/prefer-default-export */
 import axios from 'axios';
-import { rollbar } from './utils';
+import { rollbar } from '../utils';
 import type { ListingsDetailsRes, OffieApiRes } from '../types/Offie';
 
 export const getListingsDetails = async (

diff --git a/src/content/components/OffieButton.tsx b/src/content/components/OffieButton.tsx
@@ -3,7 +3,7 @@ import { Button, ButtonProps } from '@mui/material';
 import { Wifi as WifiIcon } from '@mui/icons-material';
 import { ListingDetails, ReviewWithSentiment } from '../../types/Offie';
 import { sortReviewsByDateDesc, sentimentKeys } from '../utils';
-import * as analytics from '../analytics';
+import * as analytics from '../../utils/analytics';
 import { InfoPopover } from './InfoPopover';
 
 export interface OffieButtonProps extends ButtonProps {

diff --git a/src/content/hooks/useUrlChangeChrome.ts b/src/content/hooks/useUrlChangeChrome.ts
@@ -1,7 +1,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import { useEffect } from 'react';
 import { ChromeUrlUpdate } from '../../types/Chrome';
-import * as analytics from '../analytics';
+import * as analytics from '../../utils/analytics';
 
 /**
  * Invoke the `onUrlChange` param when Chrome detects that
@@ -19,15 +19,13 @@ export const useUrlChangeChrome = (
         const onUrlChangeWrapper = (request: ChromeUrlUpdate) => {
             if (request.event === 'URL_UPDATE') {
                 onUrlChange(request.url);
-                analytics.logUrlChange(request.url);
             }
         };
 
         chrome.runtime.onMessage.addListener(onUrlChangeWrapper);
 
         if (runOnInit) {
             onUrlChange(window.location.href);
-            analytics.logUrlChange(window.location.href);
         }
 
         return () => {

diff --git a/src/content/index.tsx b/src/content/index.tsx
@@ -1,19 +1,13 @@
 import '@fontsource/montserrat';
 import '@fontsource/montserrat/600.css';
-import mixpanel from 'mixpanel-browser';
 import { StrictMode } from 'react';
 import ReactDOM from 'react-dom';
 import { ThemeProvider } from '@mui/material';
-import { theme, rollbar } from './utils';
+import { theme } from './utils';
 import { App } from './App';
+import { initAnalytics } from '../utils';
 
-const mixpanelToken = process.env.MIXPANEL_PROJECT_TOKEN;
-
-if (mixpanelToken) {
-    mixpanel.init(mixpanelToken);
-} else {
-    rollbar.error('Failed to find `MIXPANEL_PROJECT_TOKEN` env var!');
-}
+initAnalytics();
 
 const rootOffieNode = document.createElement('div');
 rootOffieNode.id = 'offie-node-root';

diff --git a/src/content/utils/airbnb.ts b/src/content/utils/airbnb.ts
@@ -1,5 +1,5 @@
 import * as qs from 'qs';
-import { rollbar } from './rollbar';
+import { rollbar } from '../../utils/rollbar';
 import { getParsedUrlSearch } from './misc';
 
 export interface AirbnbFilterKeyMap {

diff --git a/src/content/utils/dom.ts b/src/content/utils/dom.ts
@@ -1,4 +1,4 @@
-import { rollbar } from './rollbar';
+import { rollbar } from '../../utils/rollbar';
 
 export const OFFIE_NODE_ID_PREFIX = 'offie-node';
 export const LISTINGS_FOOTER_SECTION_ID = 'EXPLORE_NUMBERED_PAGINATION';

diff --git a/src/content/utils/index.ts b/src/content/utils/index.ts
@@ -2,4 +2,3 @@ export * from './misc';
 export * from './dom';
 export * from './theme';
 export * from './airbnb';
-export * from './rollbar';
diff --git a/src/content/analytics.ts → src/utils/analytics.ts b/src/content/analytics.ts → src/utils/analytics.ts
@@ -1,14 +1,28 @@
 import * as mixpanel from 'mixpanel-browser';
 import { WifiSentiment } from '../types/Offie';
-import { getSearchLocation, getMappedSearchFilters } from './utils/airbnb';
-import { getParsedUrlSearch } from './utils/misc';
+import {
+    getSearchLocation,
+    getMappedSearchFilters,
+} from '../content/utils/airbnb';
+import { getParsedUrlSearch } from '../content/utils/misc';
+import { rollbar } from './rollbar';
 
 export const eventNames = {
     AIRBNB_SEARCH_URL: 'airbnbSearchUrl',
     BUTTON_CLICK: 'offieButtonClick',
     MODAL_OPEN: 'offieModalOpen',
 };
 
+export const initAnalytics = (): void => {
+    const mixpanelToken = process.env.MIXPANEL_PROJECT_TOKEN;
+
+    if (mixpanelToken) {
+        mixpanel.init(mixpanelToken);
+    } else {
+        rollbar.error('Failed to find `MIXPANEL_PROJECT_TOKEN` env var!');
+    }
+};
+
 export const logUrlChange = (urlStr: string): void => {
     const search = getParsedUrlSearch(urlStr);
 

diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -0,0 +1,2 @@
+export * from './rollbar';
+export * from './analytics';
diff --git a/src/content/utils/rollbar.ts → src/utils/rollbar.ts b/src/content/utils/rollbar.ts → src/utils/rollbar.ts
diff --git a/webpack.config.js b/webpack.config.js
@@ -7,7 +7,13 @@ module.exports = (env) => ({
         content: path.join(__dirname, './src/content/index.tsx'),
         background: path.join(__dirname, './src/background/index.ts'),
     },
-    output: { path: path.join(__dirname, 'dist'), filename: '[name].js' },
+    output: {
+        path: path.join(
+            __dirname,
+            `${env.production ? 'prod-build' : 'dev-build'}`
+        ),
+        filename: '[name].js',
+    },
     devtool: 'cheap-module-source-map',
     module: {
         rules: [
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		export * from './rollbar';
		export * from './analytics';