@cuemath/web-utils 0.0.1 → 0.0.2-beta.0

package/dist/index.js

@@ -15,4 +15,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./cookie"), exports);
+__exportStar(require("./growth-source"), exports);
 //# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuemath/web-utils",
-  "version": "0.0.1",
+  "version": "0.0.2-beta.0",
   "description": "Shareable utils package",
   "main": "dist/index.js",
   "scripts": {
@@ -24,16 +24,19 @@
     "@cuemath/eslint-config": "1.0.9",
     "@cuemath/prettier-config": "1.0.3",
     "@cuemath/ts-config": "0.0.5",
+    "@react-native-community/eslint-config": "3.2.0",
     "@types/uuid": "9.0.0",
     "@typescript-eslint/eslint-plugin": "5.47.0",
     "@typescript-eslint/parser": "5.47.0",
-    "eslint": "7.32.0",
+    "eslint": "8.1.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-import": "2.26.0",
+    "eslint-plugin-jest": "^27.2.1",
     "eslint-plugin-prettier": "4.2.1",
     "husky": "8.0.2",
-    "prettier": "2.8.1",
+    "prettier": "2.4.1",
     "typescript": "4.9.4"
   },
-  "dependencies": {}
+  "dependencies": {},
+  "side-effects": false
 }

package/src/cookie/index.ts

