react-marketing-tools 0.0.2 → 0.0.5

package/README.md

@@ -1,10 +1,11 @@
 
 # React Marketing Tools   [![npm version](https://badge.fury.io/js/react-marketing-tools.svg)](https://badge.fury.io/js/react-marketing-tools)
 
+React Marketing Tools are a set of tools to make it easier for you to implement analytics and track user journeys, interactions throughout your App. using dataLayer/Google Tag Manager, GA4 fetch directly or coming soon facebook pixel.
+
 COMING SOON: [React Marketing Tools Demo](https://)
 - For now you can clone and run locally. There is a very basic demo app, thanks to [Vite.](https://vitejs.dev/)
 
-React Marketing Tools are a set of tools to make it easier for you to implement analytics and track user journeys, interactions throughout your App. using dataLayer/Google Tag Manager, GA4 fetch directly or coming soon facebook pixel.
 
 # PR's
 - Have a look at the [PR template doc](https://github.com/bronz3beard/react-marketing-tools/blob/main/docs) for best approach to getting your pr merged.
@@ -44,6 +45,7 @@ React Marketing Tools are a set of tools to make it easier for you to implement
 
     const analyticsConfig = { 
         appName: 'my-awesome-app', // required
+        appSessionCookieName: 'APP_SESSION',
         eventActionPrefix: { // this will extend the default values of eventActionPrefix 
             ACTION: 'ACTION',
             OTHER_EVENT_NAME_TYPE: 'OTHER_EVENT_NAME_TYPE'
@@ -59,6 +61,17 @@ React Marketing Tools are a set of tools to make it easier for you to implement
         withServerLocationInfo: false, // (optional) has default value
     }
 
+    /**
+        * @type {Object} buildConfig -> options: all attributes of the options object must have a value, other than withDeviceInfo.
+        * @property {string} appName: the name of your app this value must be passed in.
+        * @property {string} appSessionCookieName This is used to get the cookie from storage based on a key you use, the value from the cookie will be used in "client_id:"
+        * @property {Object} eventActionPrefix: is a { key: 'value' } object that allows you to extend "analyticsEventActionPrefixList" object with custom eventActionPrefix. To see the build in list call the function showMeBuildInEventActionPrefixList().
+        * @property {Array} globalEventActionList: is a { key: 'value' } object that allows you to extend "analyticsGlobalEventActionList" object with custom eventActionNames. To see the build in list call the function showMeBuildInGlobalEventActionList().
+        * @property {Array} includeUserKeys: is an array of strings that represent keys from your user data that you want to whitelist, user data you wan to hash.
+        * @property {Object} TOKENS: is a { key: 'value' } object that includes the following keys, IP_INFO_TOKEN, GA4_PUBLIC_API_SECRET, GA4_PUBLIC_MEASUREMENT_ID, depending on if you need these features enabled.
+        * @property {Boolean} withDeviceInfo: if you want device information added to "globalVars" set this to true false by default.
+        * @property {Boolean} withServerLocationInfo: if you want server information added to "journeyProps" set this to true false by default.
+    */
     buildConfig(analyticsConfig)
 
     ReactDOM.createRoot(document.getElementById('root')).render(
@@ -79,6 +92,7 @@ React Marketing Tools are a set of tools to make it easier for you to implement
     function App() {
         const [count, setCount] = useState(0)
         const {
+            appSessionCookieName,
             analyticsPlatform,
             eventActionPrefixList,
             analyticsGlobalEventActionList
@@ -95,6 +109,9 @@ React Marketing Tools are a set of tools to make it easier for you to implement
         } = useMarketingApi(ContextApi)
 
         useEffect(function appLoadPageLandingWelcome() {
+            // create session cookie, useful for unauthenticated user tracking and other things
+            document.cookie = `${appSessionCookieName}=${uuid()};max-age=${70};SameSite=Strict;Secure`
+
             const eventNameInfo = {
                 actionPrefix: eventActionPrefixList.JOURNEY,
                 description: 'Welcome Landing',