@xyo-network/react-user-events 3.0.16

package/src/XnsEstimateEventHandlerInterface.ts

@@ -0,0 +1,24 @@
+import type { EmptyObject } from '@xylabs/object'
+import type { UserEventHandler } from '@xylabs/pixel'
+
+export interface XnsEstimateFields extends EmptyObject {
+  name: string
+}
+
+export interface XnsEstimateAttemptedFields extends XnsEstimateFields {}
+
+export interface XnsEstimateSuccessFields extends XnsEstimateFields {
+  price: number
+}
+
+export interface XnsEstimateFailureFields extends XnsEstimateFields {
+  error: string
+}
+
+export interface XnsEstimateEventHandlerInterface<TData extends EmptyObject> extends UserEventHandler<TData> {
+  xnsEstimateAttempted<T extends TData>(fields: XnsEstimateAttemptedFields | T): Promise<void>
+
+  xnsEstimateFailure<T extends TData>(fields: XnsEstimateFailureFields | T): Promise<void>
+
+  xnsEstimateSuccess<T extends TData>(fields: XnsEstimateSuccessFields | T): Promise<void>
+}

package/src/XnsPurchaseEventHandlerInterface.ts

@@ -0,0 +1,30 @@
+import type { EmptyObject } from '@xylabs/object'
+import type { UserEventHandler } from '@xylabs/pixel'
+
+export interface XnsPurchaseFields extends EmptyObject {
+  name: string
+  price: number
+}
+
+export interface XnsPurchaseAttemptedFields extends XnsPurchaseFields {}
+
+export interface XnsPurchaseSuccessFields extends XnsPurchaseFields {
+  currency?: string
+  /** Identifier for the purchase - rebilly or payload hash */
+  id: string
+  quantity?: number
+  /** price - discount */
+  value: number
+}
+
+export interface XnsPurchaseFailureFields extends XnsPurchaseFields {
+  error: string
+}
+
+export interface XnsPurchaseEventHandlerInterface<TData extends EmptyObject> extends UserEventHandler<TData> {
+  xnsPurchaseAttempted<T extends TData>(fields: T | XnsPurchaseAttemptedFields): Promise<void>
+
+  xnsPurchaseFailure<T extends TData>(fields: T | XnsPurchaseFailureFields): Promise<void>
+
+  xnsPurchaseSuccess<T extends TData>(fields: T | XnsPurchaseSuccessFields): Promise<void>
+}

package/src/XnsReservationEventHandlerInterface.ts

@@ -0,0 +1,23 @@
+import type { EmptyObject } from '@xylabs/object'
+import type { UserEventHandler } from '@xylabs/pixel'
+
+export interface XnsReservationFields extends EmptyObject {
+  email_hash: string
+  name: string
+}
+
+export interface XnsReservationAttemptedFields extends XnsReservationFields {}
+
+export interface XnsReservationSuccessFields extends XnsReservationFields {}
+
+export interface XnsReservationFailureFields extends XnsReservationFields {
+  error: string
+}
+
+export interface XnsReservationEventHandlerInterface<TData extends EmptyObject> extends UserEventHandler<TData> {
+  xnsReservationAttempted<T extends TData>(fields: T | XnsReservationAttemptedFields): Promise<void>
+
+  xnsReservationFailure<T extends TData>(fields: T | XnsReservationFailureFields): Promise<void>
+
+  xnsReservationSuccess<T extends TData>(fields: T | XnsReservationSuccessFields): Promise<void>
+}

package/src/Xy/index.ts

@@ -0,0 +1,27 @@
+import type { EmptyObject } from '@xylabs/object'
+import type {
+  PurchaseFields, UserClickFields, ViewContentFields,
+} from '@xylabs/pixel'
+import { XyCustomEvent } from '@xylabs/react-pixel'
+
+export class XyEvents<T extends EmptyObject> {
+  custom(name: string) {
+    return new XyCustomEvent<PurchaseFields | T>(name)
+  }
+
+  pageview() {
+    return new XyCustomEvent<ViewContentFields | T>('ViewContent')
+  }
+
+  purchase() {
+    return new XyCustomEvent<PurchaseFields | T>('Purchase')
+  }
+
+  userClick() {
+    return new XyCustomEvent<UserClickFields | T>('UserClick')
+  }
+
+  viewContent() {
+    return new XyCustomEvent<ViewContentFields | T>('ViewContent')
+  }
+}