@@ -1,4 +1,4 @@
-export const getCookie = (name: string, cookie: string): string => {
+export const getCookie = (name: string, cookie: string = document.cookie): string => {
   if (!cookie) {
     return '';
   }
@@ -17,3 +17,41 @@ export const getCookie = (name: string, cookie: string): string => {
 
   return '';
 };
+
+export function removeCookie(name: string): void {
+  const date = new Date();
+
+  // Set it expire in -1 days
+  date.setTime(date.getTime() + -1 * 24 * 60 * 60 * 1000);
+
+  // Set it
+  document.cookie = `${name}=; expires=${date.toUTCString()}; path=/`;
+}
+
+export function createCookie(
+  name: string,
+  value: string,
+  days: number,
+  subdomain: boolean,
+): void {
+  let expires = '';
+
+  if (days) {
+    const date = new Date();
+
+    date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
+    expires = `; expires=${date.toUTCString()}`;
+  }
+  document.cookie = `${name}=${encodeURIComponent(value)}${expires}; path=/${
+    subdomain ? '; .cuemath.com' : ''
+  }`;
+}
+
+export function createCookieWithMidnightExp(name: string, value: string): void {
+  const date = new Date();
+
+  date.setHours(24, 0, 0, 0);
+  const expires = `; expires=${date}`;
+
+  document.cookie = `${name}=${value}${expires}; path=/`;
+}

package/src/growth-source/index.ts

@@ -0,0 +1,172 @@
+import type {
+  SourceDetails,
+  Platform,
+  SignupFlow,
+  UTMParams,
+  Experiments,
+  RevenueChannel,
+  UTMParamsKeys,
+} from './types';
+
+import { createCookie, getCookie } from '../cookie';
+
+const SOURCE_DETAILS_COOKIE = 'source_details_v1';
+const UTM_PARAMS: UTMParamsKeys[] = [
+  'utm_source',
+  'utm_medium',
+  'utm_campaign',
+  'utm_term',
+];
+
+const readSourceCookie = () => {
+  const sourceDetails = getCookie(SOURCE_DETAILS_COOKIE);
+
+  return sourceDetails && JSON.parse(sourceDetails);
+};
+
+const writeSourceCookie = (sourceDetails: SourceDetails) => {
+  createCookie(SOURCE_DETAILS_COOKIE, JSON.stringify(sourceDetails), 365, true);
+};
+
+const updateSourceCookie = (sourceDetail: Partial<SourceDetails>) => {
+  const sourceDetails: SourceDetails = readSourceCookie();
+  const updatedDetails: SourceDetails = {
+    ...sourceDetails,
+    ...sourceDetail,
+  };
+
+  writeSourceCookie(updatedDetails);
+};
+
+const getRevenueChannel = (platform: Platform, utmParams?: UTMParams) => {
+  let revenueChannel: RevenueChannel = 'UNKNOWN';
+
+  if (platform === 'ASTRO' && utmParams) {
+    const { utm_source: utmSource = '' } = utmParams;
+
+    switch (true) {
+      case /^affiliate-/.test(utmSource):
+        revenueChannel = 'AFFILIATE';
+        break;
+      case /^offline-/.test(utmSource):
+        revenueChannel = 'OFFLINE';
+        break;
+      case /^referral-/.test(utmSource):
+        revenueChannel = 'REFERRAL';
+        break;
+      case /^performance-/.test(utmSource):
+      default:
+        revenueChannel = 'PERFORMANCE';
+    }
+  }
+
+  if (platform === 'WEBSITE') {
+    revenueChannel = 'ORGANIC';
+  }
+
+  return revenueChannel;
+};
+
+/*
+  if Platform = website, then decide based on experiment key
+  if Platform = Astro, decide logic once BAU is started
+  if Platform = APP, decide logic
+  if Platform = chatbot, decide based on chatbot experiment key
+*/
+const getFlow = (platform: Platform, experiments?: Experiments) => {
+  let flow: SignupFlow = 'REGULAR';
+
+  if (platform === 'WEBSITE') {
+    if (experiments) {
+      const ecnaExp = Object.keys(experiments).find(
+        experiment => experiment.indexOf('ecna') !== -1,
+      );
+
+      flow = ecnaExp && experiments[ecnaExp] === 'b' ? 'ECNA' : 'REGULAR';
+    }
+  }
+
+  return flow;
+};
+
+const getUTMParams = () => {
+  if (typeof window === undefined) return;
+
+  const search = new URLSearchParams(window.location.search);
+  const utmParams = UTM_PARAMS.reduce((acc: UTMParams, param) => {
+    const utmParam = search.get(param) as string;
+
+    if (utmParam) {
+      acc[param] = utmParam;
+    }
+
+    return acc;
+  }, {});
+
+  return utmParams;
+};
+
+const getFirstPage = () => {
+  if (typeof window === undefined) return '';
+
+  return window.location.pathname;
+};
+
+/* TODO: Align Marketing Team on UTM source convention
+  affiliate-<channel>
+  performance-<channel>
+  organic-<channel>
+  offline-<channel>
+*/
+const getChannel = (utmParams: UTMParams | undefined) => {
+  // TODO: UTM source patter for FB, GOOGLE...
+  if (!utmParams) return '';
+
+  const { utm_source: utmSource = '' } = utmParams;
+
+  return utmSource.split('-')[1];
+};
+
+/* 
+  Set Static Source Details of user on Visit of Platform
+*/
+export const initSourceDetails = async ({
+  platform,
+  experiments,
+  utmParams,
+  flow,
+  affiliateChannel,
+  offlineChannel,
+  organicChannel,
+  performanceChannel,
+  revenueChannel,
+}: SourceDetails) => {
+  if (!readSourceCookie()) {
+    const leadChannel = getChannel(utmParams);
+
+    const sourceDetails: SourceDetails = {
+      platform,
+      experiments,
+      utmParams: getUTMParams(),
+      flow: flow || getFlow(platform, experiments),
+      affiliateChannel: affiliateChannel || leadChannel,
+      offlineChannel: offlineChannel || leadChannel,
+      organicChannel: organicChannel || leadChannel,
+      performanceChannel: performanceChannel || leadChannel,
+      revenueChannel: revenueChannel || getRevenueChannel(platform, utmParams),
+      firstPage: getFirstPage(),
+    };
+
+    writeSourceCookie(sourceDetails);
+  }
+};
+
+// Last Page which user visited signup before
+export const setLastPage = async (pagePath: string) => {
+  updateSourceCookie({ lastPage: pagePath });
+};
+
+// set Entry point where user clicked to Signup
+export const setFlowEntryPoint = async (flowEntry: string) => {
+  updateSourceCookie({ flowEntry });
+};

package/src/growth-source/types.ts

@@ -0,0 +1,33 @@
+export type Platform = 'WEBSITE' | 'APP' | 'ASTRO' | 'LEAP_TEACHER' | 'LEAP_ADMIN';
+export type RevenueChannel =
+  | 'ORGANIC'
+  | 'PERFORMANCE'
+  | 'AFFILIATE'
+  | 'OFFLINE'
+  | 'REFERRAL'
+  | 'UNKNOWN';
+export type SignupFlow = 'REGULAR' | 'ECNA' | 'ESALES';
+export type Experiments = Record<string, unknown>;
+export type UTMParams = {
+  utm_source?: string;
+  utm_medium?: string;
+  utm_campaign?: string;
+  utm_term?: string;
+};
+
+export type UTMParamsKeys = keyof UTMParams;
+
+export type SourceDetails = {
+  platform: Platform;
+  experiments?: Experiments;
+  flow?: SignupFlow;
+  utmParams?: UTMParams;
+  affiliateChannel?: string;
+  offlineChannel?: string;
+  performanceChannel: string;
+  revenueChannel: RevenueChannel;
+  organicChannel?: string;
+  flowEntry?: string;
+  firstPage?: string;
+  lastPage?: string;
+};

package/src/index.ts

@@ -1 +1,2 @@
 export * from './cookie';
+export * from './growth-source';