@segment/analytics-browser-actions-google-analytics-4 1.0.0

package/src/setConfigurationFields/index.ts

@@ -0,0 +1,143 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+import { user_id, user_properties } from '../ga4-properties'
+import { updateUser } from '../ga4-functions'
+
+// Change from unknown to the partner SDK types
+const action: BrowserActionDefinition<Settings, Function, Payload> = {
+  title: 'Set Configuration Fields',
+  description: 'Set custom values for the GA4 configuration fields.',
+  platform: 'web',
+  defaultSubscription: 'type = "identify" or type = "page"',
+  fields: {
+    user_id: user_id,
+    user_properties: user_properties,
+    ads_storage_consent_state: {
+      description:
+        'Consent state indicated by the user for ad cookies. Value must be “granted” or “denied.” This is only used if the Enable Consent Mode setting is on.',
+      label: 'Ads Storage Consent State',
+      type: 'string'
+    },
+    analytics_storage_consent_state: {
+      description:
+        'Consent state indicated by the user for ad cookies. Value must be “granted” or “denied.” This is only used if the Enable Consent Mode setting is on.',
+      label: 'Analytics Storage Consent State',
+      type: 'string'
+    },
+    campaign_content: {
+      description:
+        'Use campaign content to differentiate ads or links that point to the same URL. Setting this value will override the utm_content query parameter.',
+      label: 'Campaign Content',
+      type: 'string'
+    },
+    campaign_id: {
+      description:
+        'Use campaign ID to identify a specific campaign. Setting this value will override the utm_id query parameter. ',
+      label: 'Campaign ID',
+      type: 'string'
+    },
+    campaign_medium: {
+      description:
+        'Use campaign medium to identify a medium such as email or cost-per-click. Setting this value will override the utm_medium query parameter.',
+      label: 'Campaign Medium',
+      type: 'string'
+    },
+    campaign_name: {
+      description:
+        'Use campaign name to identify a specific product promotion or strategic campaign. Setting this value will override the utm_name query parameter.',
+      label: 'Campaign Name',
+      type: 'string'
+    },
+    campaign_source: {
+      description:
+        'Use campaign source to identify a search engine, newsletter name, or other source. Setting this value will override the utm_source query parameter.',
+      label: 'Campaign Source',
+      type: 'string'
+    },
+    campaign_term: {
+      description:
+        'Use campaign term to note the keywords for this ad. Setting this value will override the utm_term query parameter.',
+      label: 'Campaign Term',
+      type: 'string'
+    },
+    content_group: {
+      description: `Categorize pages and screens into custom buckets so you can see metrics for related groups of information. More information in [Google documentation](https://support.google.com/analytics/answer/11523339).`,
+      label: 'Content Group',
+      type: 'string'
+    },
+    language: {
+      description: `The language preference of the user. If not set, defaults to the user's navigator.language value.`,
+      label: 'Language',
+      type: 'string'
+    },
+    page_location: {
+      description: `The full URL of the page. If not set, defaults to the user's document.location value.`,
+      label: 'Page Location',
+      type: 'string'
+    },
+    page_referrer: {
+      description: `The referral source that brought traffic to a page. This value is also used to compute the traffic source. The format of this value is a URL. If not set, defaults to the user's document.referrer value.`,
+      label: 'Page Referrer',
+      type: 'string'
+    },
+    page_title: {
+      description: `The title of the page or document. If not set, defaults to the user's document.title value.`,
+      label: 'Page Title',
+      type: 'string'
+    },
+    screen_resolution: {
+      description: `The resolution of the screen. Format should be two positive integers separated by an x (i.e. 800x600). If not set, calculated from the user's window.screen value.`,
+      label: 'Screen Resolution',
+      type: 'string'
+    }
+  },
+  perform: (gtag, { payload, settings }) => {
+    updateUser(payload.user_id, payload.user_properties, gtag)
+    if (settings.enableConsentMode) {
+      window.gtag('consent', 'update', {
+        ad_storage: payload.ads_storage_consent_state,
+        analytics_storage: payload.analytics_storage_consent_state
+      })
+    }
+    if (payload.screen_resolution) {
+      gtag('set', { screen_resolution: payload.screen_resolution })
+    }
+    if (payload.page_title) {
+      gtag('set', { page_title: payload.page_title })
+    }
+    if (payload.page_referrer) {
+      gtag('set', { page_referrer: payload.page_referrer })
+    }
+    if (payload.page_location) {
+      gtag('set', { page_location: payload.page_location })
+    }
+    if (payload.language) {
+      gtag('set', { language: payload.language })
+    }
+    if (payload.content_group) {
+      gtag('set', { content_group: payload.content_group })
+    }
+    if (payload.campaign_term) {
+      gtag('set', { campaign_term: payload.campaign_term })
+    }
+    if (payload.campaign_source) {
+      gtag('set', { campaign_source: payload.campaign_source })
+    }
+    if (payload.campaign_name) {
+      gtag('set', { campaign_name: payload.campaign_name })
+    }
+    if (payload.campaign_medium) {
+      gtag('set', { campaign_medium: payload.campaign_medium })
+    }
+    if (payload.campaign_id) {
+      gtag('set', { campaign_id: payload.campaign_id })
+    }
+    if (payload.campaign_content) {
+      gtag('set', { campaign_content: payload.campaign_content })
+    }
+    gtag('event', 'page_view')
+  }
+}
+
+export default action

