@envive-ai/react-hooks 0.1.0

package/src/application/utils/imageFilter.ts

@@ -0,0 +1,12 @@
+import { Message, MessageType, ProductMessageMetadata } from 'src/application/models';
+
+export const getRecentProductImageUrls = (lastMessages: Message[], currentProductId: string | undefined) => {
+  const productMessages = lastMessages
+    .filter((message) => message.type === MessageType.Product && message.metadata?.imageUrl)
+    .map((m) => m as ProductMessageMetadata);
+  // put added product image at the top of the list
+  return [
+    ...productMessages.filter((m) => m.metadata?.id === currentProductId),
+    ...productMessages.filter((m) => m.metadata?.id !== currentProductId),
+  ].map((m) => m.metadata!.imageUrl!);
+};

package/src/application/utils/index.ts

@@ -0,0 +1,3 @@
+export * from './messageFromQueryEvent';
+export * from './messageFromResponse';
+export * from './messageFromSuggestionEvent';

package/src/application/utils/merchantUtils.ts

@@ -0,0 +1,16 @@
+export const prepareMerchantPage = () => {
+  let metaViewport = document.querySelector("meta[name='viewport']");
+  if (metaViewport) {
+    const content = metaViewport.getAttribute("content")
+    const hasMaximumScale = content?.includes("maximum-scale=1")
+    if (!hasMaximumScale) {
+      metaViewport.setAttribute("content", `${content}, maximum-scale=1`)
+    }
+    return
+  }
+
+  metaViewport = document.createElement("meta");
+  metaViewport.setAttribute("name", "viewport")
+  metaViewport.setAttribute("content", "width=device-width, initial-scale=1, maximum-scale=1")
+  document.head.appendChild(metaViewport);
+}

package/src/application/utils/messageFromFormSubmittedEvent.ts

@@ -0,0 +1,31 @@
+import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
+import {
+  FormResponseAttributes,
+  Message,
+  MessageRole,
+  MessageType,
+  UserEvent,
+} from 'src/application/models';
+
+export const messageFromFormSubmittedEvent = (
+  event: UserEvent,
+  formResponseAttributes: FormResponseAttributes['attributes'],
+): Message | undefined => {
+  if (event.category !== UserEventCategory.FormSubmitted) {
+    return undefined;
+  }
+
+  const formStringContents = Object.entries(formResponseAttributes.schema.properties)
+    .map(([key, value]) => `${value.title}: ${event.attributes.filledSchema[key]}`)
+    .join('\n');
+
+  return {
+    id: event.eventId,
+    role: MessageRole.User,
+    type: MessageType.QueryTyped,
+    createdAt: event.createdAt,
+    metadata: {
+      content: formStringContents,
+    },
+  };
+};

package/src/application/utils/messageFromQueryEvent.ts

@@ -0,0 +1,38 @@
+import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
+import { Message, MessageRole, MessageType, UserEvent } from 'src/application/models';
+
+/**
+ * Transforms a query UserEvent object into a Message object for presentation.
+ *
+ * @param event The user event object received from the server
+ *
+ * @returns A Message if the event is a query event, otherwise undefined
+ */
+export const messageFromQueryEvent = (event: UserEvent): Message | undefined => {
+  if (event.category === UserEventCategory.QueryTyped) {
+    return {
+      id: event.eventId,
+      role: MessageRole.User,
+      type: MessageType.QueryTyped,
+      createdAt: event.createdAt,
+      metadata: {
+        content: event.attributes.query,
+      },
+    };
+  }
+
+  if (event.category === UserEventCategory.Search) {
+    return {
+      id: event.eventId,
+      role: MessageRole.User,
+      type: MessageType.Search,
+      createdAt: event.createdAt,
+      metadata: {
+        searchTerm: event.attributes.searchTerm || '',
+        selectedFilters: event.attributes.selectedFilters || [],
+      },
+    };
+  }
+
+  return undefined;
+};

package/src/application/utils/messageFromResponse.ts

