@cuemath/web-utils 1.0.8 → 1.0.9-deepak.0

package/src/constants/date-time/international-timezones.ts

@@ -0,0 +1,157 @@
+interface Timezone {
+  id: string;
+  value: string;
+  meta: string;
+}
+
+export const timezones: Timezone[] = [
+  {
+    id: 'Pacific/Honolulu',
+    value: 'HST(GMT-10)',
+    meta: 'HST(GMT-10)',
+  },
+  {
+    id: 'America/Anchorage',
+    value: 'AST(GMT-9)',
+    meta: 'AST(GMT-9)',
+  },
+  {
+    id: 'America/Los_Angeles',
+    value: 'PST(GMT-8)',
+    meta: 'PST(GMT-8)',
+  },
+  {
+    id: 'America/Denver',
+    value: 'MST(GMT-7)',
+    meta: 'MST(GMT-7)',
+  },
+  {
+    id: 'America/Phoenix',
+    value: 'MST(GMT-7)',
+    meta: 'MST(GMT-7)',
+  },
+  {
+    id: 'America/Matamoros',
+    value: 'CST(GMT-6)',
+    meta: 'CST(GMT-6)',
+  },
+  {
+    id: 'America/New_York',
+    value: 'EST(GMT-5)',
+    meta: 'EST(GMT-5)',
+  },
+  {
+    id: 'America/Glace_Bay',
+    value: 'AST(GMT-4)',
+    meta: 'AST(GMT-4)',
+  },
+  {
+    id: 'America/St_Johns',
+    value: 'NST(GMT-3:30)',
+    meta: 'NST(GMT-3:30)',
+  },
+  {
+    id: 'America/Noronha',
+    value: 'FNT(GMT-2)',
+    meta: 'FNT(GMT-2)',
+  },
+  {
+    id: 'Asia/Calcutta',
+    value: 'IST(GMT+5:30)',
+    meta: 'IST(GMT+5:30)',
+  },
+  {
+    id: 'Asia/Kolkata',
+    value: 'IST(GMT+5:30)',
+    meta: 'IST(GMT+5:30)',
+  },
+  {
+    id: 'Asia/Dubai',
+    value: 'GST(GMT+4)',
+    meta: 'GST(GMT+4)',
+  },
+  {
+    id: 'Asia/Singapore',
+    value: 'SGT(GMT+8)',
+    meta: 'SGT(GMT+8)',
+  },
+  {
+    id: 'Pacific/Auckland',
+    value: 'NZDT(GMT+13)',
+    meta: 'NZDT(GMT+13)',
+  },
+  {
+    id: 'Australia/Adelaide',
+    value: 'ACDT(GMT+10:30)',
+    meta: 'ACDT(GMT+10:30)',
+  },
+  {
+    id: 'Australia/Perth',
+    value: 'AWST(GMT+8)',
+    meta: 'AWST(GMT+8)',
+  },
+  {
+    id: 'Australia/Sydney',
+    value: 'AEDT(GMT+11)',
+    meta: 'AEDT(GMT+11)',
+  },
+  {
+    id: 'Australia/Darwin',
+    value: 'ACST(GMT+9:30)',
+    meta: 'ACST(GMT+9:30)',
+  },
+  {
+    id: 'Australia/Broken_Hill',
+    value: 'ACDT(GMT+10:30)',
+    meta: 'ACDT(GMT+10:30)',
+  },
+  {
+    id: 'Australia/Melbourne',
+    value: 'AEDT(GMT+11)',
+    meta: 'AEDT(GMT+11)',
+  },
+  {
+    id: 'Australia/Brisbane',
+    value: 'AEST(GMT+10)',
+    meta: 'AEST(GMT+10)',
+  },
+  {
+    id: 'Australia/Hobart',
+    value: 'AEDT(GMT+11)',
+    meta: 'AEDT(GMT+11)',
+  },
+  {
+    id: 'Europe/London',
+    value: 'GMT(GMT+0)',
+    meta: 'GMT(GMT+0)',
+  },
+  {
+    id: 'Asia/Muscat',
+    value: 'GST(GMT+4)',
+    meta: 'GST(GMT+4)',
+  },
+  {
+    id: 'Asia/Kuwait',
+    value: 'AST(GMT+3)',
+    meta: 'AST(GMT+3)',
+  },
+  {
+    id: 'Asia/Bahrain',
+    value: 'AST(GMT+3)',
+    meta: 'AST(GMT+3)',
+  },
+  {
+    id: 'Asia/Qatar',
+    value: 'AST(GMT+3)',
+    meta: 'AST(GMT+3)',
+  },
+  {
+    id: 'Asia/Riyadh',
+    value: 'AST(GMT+3)',
+    meta: 'AST(GMT+3)',
+  },
+].map(timezone => ({
+  ...timezone,
+  key: timezone.id,
+  label: timezone.meta,
+}));