package/src/signUp/generated-types.ts

@@ -0,0 +1,24 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Payload {
+  /**
+   * A unique identifier for a user. See Google's [User-ID for cross-platform analysis](https://support.google.com/analytics/answer/9213390) and [Reporting: deduplicate user counts](https://support.google.com/analytics/answer/9355949?hl=en) documentation for more information on this identifier.
+   */
+  user_id?: string
+  /**
+   * The method used to login.
+   */
+  method?: string
+  /**
+   * The user properties to send to Google Analytics 4. You must create user-scoped dimensions to ensure custom properties are picked up by Google. See Google’s [Custom user properties](https://support.google.com/analytics/answer/9269570) to learn how to set and register user properties.
+   */
+  user_properties?: {
+    [k: string]: unknown
+  }
+  /**
+   * The event parameters to send to Google Analytics 4.
+   */
+  params?: {
+    [k: string]: unknown
+  }
+}

package/src/signUp/index.ts

@@ -0,0 +1,29 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+
+import { user_properties, params, user_id, method } from '../ga4-properties'
+import { updateUser } from '../ga4-functions'
+
+const action: BrowserActionDefinition<Settings, Function, Payload> = {
+  title: 'Sign Up',
+  description: 'The method used for sign up.',
+  defaultSubscription: 'type = "track" and event = "Signed Up"',
+  platform: 'web',
+  fields: {
+    user_id: user_id,
+    method: method,
+    user_properties: user_properties,
+    params: params
+  },
+  perform: (gtag, { payload }) => {
+    updateUser(payload.user_id, payload.user_properties, gtag)
+
+    gtag('event', 'sign_up', {
+      method: payload.method,
+      ...payload.params
+    })
+  }
+}
+
+export default action

package/src/types.ts

@@ -0,0 +1,3 @@
+export type GA = {
+  gtag: Function
+}

package/src/viewCart/generated-types.ts

@@ -0,0 +1,109 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Payload {
+  /**
+   * A unique identifier for a user. See Google's [User-ID for cross-platform analysis](https://support.google.com/analytics/answer/9213390) and [Reporting: deduplicate user counts](https://support.google.com/analytics/answer/9355949?hl=en) documentation for more information on this identifier.
+   */
+  user_id?: string
+  /**
+   * Currency of the items associated with the event, in 3-letter ISO 4217 format.
+   */
+  currency?: string
+  /**
+   * The monetary value of the event.
+   */
+  value?: number
+  /**
+   * The list of products purchased.
+   */
+  items: {
+    /**
+     * Identifier for the product being purchased.
+     */
+    item_id?: string
+    /**
+     * Name of the product being purchased.
+     */
+    item_name?: string
+    /**
+     * A product affiliation to designate a supplying company or brick and mortar store location.
+     */
+    affiliation?: string
+    /**
+     * Coupon code used for a purchase.
+     */
+    coupon?: string
+    /**
+     * Currency of the purchase or items associated with the event, in 3-letter ISO 4217 format.
+     */
+    currency?: string
+    /**
+     * Monetary value of discount associated with a purchase.
+     */
+    discount?: number
+    /**
+     * The index/position of the item in a list.
+     */
+    index?: number
+    /**
+     * Brand associated with the product.
+     */
+    item_brand?: string
+    /**
+     * Product category.
+     */
+    item_category?: string
+    /**
+     * Product category 2.
+     */
+    item_category2?: string
+    /**
+     * Product category 3.
+     */
+    item_category3?: string
+    /**
+     * Product category 4.
+     */
+    item_category4?: string
+    /**
+     * Product category 5.
+     */
+    item_category5?: string
+    /**
+     * The ID of the list in which the item was presented to the user.
+     */
+    item_list_id?: string
+    /**
+     * The name of the list in which the item was presented to the user.
+     */
+    item_list_name?: string
+    /**
+     * Variant of the product (e.g. Black).
+     */
+    item_variant?: string
+    /**
+     * The location associated with the item.
+     */
+    location_id?: string
+    /**
+     * Price of the product being purchased, in units of the specified currency parameter.
+     */
+    price?: number
+    /**
+     * Item quantity.
+     */
+    quantity?: number
+  }[]
+  /**
+   * The user properties to send to Google Analytics 4. You must create user-scoped dimensions to ensure custom properties are picked up by Google. See Google’s [Custom user properties](https://support.google.com/analytics/answer/9269570) to learn how to set and register user properties.
+   */
+  user_properties?: {
+    [k: string]: unknown
+  }
+  /**
+   * The event parameters to send to Google Analytics 4.
+   */
+  params?: {
+    [k: string]: unknown
+  }
+}