@@ -0,0 +1,133 @@
+import { ResponseCategory } from '@spiffy-ai/commerce-api-client';
+import { Message, MessageRole, MessageType, Response } from 'src/application/models';
+
+/**
+ * Transforms a server Response object into a Message object for presentation.
+ *
+ * @param response The response object received from the server containing model generated content
+ *
+ * @returns A Message if the response contains known attributes, undefined otherwise
+ */
+export const messageFromResponse = (response?: Response): Message | undefined => {
+  if (response == null) {
+    return undefined;
+  }
+
+  if (response.category === ResponseCategory.Text) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      type: MessageType.Text,
+      role: MessageRole.Assistant,
+      metadata: {
+        content: response.attributes.content,
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.Product) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      role: MessageRole.Assistant,
+      type: MessageType.Product,
+      metadata: {
+        ...response.attributes,
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.Review) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      type: MessageType.Review,
+      role: MessageRole.Assistant,
+      metadata: {
+        review: response.attributes.review,
+        reviewer: response.attributes.reviewer,
+        stars: response.attributes.stars,
+        title: response.attributes.title,
+        richInformation: response.attributes.richInformation,
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.Separator) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      type: MessageType.Separator,
+      role: MessageRole.Assistant,
+    };
+  }
+
+  if (response.category === ResponseCategory.Page) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      role: MessageRole.Assistant,
+      type: MessageType.Page,
+      metadata: {
+        ...response.attributes,
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.ProductSearch) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      role: MessageRole.Assistant,
+      type: MessageType.ProductSearch,
+      metadata: {
+        ...response.attributes,
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.ProductSearchFilter) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      role: MessageRole.Assistant,
+      type: MessageType.ProductSearchFilter,
+      metadata: {
+        ...response.attributes,
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.Form) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      role: MessageRole.Assistant,
+      type: MessageType.Form,
+      metadata: {
+        formType: response.attributes.formCategory?.formType,
+        fields: Object.entries(response.attributes.schema.properties).map(([key, value]) => ({
+          key,
+          title: value.title,
+          type: value.type,
+          format: value.format,
+          required: response.attributes.schema.required.includes(key),
+        })),
+      },
+    };
+  }
+
+  if (response.category === ResponseCategory.Order) {
+    return {
+      id: response.id,
+      createdAt: response.createdAt,
+      role: MessageRole.Assistant,
+      type: MessageType.Order,
+      metadata: {
+        ...response.attributes,
+      },
+    };
+  }
+
+  return undefined;
+};

package/src/application/utils/messageFromSuggestionEvent.ts

@@ -0,0 +1,32 @@
+import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
+import { Message, MessageRole, MessageType, Suggestion, UserEvent } from 'src/application/models';
+
+/**
+ * Transforms a UserEvent object into a Message object for presentation.
+ *
+ * @param event The UserEvent object received from the server
+ * @param suggestions A list of generated suggestions to match the event to
+ *
+ * @returns A Message if the event is a suggestion click event, undefined otherwise
+ */
+export const messageFromSuggestionEvent = (
+  event: UserEvent,
+  suggestions: Suggestion[],
+): Message | undefined => {
+  if (event.category === UserEventCategory.SuggestionClicked) {
+    const { suggestionId } = event.attributes;
+
+    return {
+      id: event.eventId,
+      role: MessageRole.User,
+      type: MessageType.SuggestionClicked,
+      createdAt: event.createdAt,
+      metadata: {
+        suggestionId,
+        suggestionContent: suggestions.find((s) => s.id === suggestionId)?.content ?? '',
+      },
+    };
+  }
+
+  return undefined;
+};

package/src/application/utils/mouseEventTypes.ts

@@ -0,0 +1 @@
+export type MouseEventTypes = 'click' | 'dblclick' | 'mouseup' | 'mousedown';

package/src/application/utils/mutationHelper.ts

@@ -0,0 +1,51 @@
+const compareTokens = (original: string, comparison: string) => {
+  const originalTokens = new Set(original.split(' '));
+  const comparisonTokens = new Set(comparison.split(' '));
+  return [...originalTokens].filter((token) => !comparisonTokens.has(token));
+};
+
+export class MutationHelper {
+  static fireClassChange(
+    record: MutationRecord,
+    node: HTMLElement | null,
+    fn: (classes: DOMTokenList) => void,
+  ) {
+    if (node && record.oldValue !== node?.classList.value) {
+      fn(node?.classList);
+    }
+  }
+
+  static fireClassAdded(
+    record: MutationRecord,
+    node: HTMLElement | null,
+    classMap: Map<string, () => void>,
+  ) {
+    if (node && record.oldValue) {
+      const tokens = compareTokens(node?.classList.value, record.oldValue);
+      tokens.forEach((className) => classMap.get(className)?.());
+    }
+  }
+
+  static fireClassRemoved(
+    record: MutationRecord,
+    node: HTMLElement | null,
+    classMap: Map<string, () => void>,
+  ) {
+    if (node && record.oldValue) {
+      const tokens = compareTokens(record.oldValue, node?.classList.value);
+      tokens.forEach((className) => classMap.get(className)?.());
+    }
+  }
+
+  static fireSubtreeChange(nodes: NodeList, fn?: (nodes: NodeList) => void) {
+    nodes.length && fn?.(nodes);
+  }
+
+  static isClass(mutation: MutationRecord) {
+    return mutation.type === 'attributes' && mutation.attributeName === 'class';
+  }
+
+  static isChildList(mutation: MutationRecord) {
+    return mutation.type === 'childList';
+  }
+}