package/src/cookie/index.ts

@@ -0,0 +1,59 @@
+export const getCookie = (name: string, cookie: string = document.cookie): string => {
+  if (!cookie) {
+    return '';
+  }
+
+  const cookies = cookie.split('; ');
+
+  for (let i = 0; i < cookies.length; i += 1) {
+    if (cookies[i]) {
+      const [key, value] = cookies[i].split('=');
+
+      if (key === name) {
+        return value;
+      }
+    }
+  }
+
+  return '';
+};
+
+export function removeCookie(name: string, subdomain?: boolean): 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=/${
+    subdomain ? '; domain=cuemath.com' : ''
+  }`;
+}
+
+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 ? '; domain=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/date-time-helper/index.ts

@@ -0,0 +1,139 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import dayjs from 'dayjs';
+import relativeTime from 'dayjs/plugin/relativeTime';
+
+import { timezones } from '../constants/date-time/international-timezones';
+
+type Timestamp = number;
+
+export interface DateSlots {
+  key: number;
+  label: string;
+  subLabel: string;
+  disabled: boolean;
+}
+
+export const formatDateTime = (
+  dateTime: string | number | Date | dayjs.Dayjs | null | undefined,
+  format: string | undefined,
+) => {
+  const momentDate = dayjs(dateTime);
+
+  return momentDate.format(format);
+};
+
+export function getCurrentTimestamp(): number {
+  if (!Date.now) {
+    Date.now = () => new Date().getTime();
+  }
+
+  return Math.floor(Date.now() / 1000);
+}
+
+export function dateTimeByTimezone(timestamp: Timestamp, timezone?: string): string {
+  let options = {};
+
+  if (timezone) {
+    options = {
+      timeZone: timezone,
+    };
+  }
+
+  return new Date(timestamp).toLocaleString('en-US', options);
+}
+
+export function dateByTimezone(
+  timestamp: number,
+  timezone: string,
+  format: string,
+): string {
+  const datetime = dateTimeByTimezone(timestamp, timezone);
+
+  return dayjs(datetime).format(format || 'mm/dd/yyyy');
+}
+
+export const dateByTimestamp = (timestamp: Timestamp, format: string): string => {
+  const datetime = new Date(timestamp).toLocaleString('en-US');
+
+  return dayjs(datetime).format(format || 'mm/dd/yyyy');
+};
+
+export function convertTimeStampToSeconds(timeStamp: Timestamp): number {
+  const demoTimeStamp = timeStamp;
+  const currentTimeStamp = getCurrentTimestamp();
+
+  if (Number.isNaN(demoTimeStamp) || Number.isNaN(currentTimeStamp)) {
+    return timeStamp;
+  }
+
+  const demoTimeStampLength = String(demoTimeStamp).length;
+  const currentTimeStampLength = String(currentTimeStamp).length;
+
+  return demoTimeStampLength > currentTimeStampLength ? timeStamp / 1000 : timeStamp;
+}
+
+export function formatTimestamp(datetime: Timestamp, format: string | undefined): string {
+  const timeStamp = convertTimeStampToSeconds(datetime);
+
+  return dayjs.unix(timeStamp).format(format);
+}
+
+export function getTimezone(): string {
+  return Intl?.DateTimeFormat().resolvedOptions().timeZone;
+}
+
+export function timeToX(
+  datetime: string | number | Date | dayjs.Dayjs | null | undefined,
+): string {
+  dayjs.extend(relativeTime);
+
+  return dayjs().to(datetime, true);
+}
+
+export function getCurrentDatebyTimezone(timezone: string): string {
+  let options = {};
+
+  if (timezone) {
+    options = {
+      timeZone: timezone,
+    };
+  }
+
+  return new Date().toLocaleString('en-US', options);
+}
+
+export function getTimeDiff(
+  date1: string | number | Date | dayjs.Dayjs | null | undefined,
+  date2: string | number | Date | dayjs.Dayjs | null | undefined,
+): { days: any; hour: any; minute: any; seconds: any; distance: any } {
+  const dateTime1 = dayjs(date1);
+  const dateTime2 = dayjs(date2);
+
+  return {
+    days: dateTime1.diff(dateTime2, 'days'),
+    hour: dateTime1.diff(dateTime2, 'hour'),
+    minute: dateTime1.diff(dateTime2, 'minute'),
+    seconds: dateTime1.diff(dateTime2, 'seconds'),
+    distance: dateTime1.diff(dateTime2),
+  };
+}
+
+export function getISOTimeString(demoTs: number): string {
+  return new Date(demoTs * 1000).toISOString().replace(/-|:|\.\d\d\d/g, '');
+}
+
+export function getDateAfterDays(days: number): string {
+  return formatDateTime(dayjs().add(days, 'day'), 'D MMM, YYYY').toUpperCase();
+}
+
+export const convertedTimezone = (selectedTimezone: string): string => {
+  const formattedTimezone = timezones?.find(
+    currentTimezone => currentTimezone?.id === selectedTimezone,
+  );
+
+  return formattedTimezone?.value ?? selectedTimezone?.replaceAll('_', ' ');
+};
+
+export const convertSecondsToMiliseconds = (seconds: number) => {
+  return seconds * 1000;
+};

package/src/e-cna/index.ts

@@ -0,0 +1,23 @@
+import { TWENTY_FOUR_HOURS_IN_SECONDS } from '../constants/date-time';
+import { getCurrentDatebyTimezone } from '../date-time-helper/index';
+
+// if adding any change in this function, then need update at all the places where we are using this function in website and astro
+export const getDates = (
+  timezone: string,
+): Array<{ futureDate: number; disabled: boolean }> => {
+  const currentDate = Date.parse(getCurrentDatebyTimezone(timezone)) / 1000;
+  const dates = [];
+
+  const days = 10;
+  const buffer = 2;
+
+  // getting dates by adding 86400 seconds(24 hours)
+  for (let i = 0; i < days; i += 1) {
+    dates.push({
+      futureDate: currentDate + TWENTY_FOUR_HOURS_IN_SECONDS * i,
+      disabled: !(i > buffer),
+    });
+  }
+
+  return dates;
+};

package/src/growth-source/index.ts

@@ -0,0 +1,237 @@
+import type {
+  SourceDetails,
+  SourceDetailsCookie,
+  Platform,
+  SignupFlow,
+  UTMParams,
+  Experiments,
+  RevenueChannel,
+  UTMParamsKeys,
+} from './types';
+
+import { createCookie, getCookie, removeCookie } from '../cookie';
+
+export * from './utils';
+
+const SOURCE_DETAILS_COOKIE = 'source_details';
+const UTM_PARAMS: UTMParamsKeys[] = [
+  'utm_source',
+  'utm_medium',
+  'utm_campaign',
+  'utm_term',
+];
+
+export const readSourceCookie = (): SourceDetailsCookie => {
+  const sourceDetails = getCookie(SOURCE_DETAILS_COOKIE);
+
+  return sourceDetails ? JSON.parse(decodeURIComponent(sourceDetails)) : undefined;
+};
+
+const writeSourceCookie = (sourceDetails: SourceDetailsCookie): void => {
+  createCookie(SOURCE_DETAILS_COOKIE, JSON.stringify(sourceDetails), 365);
+};
+
+export const isSourcePresent = (): boolean => {
+  return !!getCookie(SOURCE_DETAILS_COOKIE);
+};
+
+const updateSourceCookie = (sourceDetail: Partial<SourceDetailsCookie>): void => {
+  if (!isSourcePresent) return;
+
+  const sourceDetails: SourceDetailsCookie = readSourceCookie();
+  const updatedDetails: SourceDetailsCookie = {
+    ...sourceDetails,
+    ...sourceDetail,
+  };
+
+  writeSourceCookie(updatedDetails);
+};
+
+const getRevenueChannel = (platform: Platform, utmSource?: string): RevenueChannel => {
+  let revenueChannel: RevenueChannel = 'unknown';
+
+  // set defaults for WEBSITE and ASTRO
+  if (platform === 'website') {
+    revenueChannel = 'organic';
+  } else if (platform === 'astro') {
+    revenueChannel = 'performance';
+  }
+
+  if (utmSource) {
+    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):
+        revenueChannel = 'performance';
+        break;
+    }
+  }
+
+  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): SignupFlow => {
+  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' ? 'e-cna' : 'regular';
+    }
+  }
+
+  return flow;
+};
+
+const getUTMParams = (): Partial<UTMParams> => {
+  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 = (): string => {
+  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 = (utmSource?: string): string => {
+  // TODO: UTM source patter for FB, GOOGLE...
+  if (!utmSource) return '';
+
+  let channel = '';
+
+  if (utmSource) {
+    switch (true) {
+      case /^affiliate-/.test(utmSource):
+      case /^offline-/.test(utmSource):
+      case /^referral-/.test(utmSource):
+      case /^performance-/.test(utmSource):
+        channel = utmSource.split('-')[1];
+        break;
+      default:
+        break;
+    }
+  }
+
+  return channel;
+};
+
+/* 
+  Set Static Source Details of user on Visit of Platform
+*/
+export const initSourceDetails = async ({
+  platform,
+  experiments,
+  flow,
+  affiliateChannel,
+  offlineChannel,
+  organicChannel,
+  performanceChannel,
+  revenueChannel,
+  guestId,
+}: SourceDetails): Promise<void> => {
+  const utmParams: Partial<UTMParams> = getUTMParams();
+  const { utm_source: utmSource } = utmParams;
+  const leadChannel = getChannel(utmSource);
+
+  /*
+    source cookie was added in cross subdomain for few days initially,
+    which was later changed to subdomain specific. Now to sending older cookie to backend, removing older cookie
+  */
+  removeCookie(SOURCE_DETAILS_COOKIE, true);
+
+  revenueChannel = revenueChannel || getRevenueChannel(platform, utmSource);
+
+  if (utmSource) {
+    affiliateChannel =
+      revenueChannel === 'affiliate' ? affiliateChannel || leadChannel : undefined;
+    offlineChannel =
+      revenueChannel === 'offline' ? offlineChannel || leadChannel : undefined;
+    organicChannel =
+      revenueChannel === 'organic' ? organicChannel || leadChannel : undefined;
+    performanceChannel =
+      revenueChannel === 'performance' ? performanceChannel || leadChannel : undefined;
+  }
+
+  if (!isSourcePresent()) {
+    const sourceDetails: SourceDetailsCookie = {
+      platform_channel: platform,
+      experiment_dict: experiments,
+      utm_params: utmParams,
+      flow: flow || getFlow(platform, experiments),
+      affiliate_channel: affiliateChannel,
+      offline_channel: offlineChannel,
+      organic_channel: organicChannel,
+      performance_channel: performanceChannel,
+      revenue_channel: revenueChannel,
+      first_page: getFirstPage(),
+      guest_id: guestId,
+    };
+
+    writeSourceCookie(sourceDetails);
+  } else {
+    let updatedSource: Partial<SourceDetailsCookie> = {
+      experiment_dict: experiments,
+      flow: flow || getFlow(platform, experiments),
+      guest_id: guestId,
+    };
+
+    if (utmSource) {
+      updatedSource = {
+        ...updatedSource,
+        utm_params: utmParams,
+        affiliate_channel: affiliateChannel,
+        offline_channel: offlineChannel,
+        organic_channel: organicChannel,
+        performance_channel: performanceChannel,
+        revenue_channel: revenueChannel,
+      };
+    }
+
+    updateSourceCookie(updatedSource);
+  }
+};
+
+// Last Page which user visited signup before
+export const setLastPage = async (pagePath: string): Promise<void> => {
+  updateSourceCookie({ last_page: pagePath });
+};
+
+// set Entry point where user clicked to Signup
+export const setFlowEntryPoint = async (flowEntry: string): Promise<void> => {
+  updateSourceCookie({ flow_entry: flowEntry });
+};

package/src/growth-source/types.ts

@@ -0,0 +1,50 @@
+export type Platform = 'website' | 'app' | 'astro' | 'leap-teacher' | 'leap-admin';
+export type RevenueChannel =
+  | 'organic'
+  | 'performance'
+  | 'affiliate'
+  | 'offline'
+  | 'referral'
+  | 'unknown';
+export type SignupFlow = 'regular' | 'e-cna' | 'e-sales';
+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 SourceDetailsCookie = {
+  platform_channel: Platform;
+  experiment_dict?: Experiments;
+  flow?: SignupFlow;
+  utm_params?: UTMParams;
+  affiliate_channel?: string;
+  offline_channel?: string;
+  performance_channel?: string;
+  revenue_channel: RevenueChannel;
+  organic_channel?: string;
+  flow_entry?: string;
+  first_page?: string;
+  last_page?: string;
+  guest_id?: string;
+};
+
+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;
+  guestId?: string;
+};

package/src/growth-source/utils/env-mode.ts

@@ -0,0 +1,5 @@
+export const APP_ENV = {
+  PRODUCTION: 'production',
+  STAGING: 'staging',
+  DEVELOPMENT: 'development',
+};

package/src/growth-source/utils/index.ts

@@ -0,0 +1,2 @@
+export * from './env-mode';
+export * from './server';

package/src/growth-source/utils/server.ts

@@ -0,0 +1 @@
+export const isServer = typeof window === 'undefined';