package/src/XyoEventHandler.ts

@@ -0,0 +1,93 @@
+import type { EmptyObject } from '@xylabs/object'
+import type {
+  FunnelStartedFields, PurchaseFields, TestStartedFields, UserClickFields, ViewContentFields,
+} from '@xylabs/pixel'
+import { UserEventHandler } from '@xylabs/pixel'
+import type { Promisable } from '@xylabs/promise'
+
+import type {
+  XnsEstimateAttemptedFields, XnsEstimateFailureFields, XnsEstimateSuccessFields,
+} from './XnsEstimateEventHandlerInterface.ts'
+import type {
+  XnsPurchaseAttemptedFields, XnsPurchaseFailureFields, XnsPurchaseSuccessFields,
+} from './XnsPurchaseEventHandlerInterface.js'
+import type {
+  XnsReservationAttemptedFields, XnsReservationFailureFields, XnsReservationSuccessFields,
+} from './XnsReservationEventHandlerInterface.ts'
+import { XyEvents } from './Xy/index.ts'
+import type { XyoEventHandlerInterface, XyoNewsletterSignupFields } from './XyoEventHandlerInterface.ts'
+
+export interface Event<TData extends EmptyObject = EmptyObject> {
+  send<T extends TData>(fields: T, eventId?: string): Promisable<void>
+}
+
+export interface Events<TData extends EmptyObject = EmptyObject> {
+  custom<T extends TData>(name: string): Event<T>
+  purchase<T extends TData>(): Event<PurchaseFields | T>
+  userClick<T extends TData>(): Event<UserClickFields | T>
+  viewContent<T extends TData>(): Event<ViewContentFields | T>
+}
+
+export class XyoEventHandler<T extends EmptyObject> extends UserEventHandler<T> implements XyoEventHandlerInterface<T> {
+  private _events = new XyEvents()
+
+  get events(): Events<T> {
+    return this._events
+  }
+
+  funnelStarted(_fields: T | FunnelStartedFields): Promise<void> {
+    throw new Error('Method not implemented.')
+  }
+
+  testStarted(_fields: T | TestStartedFields): Promise<void> {
+    throw new Error('Method not implemented.')
+  }
+
+  async userClick(fields: UserClickFields) {
+    await this.events.userClick().send(fields)
+  }
+
+  async viewContent(fields: ViewContentFields) {
+    await this.events.viewContent().send(fields)
+  }
+
+  async xnsEstimateAttempted(fields: XnsEstimateAttemptedFields | T) {
+    await this.events.custom('XnsEstimateAttempted').send(fields as T)
+  }
+
+  async xnsEstimateFailure(fields: XnsEstimateFailureFields | T) {
+    await this.events.custom('XnsEstimateFailure').send(fields as T)
+  }
+
+  async xnsEstimateSuccess(fields: XnsEstimateSuccessFields | T) {
+    await this.events.custom('XnsEstimateSuccess').send(fields as T)
+  }
+
+  async xnsPurchaseAttempted(fields: XnsPurchaseAttemptedFields | T) {
+    await this.events.custom('XnsPurchaseAttempted').send(fields as T)
+  }
+
+  async xnsPurchaseFailure(fields: XnsPurchaseFailureFields | T) {
+    await this.events.custom('XnsPurchaseFailure').send(fields as T)
+  }
+
+  async xnsPurchaseSuccess(fields: XnsPurchaseSuccessFields) {
+    await this.events.purchase().send(fields)
+  }
+
+  async xnsReservationAttempted(fields: XnsReservationAttemptedFields | T) {
+    await this.events.custom('XnsReservationAttempted').send(fields as T)
+  }
+
+  async xnsReservationFailure(fields: XnsReservationFailureFields | T) {
+    await this.events.custom('XnsReservationFailure').send(fields as T)
+  }
+
+  async xnsReservationSuccess(fields: XnsReservationSuccessFields | T) {
+    await this.events.custom('XnsReservationSuccess').send(fields as T)
+  }
+
+  async xyoNewsletterSignup(fields: XyoNewsletterSignupFields | T) {
+    await this.events.custom('XyoNewsletterSignup').send(fields as T)
+  }
+}