package/src/application/utils/nextMessageRequestToApiRequest.ts

@@ -0,0 +1,31 @@
+import { NextMessageRequest as ApiNextMessageRequest } from '@spiffy-ai/commerce-api-client';
+import { NextMessageRequest } from '../models';
+import { coreUserEventToApiUserEvent } from './coreUserEventToApiUserEvent';
+
+export const messageRequestToCommerceMessageRequest = (
+  data: NextMessageRequest,
+): ApiNextMessageRequest => ({
+  context: {
+    chat_id: data.context.chatId,
+    org_id: data.context.orgId,
+    org_short_name: data.context.orgShortName,
+    user_id: data.context.userId,
+    source: data.context.source,
+    env: data.context.env,
+  },
+  id: data.id,
+  feature_flags: data.featureFlags,
+  user_events: data.userEvents?.map((userEvent) => coreUserEventToApiUserEvent(userEvent)),
+  generation_params: {
+    model: data.generationParams?.model,
+    max_tokens: data.generationParams?.maxTokens,
+    stop: data.generationParams?.stop,
+    stream: data.generationParams?.stream,
+    temperature: data.generationParams?.temperature,
+    top_p: data.generationParams?.topP,
+    num_suggestions: data.generationParams?.numSuggestions,
+    response_system_prompt: data.generationParams?.responseSystemPrompt,
+    suggestion_system_prompt: data.generationParams?.suggestionSystemPrompt,
+    response_caching: data.generationParams?.responseCaching,
+  },
+});

package/src/application/utils/nodeSelector.ts

@@ -0,0 +1,133 @@
+export abstract class NodeSelector {
+  private pattern: string;
+  private root: Document;
+
+  constructor(pattern: string) {
+    this.pattern = pattern;
+    this.root = document;
+  }
+
+  getPattern() {
+    return this.pattern;
+  }
+
+  setRoot(root: Document) {
+    this.root = root;
+  }
+
+  getRoot() {
+    return this.root;
+  }
+
+  abstract parse(): Node | null;
+}
+
+class QuerySelector extends NodeSelector {
+  parse(): Node | null {
+    return this.getRoot().querySelector(this.getPattern());
+  }
+}
+
+class IDSelector extends NodeSelector {
+  parse(): Node | null {
+    return this.getRoot().getElementById(this.getPattern()) as Node;
+  }
+}
+
+class XpathSelector extends NodeSelector {
+  parse(): Node | null {
+    return this.getRoot()?.evaluate(
+      this.getPattern(),
+      this.getRoot(),
+      null,
+      XPathResult.FIRST_ORDERED_NODE_TYPE,
+      null,
+    )?.singleNodeValue as Node;
+  }
+}
+
+class ChainSelector extends NodeSelector {
+  parse(): Node | null {
+    let selectorIndex = 0;
+    const selectors = this.getPattern().split('@');
+    const lastIndex = selectors.length - 1;
+
+    const parseChain = (pattern: string, prevNode?: Node | null): Node | null => {
+      const selector = SelectorFactory.parse(pattern);
+
+      if (prevNode) {
+        selector.setRoot(prevNode as Document);
+      }
+
+      const currentNode = selector.parse();
+      if (selectorIndex === lastIndex) {
+        return currentNode;
+      }
+
+      let node: Node | null | undefined = currentNode || document;
+      if ((currentNode as HTMLElement)?.shadowRoot) {
+        node = (currentNode as HTMLElement).shadowRoot;
+      }
+
+      if ((currentNode as HTMLIFrameElement)?.contentWindow) {
+        node = (currentNode as HTMLIFrameElement).contentWindow?.document;
+      }
+
+      return parseChain(selectors[++selectorIndex].trim(), node);
+    };
+
+    return parseChain(selectors[selectorIndex].trim());
+  }
+}
+
+class Empty extends NodeSelector {
+  constructor() {
+    super('');
+  }
+  parse(): Node | null {
+    return null;
+  }
+}
+
+export class SelectorFactory {
+  static parse(composedSelector?: string) {
+    if (!composedSelector) {
+      return new Empty();
+    }
+
+    const split = composedSelector.split('|');
+    const type = split[0];
+    const selector = split[1];
+
+    switch (type) {
+      case 'id':
+        return this.id(selector);
+      case 'query':
+        return this.query(selector);
+      case 'xpath':
+        return this.xpath(selector);
+      default:
+        return new Empty();
+    }
+  }
+
+  static check(selector?: NodeSelector) {
+    return selector ?? new Empty();
+  }
+
+  static chain(pattern?: string) {
+    return pattern ? new ChainSelector(pattern) : new Empty();
+  }
+
+  static id(pattern?: string): NodeSelector {
+    return pattern ? new IDSelector(pattern) : new Empty();
+  }
+
+  static query(pattern?: string): NodeSelector {
+    return pattern ? new QuerySelector(pattern) : new Empty();
+  }
+
+  static xpath(pattern?: string): NodeSelector {
+    return pattern ? new XpathSelector(pattern) : new Empty();
+  }
+}