package/src/viewCart/index.ts

@@ -0,0 +1,36 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+
+import { user_properties, params, currency, value, user_id, items_multi_products } from '../ga4-properties'
+import { updateUser } from '../ga4-functions'
+
+const action: BrowserActionDefinition<Settings, Function, Payload> = {
+  title: 'View Cart',
+  description: 'This event signifies that a user viewed their cart.',
+  defaultSubscription: 'type = "track" and event = "Cart Viewed"',
+  platform: 'web',
+  fields: {
+    user_id: user_id,
+    currency: currency,
+    value: value,
+    items: {
+      ...items_multi_products,
+      required: true
+    },
+    user_properties: user_properties,
+    params: params
+  },
+  perform: (gtag, { payload }) => {
+    updateUser(payload.user_id, payload.user_properties, gtag)
+
+    gtag('event', 'view_cart', {
+      currency: payload.currency,
+      value: payload.value,
+      items: payload.items,
+      ...payload.params
+    })
+  }
+}
+
+export default action

package/src/viewItem/generated-types.ts

@@ -0,0 +1,109 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Payload {
+  /**
+   * A unique identifier for a user. See Google's [User-ID for cross-platform analysis](https://support.google.com/analytics/answer/9213390) and [Reporting: deduplicate user counts](https://support.google.com/analytics/answer/9355949?hl=en) documentation for more information on this identifier.
+   */
+  user_id?: string
+  /**
+   * Currency of the items associated with the event, in 3-letter ISO 4217 format.
+   */
+  currency?: string
+  /**
+   * The monetary value of the event.
+   */
+  value?: number
+  /**
+   * The list of products purchased.
+   */
+  items: {
+    /**
+     * Identifier for the product being purchased.
+     */
+    item_id?: string
+    /**
+     * Name of the product being purchased.
+     */
+    item_name?: string
+    /**
+     * A product affiliation to designate a supplying company or brick and mortar store location.
+     */
+    affiliation?: string
+    /**
+     * Coupon code used for a purchase.
+     */
+    coupon?: string
+    /**
+     * Currency of the purchase or items associated with the event, in 3-letter ISO 4217 format.
+     */
+    currency?: string
+    /**
+     * Monetary value of discount associated with a purchase.
+     */
+    discount?: number
+    /**
+     * The index/position of the item in a list.
+     */
+    index?: number
+    /**
+     * Brand associated with the product.
+     */
+    item_brand?: string
+    /**
+     * Product category.
+     */
+    item_category?: string
+    /**
+     * Product category 2.
+     */
+    item_category2?: string
+    /**
+     * Product category 3.
+     */
+    item_category3?: string
+    /**
+     * Product category 4.
+     */
+    item_category4?: string
+    /**
+     * Product category 5.
+     */
+    item_category5?: string
+    /**
+     * The ID of the list in which the item was presented to the user.
+     */
+    item_list_id?: string
+    /**
+     * The name of the list in which the item was presented to the user.
+     */
+    item_list_name?: string
+    /**
+     * Variant of the product (e.g. Black).
+     */
+    item_variant?: string
+    /**
+     * The location associated with the item.
+     */
+    location_id?: string
+    /**
+     * Price of the product being purchased, in units of the specified currency parameter.
+     */
+    price?: number
+    /**
+     * Item quantity.
+     */
+    quantity?: number
+  }[]
+  /**
+   * The user properties to send to Google Analytics 4. You must create user-scoped dimensions to ensure custom properties are picked up by Google. See Google’s [Custom user properties](https://support.google.com/analytics/answer/9269570) to learn how to set and register user properties.
+   */
+  user_properties?: {
+    [k: string]: unknown
+  }
+  /**
+   * The event parameters to send to Google Analytics 4.
+   */
+  params?: {
+    [k: string]: unknown
+  }
+}

package/src/viewItem/index.ts