package/src/XyoEventHandlerInterface.ts

@@ -0,0 +1,29 @@
+import type { EmptyObject } from '@xylabs/object'
+import type {
+  FunnelStartedFields, TestStartedFields, UserClickFields, UserEventHandler, ViewContentFields,
+} from '@xylabs/pixel'
+
+import type { XnsEstimateEventHandlerInterface } from './XnsEstimateEventHandlerInterface.ts'
+import type { XnsPurchaseEventHandlerInterface } from './XnsPurchaseEventHandlerInterface.ts'
+import type { XnsReservationEventHandlerInterface } from './XnsReservationEventHandlerInterface.ts'
+
+export interface XyoNewsletterSignupFields extends Record<string, unknown> {
+  email: string
+  url: string
+}
+
+export interface XyoEventHandlerInterface<TData extends EmptyObject>
+  extends UserEventHandler<TData>,
+  XnsEstimateEventHandlerInterface<TData>,
+  XnsReservationEventHandlerInterface<TData>,
+  XnsPurchaseEventHandlerInterface<TData> {
+  funnelStarted<T extends TData>(_fields: T | FunnelStartedFields): Promise<void>
+
+  testStarted<T extends TData>(_fields: T | TestStartedFields): Promise<void>
+
+  userClick<T extends TData>(fields: T | UserClickFields): Promise<void>
+
+  viewContent<T extends TData>(fields: T | ViewContentFields): Promise<void>
+
+  xyoNewsletterSignup<T extends TData>(fields: T | XyoNewsletterSignupFields): Promise<void>
+}

package/src/XyoUserClickFields.ts

@@ -0,0 +1,6 @@
+export interface XyoUserClickFields {
+  funnel?: string
+  name: string
+  placement?: string
+  type?: string
+}

package/src/XyoUserEvents.ts