package/src/application/utils/overrides.ts

@@ -0,0 +1,196 @@
+export type ReplaceOp<T> = { $replace: T };
+export type DeleteOp = { $delete: true };
+
+// Treat these as atomic values (not recursed into)
+type Builtin = Date | RegExp | ((...args: unknown[]) => unknown);
+
+type Primitive = string | number | boolean | bigint | symbol | null | undefined;
+
+/**
+ * Override<T> is a DeepPartial-like type with special operators:
+ * - { $replace: T } to replace an entire subtree/array
+ * - { $delete: true } to delete an object key
+ *
+ * Arrays behavior:
+ * - Arrays of objects: merge-by-index by default (unless `arrayStrategy: 'replace'` or `$replace` is used)
+ * - Arrays of primitives (string/number/boolean/...): replaced by default when a patch array is provided
+ */
+export type Override<T> =
+  // atomic
+  T extends Primitive | Builtin
+    ? T | ReplaceOp<T> | DeleteOp
+    : // arrays
+      T extends (infer U)[]
+      ? Array<Override<U> | undefined> | ReplaceOp<T>
+      : // maps/sets – keep simple: only allow full replace
+        T extends Map<unknown, unknown> | Set<unknown>
+        ? ReplaceOp<T>
+        : // objects
+          T extends object
+          ? { [K in keyof T]?: Override<T[K]> | DeleteOp | null } | ReplaceOp<T>
+          : T;
+
+export type MergeOptions = {
+  /**
+   * How to treat arrays when patch provides an array (not $replace):
+   * - 'replace': always use patch array as whole value
+   * - 'mergeByIndex': merge each index recursively (default for arrays of objects)
+   * Note: Arrays of primitives are replaced by default regardless of this option.
+   */
+  arrayStrategy?: 'replace' | 'mergeByIndex';
+  /**
+   * If true, a `null` patch value deletes the key from an object (RFC 7396-ish)
+   */
+  nullDeletes?: boolean;
+};
+
+// Prevents T from being inferred from the 'patch' parameter; it must be inferred from 'base'.
+// See: https://github.com/microsoft/TypeScript/issues/14829#issuecomment-504042546
+type NoInfer<T> = [T][T extends unknown ? 0 : never];
+
+function isPlainObject(x: unknown): x is Record<string, unknown> {
+  return (
+    !!x &&
+    typeof x === 'object' &&
+    !Array.isArray(x) &&
+    !(x instanceof Date) &&
+    !(x instanceof RegExp)
+  );
+}
+
+function isReplace(x: unknown): x is ReplaceOp<unknown> {
+  return !!x && typeof x === 'object' && '$replace' in (x as Record<string, unknown>);
+}
+function isDelete(x: unknown): x is DeleteOp {
+  return !!x && typeof x === 'object' && (x as Record<string, unknown>).$delete === true;
+}
+
+function isPrimitiveValue(x: unknown): boolean {
+  const t = typeof x;
+  return (
+    x === null ||
+    t === 'string' ||
+    t === 'number' ||
+    t === 'boolean' ||
+    t === 'bigint' ||
+    t === 'symbol' ||
+    t === 'undefined'
+  );
+}
+
+function isArrayOfPrimitives(arr: unknown[]): boolean {
+  if (arr.length === 0) return false; // ambiguous, default to merge-by-index on empty
+  // If every defined element is primitive, treat as primitives
+  for (let i = 0; i < arr.length; i += 1) {
+    const v = arr[i];
+    if (v !== undefined && !isPrimitiveValue(v)) return false;
+  }
+  return true;
+}
+
+function mergeAny(baseAny: unknown, patchAny: unknown, opts: MergeOptions): unknown {
+  if (isReplace(patchAny)) return patchAny.$replace as unknown;
+  if (isDelete(patchAny)) return undefined; // caller deletes the key
+
+  if (Array.isArray(baseAny)) {
+    if (Array.isArray(patchAny)) {
+      const baseArr = baseAny as unknown[];
+      const patchArr = patchAny as unknown[];
+      const shouldReplace =
+        opts.arrayStrategy === 'replace' ||
+        isArrayOfPrimitives(baseArr) ||
+        isArrayOfPrimitives(patchArr);
+      if (shouldReplace) return patchAny as unknown;
+      const out = baseArr.slice();
+      const max = Math.max(out.length, patchArr.length);
+      for (let i = 0; i < max; i += 1) {
+        const pVal = patchArr[i];
+        if (pVal !== undefined) {
+          out[i] = mergeAny(out[i], pVal, opts);
+        }
+      }
+      return out as unknown;
+    }
+    return baseAny as unknown;
+  }
+
+  if (isPlainObject(baseAny) && isPlainObject(patchAny)) {
+    const baseObj = baseAny as Record<string, unknown>;
+    const patchObj = patchAny as Record<string, unknown>;
+    const out: Record<string, unknown> = { ...baseObj };
+    for (const key of Object.keys(patchObj)) {
+      const pVal = patchObj[key];
+      if (pVal === undefined) {
+        // leave as-is
+      } else if (opts.nullDeletes && pVal === null) {
+        delete out[key];
+      } else if (isReplace(pVal)) {
+        out[key] = pVal.$replace;
+      } else if (isDelete(pVal)) {
+        delete out[key];
+      } else {
+        out[key] = mergeAny(baseObj?.[key], pVal, opts);
+      }
+    }
+    return out as unknown;
+  }
+
+  return (patchAny as unknown) ?? baseAny;
+}
+
+export function applyOverrides<T>(
+  base: T,
+  patch: Override<NoInfer<T>>,
+  opts: MergeOptions = {},
+): T {
+  const { arrayStrategy = 'mergeByIndex', nullDeletes = false } = opts;
+
+  // Handle whole-node control operators on patch itself
+  if (isReplace(patch)) return patch.$replace as T;
+  if (isDelete(patch)) return undefined as unknown as T;
+
+  // Arrays
+  if (Array.isArray(base)) {
+    if (isReplace(patch)) return patch.$replace as T;
+    if (Array.isArray(patch)) {
+      if (arrayStrategy === 'replace') return patch as unknown as T;
+      // merge by index
+      const out = (base as unknown[]).slice();
+      const max = Math.max(out.length, patch.length);
+      for (let i = 0; i < max; i += 1) {
+        const pVal = (patch as unknown[])[i];
+        if (pVal !== undefined) {
+          out[i] = mergeAny(out[i], pVal, opts);
+        }
+      }
+      return out as unknown as T;
+    }
+    // invalid patch type for an array → ignore and return base
+    return base as T;
+  }
+
+  // Plain objects
+  if (isPlainObject(base) && isPlainObject(patch)) {
+    const out: Record<string, unknown> = { ...(base as Record<string, unknown>) };
+    const patchObj = patch as Record<string, unknown>;
+    for (const key of Object.keys(patchObj)) {
+      const pVal = patchObj[key];
+      if (pVal === undefined) {
+        // leave existing value
+      } else if (nullDeletes && pVal === null) {
+        delete out[key];
+      } else if (isReplace(pVal)) {
+        out[key] = pVal.$replace;
+      } else if (isDelete(pVal)) {
+        delete out[key];
+      } else {
+        const bVal = (base as Record<string, unknown>)[key];
+        out[key] = mergeAny(bVal, pVal, opts);
+      }
+    }
+    return out as unknown as T;
+  }
+
+  // For primitives or when patch is primitive, patch wins if defined
+  return ((patch as unknown) ?? base) as T;
+}