@@ -0,0 +1,37 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+
+import { user_properties, params, currency, user_id, value, items_single_products } from '../ga4-properties'
+import { updateUser } from '../ga4-functions'
+
+const action: BrowserActionDefinition<Settings, Function, Payload> = {
+  title: 'View Item',
+  description:
+    'This event signifies that some content was shown to the user. Use this event to discover the most popular items viewed.',
+  defaultSubscription: 'type = "track" and event =  "Product Viewed"',
+  platform: 'web',
+  fields: {
+    user_id: user_id,
+    currency: currency,
+    value: value,
+    items: {
+      ...items_single_products,
+      required: true
+    },
+    user_properties: user_properties,
+    params: params
+  },
+  perform: (gtag, { payload }) => {
+    updateUser(payload.user_id, payload.user_properties, gtag)
+
+    gtag('event', 'view_item', {
+      currency: payload.currency,
+      value: payload.value,
+      items: payload.items,
+      ...payload.params
+    })
+  }
+}
+
+export default action

package/src/viewItemList/generated-types.ts

@@ -0,0 +1,109 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Payload {
+  /**
+   * A unique identifier for a user. See Google's [User-ID for cross-platform analysis](https://support.google.com/analytics/answer/9213390) and [Reporting: deduplicate user counts](https://support.google.com/analytics/answer/9355949?hl=en) documentation for more information on this identifier.
+   */
+  user_id?: string
+  /**
+   * The ID of the list in which the item was presented to the user.
+   */
+  item_list_id?: string
+  /**
+   * The name of the list in which the item was presented to the user.
+   */
+  item_list_name?: string
+  /**
+   * The list of products purchased.
+   */
+  items: {
+    /**
+     * Identifier for the product being purchased.
+     */
+    item_id?: string
+    /**
+     * Name of the product being purchased.
+     */
+    item_name?: string
+    /**
+     * A product affiliation to designate a supplying company or brick and mortar store location.
+     */
+    affiliation?: string
+    /**
+     * Coupon code used for a purchase.
+     */
+    coupon?: string
+    /**
+     * Currency of the purchase or items associated with the event, in 3-letter ISO 4217 format.
+     */
+    currency?: string
+    /**
+     * Monetary value of discount associated with a purchase.
+     */
+    discount?: number
+    /**
+     * The index/position of the item in a list.
+     */
+    index?: number
+    /**
+     * Brand associated with the product.
+     */
+    item_brand?: string
+    /**
+     * Product category.
+     */
+    item_category?: string
+    /**
+     * Product category 2.
+     */
+    item_category2?: string
+    /**
+     * Product category 3.
+     */
+    item_category3?: string
+    /**
+     * Product category 4.
+     */
+    item_category4?: string
+    /**
+     * Product category 5.
+     */
+    item_category5?: string
+    /**
+     * The ID of the list in which the item was presented to the user.
+     */
+    item_list_id?: string
+    /**
+     * The name of the list in which the item was presented to the user.
+     */
+    item_list_name?: string
+    /**
+     * Variant of the product (e.g. Black).
+     */
+    item_variant?: string
+    /**
+     * The location associated with the item.
+     */
+    location_id?: string
+    /**
+     * Price of the product being purchased, in units of the specified currency parameter.
+     */
+    price?: number
+    /**
+     * Item quantity.
+     */
+    quantity?: number
+  }[]
+  /**
+   * The user properties to send to Google Analytics 4. You must create user-scoped dimensions to ensure custom properties are picked up by Google. See Google’s [Custom user properties](https://support.google.com/analytics/answer/9269570) to learn how to set and register user properties.
+   */
+  user_properties?: {
+    [k: string]: unknown
+  }
+  /**
+   * The event parameters to send to Google Analytics 4.
+   */
+  params?: {
+    [k: string]: unknown
+  }
+}

package/src/viewItemList/index.ts

@@ -0,0 +1,36 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+
+import { user_properties, params, user_id, items_multi_products, item_list_name, item_list_id } from '../ga4-properties'
+import { updateUser } from '../ga4-functions'
+
+const action: BrowserActionDefinition<Settings, Function, Payload> = {
+  title: 'View Item List',
+  description: 'Log this event when the user has been presented with a list of items of a certain category.',
+  platform: 'web',
+  defaultSubscription: 'type = "track" and event = "Promotion Viewed"',
+  fields: {
+    user_id: user_id,
+    item_list_id: item_list_id,
+    item_list_name: item_list_name,
+    items: {
+      ...items_multi_products,
+      required: true
+    },
+    user_properties: user_properties,
+    params: params
+  },
+  perform: (gtag, { payload }) => {
+    updateUser(payload.user_id, payload.user_properties, gtag)
+
+    gtag('event', 'view_item_list', {
+      item_list_id: payload.item_list_id,
+      item_list_name: payload.item_list_name,
+      items: payload.items,
+      ...payload.params
+    })
+  }
+}
+
+export default action