@@ -0,0 +1,97 @@
+import type { EmptyObject } from '@xylabs/object'
+import type {
+  FunnelStartedFields, TestStartedFields, UserClickFields, ViewContentFields,
+} from '@xylabs/pixel'
+import { UserEventHandler } from '@xylabs/pixel'
+import type { Mixpanel } from 'mixpanel-browser'
+
+import { FacebookEventHandler } from './FacebookEventHandler.ts'
+import { GoogleEventHandler } from './GoogleEventHandler.ts'
+import { MixpanelEventHandler } from './MixpanelEventHandler.ts'
+import type {
+  XnsEstimateAttemptedFields, XnsEstimateFailureFields, XnsEstimateSuccessFields,
+} from './XnsEstimateEventHandlerInterface.ts'
+import type {
+  XnsPurchaseAttemptedFields, XnsPurchaseFailureFields, XnsPurchaseSuccessFields,
+} from './XnsPurchaseEventHandlerInterface.ts'
+import type {
+  XnsReservationAttemptedFields, XnsReservationFailureFields, XnsReservationSuccessFields,
+} from './XnsReservationEventHandlerInterface.ts'
+import { XyoEventHandler } from './XyoEventHandler.ts'
+import type { XyoEventHandlerInterface, XyoNewsletterSignupFields } from './XyoEventHandlerInterface.ts'
+
+export class XyoUserEvents<TData extends EmptyObject = EmptyObject> extends UserEventHandler<TData> {
+  static instance: XyoUserEvents<EmptyObject>
+
+  protected handlers: XyoEventHandlerInterface<TData>[]
+
+  private constructor(handlers?: XyoEventHandlerInterface<TData>[]) {
+    super()
+    this.handlers = handlers ?? [new XyoEventHandler<TData>(), new FacebookEventHandler<TData>(), new GoogleEventHandler<TData>()]
+  }
+
+  static get<T extends EmptyObject = EmptyObject>(mixpanel?: Mixpanel) {
+    this.instance = this.instance ?? (() => {
+      const handlers = [new XyoEventHandler<T>(), new FacebookEventHandler<T>(), new GoogleEventHandler<T>()]
+      if (mixpanel) handlers.push(new MixpanelEventHandler(mixpanel))
+      return new XyoUserEvents<T>(handlers)
+    })()
+    return this.instance
+  }
+
+  funnelStarted<T extends TData>(_fields: T | FunnelStartedFields): Promise<void> {
+    throw new Error('Method not implemented.')
+  }
+
+  testStarted<T extends TData>(_fields: T | TestStartedFields): Promise<void> {
+    throw new Error('Method not implemented.')
+  }
+
+  async userClick<T extends TData>(fields: T | UserClickFields) {
+    await Promise.all(this.handlers.map(handler => handler.userClick<T>(fields)))
+  }
+
+  async viewContent<T extends TData>(fields: T | ViewContentFields) {
+    await Promise.all(this.handlers.map(handler => handler.viewContent(fields)))
+  }
+
+  async xnsEstimateAttempted<T extends TData>(fields: T | XnsEstimateAttemptedFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsEstimateAttempted(fields)))
+  }
+
+  async xnsEstimateFailure<T extends TData>(fields: T | XnsEstimateFailureFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsEstimateFailure(fields)))
+  }
+
+  async xnsEstimateSuccess<T extends TData>(fields: T | XnsEstimateSuccessFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsEstimateSuccess(fields)))
+  }
+
+  async xnsPurchaseAttempted<T extends TData>(fields: T | XnsPurchaseAttemptedFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsPurchaseAttempted(fields)))
+  }
+
+  async xnsPurchaseFailure<T extends TData>(fields: T | XnsPurchaseFailureFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsPurchaseFailure(fields)))
+  }
+
+  async xnsPurchaseSuccess<T extends TData>(fields: T | XnsPurchaseSuccessFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsPurchaseSuccess(fields)))
+  }
+
+  async xnsReservationAttempted<T extends TData>(fields: T | XnsReservationAttemptedFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsReservationAttempted(fields)))
+  }
+
+  async xnsReservationFailure<T extends TData>(fields: T | XnsReservationFailureFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsReservationFailure(fields)))
+  }
+
+  async xnsReservationSuccess<T extends TData>(fields: T | XnsReservationSuccessFields) {
+    await Promise.all(this.handlers.map(handler => handler.xnsReservationSuccess(fields)))
+  }
+
+  async xyoNewsletterSignup<T extends TData>(fields: T | XyoNewsletterSignupFields) {
+    await Promise.all(this.handlers.map(handler => handler.xyoNewsletterSignup(fields)))
+  }
+}

package/src/getXyoUserEvents.ts

@@ -0,0 +1,10 @@
+import mixpanel from 'mixpanel-browser'
+
+import { XyoUserEvents } from './XyoUserEvents.ts'
+
+// we call this outside the function to force initialization on page load
+let instance: XyoUserEvents
+
+export const getXyoUserEvents = (mixpanelToken?: string) => {
+  return instance = instance ?? XyoUserEvents.get(mixpanelToken ? mixpanel.init(mixpanelToken) : undefined)
+}

package/src/hooks/index.ts

@@ -0,0 +1 @@
+export * from './useXyoUserEvents.ts'

package/src/hooks/useXyoUserEvents.ts

@@ -0,0 +1,7 @@
+import { useUserEvents } from '@xylabs/react-pixel'
+
+import type { XyoUserEvents } from '../XyoUserEvents.ts'
+
+export const useXyoUserEvents = () => {
+  return useUserEvents(true) as XyoUserEvents
+}

package/src/index.ts

@@ -0,0 +1,4 @@
+export * from './hooks/index.ts'
+export * from './XyoEventHandler.ts'
+export * from './XyoEventHandlerInterface.ts'
+export { XyoUserEvents } from './XyoUserEvents.ts'

package/typedoc.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://typedoc.org/schema.json",
+  "entryPoints": ["src/index.ts"],
+  "tsconfig": "./tsconfig.typedoc.json"
+}

package/xy.config.ts

@@ -0,0 +1,10 @@
+import type { XyTsupConfig } from '@xylabs/ts-scripts-yarn3'
+const config: XyTsupConfig = {
+  compile: {
+    browser: { src: true },
+    node: {},
+    neutral: {},
+  },
+}
+
+export default config