@envive-ai/react-hooks 0.1.0

package/src/adapters/spiffy/commerce/graphql.ts

@@ -0,0 +1,184 @@
+import Logger from 'src/application/logging/logger';
+import { ColorMapping } from 'src/application/models/colorsConfig';
+import { FrontendConfig } from 'src/application/models/frontendConfig';
+import {
+  getMerchantColorsQuery,
+  GetMerchantColorsQueryData,
+  getMerchantFrontendConfigQuery,
+  GetMerchantFrontendConfigQueryData,
+} from 'src/application/models/graphql';
+import { getMerchantOrgIdQuery } from 'src/application/models/graphql/queries/getMerchantOrgIdQuery';
+import { isGraphQLColorsConfig } from 'src/application/models/guards/graphQL/isGraphQLColorsConfig';
+import { validateGraphQLColorsConfig } from 'src/application/models/validators/validateGraphQLColorsConfig';
+import { validateGraphQLFrontendConfig } from 'src/application/models/validators/validateGraphQLFrontendConfig';
+import { validateGraphQLOrgId } from 'src/application/models/validators/validateGraphQLOrgId';
+import { EnvironmentService } from 'src/application/service/environmentService';
+import { getQueryParam } from 'src/application/utils/urlsParser';
+import { getAtomStore } from 'src/atoms/atomStore';
+import { apiKeyAtom } from 'src/atoms/org/org';
+
+export const configVersion = () =>
+  getQueryParam('spiffy_config_version') || getQueryParam('envive_config_version') || 'deployed';
+
+const colorsAndFrontendConfigQuery = () => `
+  query ($version: String = "${configVersion()}") {
+    me {
+      getProductsConfigByVersion(version: $version) {
+        frontend { values }
+        colors { values }
+      }
+    }
+  }
+`;
+interface BaseMeConfigQueryResponse {
+  me: {
+    org?: {
+      id: string;
+    };
+    getProductsConfigByVersion?: {
+      frontend?: { values: GetMerchantFrontendConfigQueryData };
+      colors?: { values: GetMerchantColorsQueryData };
+    };
+  };
+}
+
+class GraphQLClient {
+  private static instance: GraphQLClient | undefined;
+
+  private readonly apiKey: string;
+
+  private readonly basePath: string;
+
+  static readonly setInstance = (apiKey: string, basePath: string) => {
+    GraphQLClient.instance = new GraphQLClient(apiKey, basePath);
+  };
+
+  private static readonly getInstance = (): GraphQLClient => {
+    if (!GraphQLClient.instance) {
+      const atomStore = getAtomStore();
+      const apiKey = atomStore.get(apiKeyAtom);
+      GraphQLClient.instance = new GraphQLClient(apiKey, EnvironmentService.getApiEndpoint());
+    }
+
+    return GraphQLClient.instance;
+  };
+
+  private constructor(apiKey: string, basePath: string) {
+    this.apiKey = apiKey;
+    this.basePath = basePath;
+  }
+
+  private async executeQuery<T>(query: string, variables?: Record<string, unknown>): Promise<T> {
+    const response = await fetch(`${this.basePath}/v1/graphql`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        Authorization: `Bearer ${this.apiKey}`,
+      },
+      body: JSON.stringify({
+        query,
+        variables,
+      }),
+    });
+
+    if (!response.ok) {
+      throw new Error(`GraphQL request failed: ${response.statusText}`);
+    }
+
+    const result = await response.json();
+
+    if (result.errors) {
+      throw new Error(`GraphQL errors: ${JSON.stringify(result.errors)}`);
+    }
+
+    return result.data;
+  }
+
+  static readonly getOrgId = async (): Promise<string | undefined> => {
+    const query = getMerchantOrgIdQuery;
+    if (!query) {
+      throw new Error('Org id query is not defined');
+    }
+
+    const response =
+      await GraphQLClient.getInstance().executeQuery<BaseMeConfigQueryResponse>(query);
+
+    return validateGraphQLOrgId(response.me.org?.id);
+  };
+
+  static readonly getColorsAndFrontendConfig = async (): Promise<{
+    colorsConfig?: ColorMapping;
+    frontendConfig?: FrontendConfig;
+  }> => {
+    try {
+      const query = colorsAndFrontendConfigQuery();
+      if (!query) {
+        throw new Error('Colors and frontend config query is not defined');
+      }
+
+      const response =
+        await GraphQLClient.getInstance().executeQuery<BaseMeConfigQueryResponse>(query);
+
+      return {
+        colorsConfig: validateGraphQLColorsConfig(
+          response.me.getProductsConfigByVersion?.colors?.values,
+        ),
+        frontendConfig: validateGraphQLFrontendConfig(
+          response.me.getProductsConfigByVersion?.frontend?.values,
+        ),
+      };
+    } catch (err) {
+      Logger.logError('Error fetching graphql colors and frontend config', err);
+      return {
+        colorsConfig: undefined,
+        frontendConfig: undefined,
+      };
+    }
+  };
+
+  static readonly getFrontendConfig = async (): Promise<FrontendConfig | undefined> => {
+    try {
+      const query = getMerchantFrontendConfigQuery();
+      if (!query) {
+        throw new Error('Frontend config query is not defined');
+      }
+
+      const response =
+        await GraphQLClient.getInstance().executeQuery<BaseMeConfigQueryResponse>(query);
+
+      if (!response.me.getProductsConfigByVersion?.frontend) {
+        throw new Error('No frontend config found');
+      }
+
+      return validateGraphQLFrontendConfig(response.me.getProductsConfigByVersion.frontend.values);
+    } catch (err) {
+      Logger.logError('Error fetching graphql frontend config', err);
+      return undefined;
+    }
+  };
+
+  static readonly getColors = async (): Promise<GetMerchantColorsQueryData | undefined> => {
+    try {
+      const query = getMerchantColorsQuery();
+      if (!query) {
+        throw new Error('Colors query is not defined');
+      }
+
+      const response =
+        await GraphQLClient.getInstance().executeQuery<BaseMeConfigQueryResponse>(query);
+
+      if (!response.me.getProductsConfigByVersion?.colors) {
+        throw new Error('No colors config found');
+      }
+
+      return isGraphQLColorsConfig(response.me.getProductsConfigByVersion.colors.values)
+        ? response.me.getProductsConfigByVersion.colors.values
+        : undefined;
+    } catch (err) {
+      Logger.logError('Error fetching graphql colors config', err);
+      return undefined;
+    }
+  };
+}
+
+export { GraphQLClient };

package/src/application/config/generalStaticConfig.ts

@@ -0,0 +1,37 @@
+import { ContextSourceEnum } from "@spiffy-ai/commerce-api-client";
+import {
+  BOTTOM_REVIEWS_BAR_ID,
+  CHAT_PREVIEW_CONTAINER_ID,
+  CONTAINER_ID,
+  FLOATING_BUTTON_ID,
+  TOP_SUGGESTION_BAR_PDP_ID,
+} from "src/config/divIds";
+import { useEnviveConfig } from "src/contexts/enviveConfigContext";
+
+class GeneralStaticConfig {
+  static readonly REVIEW_SUMMARY_ID: string = BOTTOM_REVIEWS_BAR_ID;
+
+  static readonly PDP_REVIEW_SUMMARY_ID: string = TOP_SUGGESTION_BAR_PDP_ID;
+
+  static readonly CHAT_PREVIEW_CONTAINER_ID = CHAT_PREVIEW_CONTAINER_ID;
+
+  static readonly FLOATING_BUTTON_ID = FLOATING_BUTTON_ID;
+
+  static readonly CONTAINER_ID = CONTAINER_ID;
+
+  static showDebugBar(appSource: ContextSourceEnum): boolean {
+    const { env } = useEnviveConfig();
+    const isProd = env === "prod";
+    return (
+      !isProd ||
+      appSource === ContextSourceEnum.Playground ||
+      appSource === ContextSourceEnum.Test
+    );
+  }
+
+  static getFloatingChatButtonId(): string | undefined {
+    return "spiffy-floating-button";
+  }
+}
+
+export { GeneralStaticConfig };

package/src/application/logging/logger.ts

@@ -0,0 +1,29 @@
+/* eslint-disable no-console */
+
+class Logger {
+  static logInfo(message: string, ...args: unknown[]): void {
+    console.info(`INFO: ${message}`, ...args);
+  }
+
+  static logDebug(message: string, ...args: unknown[]): void {
+    console.debug(`DEBUG: ${message}`, ...args);
+  }
+
+  static logError(
+    message: string,
+    error: unknown | undefined,
+    ...args: unknown[]
+  ): void {
+    console.error(`ERROR: ${message} error=${error}`, args);
+  }
+
+  static logWarn(
+    message: string,
+    error: unknown | undefined,
+    ...args: unknown[]
+  ): void {
+    console.warn(`WARN: ${message} error=${error}`, args);
+  }
+}
+
+export default Logger;

package/src/application/models/api/context.ts

@@ -0,0 +1,4 @@
+import { Context as ApiContext } from '@spiffy-ai/commerce-api-client';
+import { CamelCasedPropertiesDeep } from 'src/application/models/utilityTypes';
+
+export interface Context extends CamelCasedPropertiesDeep<ApiContext> {}

package/src/application/models/api/generationParams.ts

@@ -0,0 +1,4 @@
+import { GenerationParams as ApiGenerationParams } from '@spiffy-ai/commerce-api-client';
+import { CamelCasedPropertiesDeep } from 'src/application/models/utilityTypes';
+
+export interface GenerationParams extends CamelCasedPropertiesDeep<ApiGenerationParams> {}

package/src/application/models/api/nextMessageRequest.ts

@@ -0,0 +1,11 @@
+import { Context } from './context';
+import { UserEvent } from './userEvent';
+import { GenerationParams } from './generationParams';
+
+export interface NextMessageRequest {
+  id: string;
+  context: Context;
+  userEvents?: UserEvent[];
+  featureFlags?: Record<string, boolean>;
+  generationParams?: GenerationParams;
+}

package/src/application/models/api/orgAnalyticsConfig.ts

@@ -0,0 +1,19 @@
+export interface OrgAnalyticsConfig {
+  amplitude?: OrgAnalyticsAmplitudeConfig;
+  customerService?: OrgAnalyticsCustomerServiceConfig;
+  googleAnalytics?: OrgAnalyticsGoogleAnalyticsConfig;
+}
+
+export interface OrgAnalyticsAmplitudeConfig {
+  sessionReplayEnabled: boolean;
+  sessionReplaySampleRate: number;
+  trackingEnabled: boolean;
+}
+
+export interface OrgAnalyticsCustomerServiceConfig {
+  provider: string;
+}
+
+export interface OrgAnalyticsGoogleAnalyticsConfig {
+  measurementId?: string;
+}

package/src/application/models/api/orgConfigResults.ts

@@ -0,0 +1,40 @@
+import { OrganizationStatusEnum } from '@spiffy-ai/commerce-api-client';
+import { OrganizationConfig } from 'src/application/models/api/organizationConfig';
+
+export interface OrgConfigExperiment {
+  group?: string;
+  groupName?: string;
+  name?: string;
+  ruleId?: string;
+  value?: Record<string, unknown>;
+}
+
+export interface OrgConfigFeatureGate {
+  groupName?: string;
+  name?: string;
+  ruleId?: string;
+  value?: boolean;
+}
+
+export interface Organization {
+  id: string;
+  displayName: string;
+  domain: string;
+  shortName: string;
+  status: OrganizationStatusEnum;
+  createdAt?: string;
+  updatedAt?: string;
+}
+
+export interface OrganizationSettings {
+  org: Organization;
+  // this is currently not configured by the backend
+  settings: Record<string, unknown>;
+}
+
+export interface OrgConfig {
+  configs: OrganizationConfig[];
+  experiments: OrgConfigExperiment[];
+  gates: OrgConfigFeatureGate[];
+  org: OrganizationSettings;
+}

package/src/application/models/api/organizationConfig.ts

@@ -0,0 +1,12 @@
+import { OrgAnalyticsConfig } from './orgAnalyticsConfig';
+
+export interface OrganizationConfig {
+  createdAt: string;
+  namespace: string;
+  isLatest: boolean;
+  version: string;
+  updatedAt: string;
+  config: OrgAnalyticsConfig;
+  organizationId?: string;
+  id?: string;
+}

package/src/application/models/api/response.ts

@@ -0,0 +1,132 @@
+import { ResponseCategory } from '@spiffy-ai/commerce-api-client';
+import { CamelCasedPropertiesDeep } from 'src/application/models/utilityTypes';
+
+import type {
+  ProductSearchResponseAttributes as ApiProductSearchResponseAttributes,
+  ResponseProductAttributes as ApiProductResponseAttributes,
+  SearchResponseProduct as ApiSearchResponseProduct,
+  FormType,
+  FulfillmentDisplayStatus,
+} from '@spiffy-ai/commerce-api-client';
+import {
+  ApiReviewResponseAttributes,
+  ApiReviewRichInformation,
+  ApiPageResponseAttributes,
+  ApiTextResponseAttributes,
+  ApiSearchResponseAttributes,
+  ApiProductSearchFilterResponseAttributes,
+} from 'src/application/models/api/responseGenerics';
+
+// Internal types
+export interface ReviewRichInformation extends CamelCasedPropertiesDeep<ApiReviewRichInformation> {}
+
+export type AcceptableFormFieldType = 'string' | 'number' | 'boolean' | 'object' | 'array';
+
+export interface OrderItemInfo {
+  itemTitle: string;
+  itemPrice: number;
+  itemQuantity: number;
+  orderItemId: string;
+  image?: string;
+  inTransitAt?: string;
+  deliveredAt?: string;
+  estimatedDeliveryAt?: string;
+  fulfillmentDisplayStatus?: FulfillmentDisplayStatus;
+  trackingUrl?: string;
+}
+
+export interface OrderResponseAttributes {
+  category: ResponseCategory.Order;
+  attributes: {
+    orderId: string;
+    orderNumber: string;
+    createdAt: string;
+    latestEventDate: string;
+    lineItems: OrderItemInfo[];
+  };
+}
+
+export interface TextResponseAttributes {
+  category: ResponseCategory.Text;
+  attributes: CamelCasedPropertiesDeep<ApiTextResponseAttributes>;
+}
+
+export interface ProductResponseAttributes {
+  category: ResponseCategory.Product;
+  attributes: CamelCasedPropertiesDeep<
+    ApiProductResponseAttributes & {
+      filters?: {
+        [key: string]: string[];
+      };
+    }
+  >;
+}
+
+export interface SearchResponseProductAttributes {
+  category: ResponseCategory.Product;
+  attributes: CamelCasedPropertiesDeep<ApiSearchResponseProduct>;
+}
+
+export interface SearchResponseAttributes {
+  category: ResponseCategory.Text;
+  attributes: CamelCasedPropertiesDeep<ApiSearchResponseAttributes>;
+}
+
+export interface SearchProductResponseAttributes {
+  category: ResponseCategory.ProductSearch;
+  attributes: CamelCasedPropertiesDeep<ApiProductSearchResponseAttributes>;
+}
+
+export interface SearchProductFilterAttributes {
+  category: ResponseCategory.ProductSearchFilter;
+  attributes: CamelCasedPropertiesDeep<ApiProductSearchFilterResponseAttributes>;
+}
+
+export interface ReviewResponseAttributes {
+  category: ResponseCategory.Review;
+  attributes: CamelCasedPropertiesDeep<ApiReviewResponseAttributes>;
+}
+
+export interface SeparatorResponseAttributes {
+  category: ResponseCategory.Separator;
+}
+
+export interface PageResponseAttributes {
+  category: ResponseCategory.Page;
+  attributes: CamelCasedPropertiesDeep<ApiPageResponseAttributes>;
+}
+
+export interface FormResponseAttributes {
+  category: ResponseCategory.Form;
+  attributes: {
+    formCategory?: {
+      formType: FormType;
+    };
+    schema: {
+      properties: {
+        [key: string]: {
+          type: AcceptableFormFieldType;
+          title: string;
+          format?: 'email';
+        };
+      };
+      required: string[];
+    };
+  };
+}
+
+export type Response = {
+  id: string;
+  createdAt: string;
+  category: ResponseCategory;
+} & (
+  | TextResponseAttributes
+  | ProductResponseAttributes
+  | ReviewResponseAttributes
+  | SeparatorResponseAttributes
+  | PageResponseAttributes
+  | SearchProductResponseAttributes
+  | SearchProductFilterAttributes
+  | FormResponseAttributes
+  | OrderResponseAttributes
+);

package/src/application/models/api/responseGenerics.ts

@@ -0,0 +1,67 @@
+import { FormResponseAttributesFormCategory } from '@spiffy-ai/commerce-api-client';
+import { AcceptableFormFieldType } from './response';
+
+// Boundary types, these are generic objects not defined in the SDK but can be returned by the API
+// as properties of the response attributes
+export interface ApiReviewRichInformation {
+  cons?: string[];
+  pros?: string[];
+  review_date?: string;
+  reviewer_title?: string;
+  product_familiarity?: 'IVE_TESTED_IT' | 'I_OWN_IT';
+}
+
+export interface ApiTextResponseAttributes {
+  content: string;
+}
+
+export interface ApiSearchResponseAttributes {
+  search_term: string;
+  selected_filters?: string[];
+  filters?: {
+    [key: string]: string[];
+  };
+}
+
+export interface ApiSearchResponseProductAttributes {
+  response_id?: string;
+}
+
+export interface ApiProductSearchFilterResponseAttributes {
+  filter_name: string;
+}
+
+export interface ApiReviewResponseAttributes {
+  id?: string;
+  product_id?: string;
+  title?: string;
+  reviewer?: string;
+  review?: string;
+  stars?: number;
+  rich_information?: ApiReviewRichInformation;
+
+  onClick?: () => void;
+}
+
+export interface ApiPageResponseAttributes {
+  id?: string;
+  title?: string;
+  description?: string;
+  url?: string;
+}
+
+export interface ApiFormResponseSchemaAttributes {
+  properties: {
+    [key: string]: {
+      format?: 'email';
+      type: AcceptableFormFieldType;
+      title: string;
+    };
+  };
+  required: Array<keyof ApiFormResponseSchemaAttributes['properties']>;
+}
+
+export interface ApiFormResponseAttributes {
+  form_category?: FormResponseAttributesFormCategory;
+  schema: ApiFormResponseSchemaAttributes;
+}

package/src/application/models/api/search.ts

@@ -0,0 +1,26 @@
+import {
+  ProductSearchResponse as ApiProductSearchResponse,
+  ProductSearchResponseAttributes as ApiProductSearchResponseAttributes,
+  SearchResponseProduct,
+} from '@spiffy-ai/commerce-api-client';
+import { CamelCasedPropertiesDeep } from 'src/application/models/utilityTypes';
+
+// Transform API types using CamelCasedPropertiesDeep
+export interface ProductSearchResponse extends CamelCasedPropertiesDeep<ApiProductSearchResponse> {}
+export interface ProductSearchResponseAttributes
+  extends CamelCasedPropertiesDeep<ApiProductSearchResponseAttributes> {}
+
+// Custom search result interface (flattened structure)
+export interface SearchResult {
+  products: SearchResponseProduct[]; // Flattened from all responses
+  filters: string[]; // Combined from all responses
+  generatedQuery?: string;
+  totalProductCount: number;
+  searchResponseId: string;
+}
+
+// Search parameters interface
+export interface SearchParams {
+  query: string;
+  limit?: number;
+}

package/src/application/models/api/suggestion.ts

@@ -0,0 +1,4 @@
+import { Suggestion as ApiSuggestion } from '@spiffy-ai/commerce-api-client';
+import { CamelCasedPropertiesDeep } from 'src/application/models/utilityTypes';
+
+export interface Suggestion extends CamelCasedPropertiesDeep<ApiSuggestion> {}

package/src/application/models/api/supportedEventRequest.ts

@@ -0,0 +1,8 @@
+import { UserEvent } from './userEvent';
+import { Context } from './context';
+
+export interface SupportedEventRequest {
+  id: string;
+  context: Context;
+  userEvent: UserEvent;
+}

package/src/application/models/api/userEvent.ts

@@ -0,0 +1,101 @@
+import {
+  PDPAttributes as ApiPDPAttributes,
+  PLPAttributes as ApiPLPAttributes,
+  QueryTypedAttributes as ApiQueryTypedAttributes,
+  SearchAttributes as ApiSearchAttributes,
+  SuggestionClickedAttributes as ApiSuggestionClickedAttributes,
+  UserEvent as ApiUserEvent,
+  FormType,
+  PageVisitCategory,
+  UserEventCategory,
+} from '@spiffy-ai/commerce-api-client';
+import { CamelCasedPropertiesDeep } from 'src/application/models/utilityTypes';
+
+// TODO flatten these out or explore new typescript openapi generator fork
+export interface PDPAttributes extends CamelCasedPropertiesDeep<ApiPDPAttributes> {}
+
+export interface PLPAttributes extends CamelCasedPropertiesDeep<ApiPLPAttributes> {}
+
+export interface SearchAttributes extends CamelCasedPropertiesDeep<ApiSearchAttributes> {}
+
+export interface QueryTypedAttributes extends CamelCasedPropertiesDeep<ApiQueryTypedAttributes> {}
+
+export interface FormSubmittedAttributes {
+  filledSchema: Record<string, unknown>;
+  formResponseId: string;
+  formType: FormType;
+}
+
+export interface PageVisitAttributes {
+  url: string;
+  pageVisitCategory: PageVisitCategory;
+}
+
+export interface SuggestionClickedAttributes
+  extends CamelCasedPropertiesDeep<ApiSuggestionClickedAttributes> {}
+
+export type UserEventAttributes =
+  | PDPAttributes
+  | PLPAttributes
+  | QueryTypedAttributes
+  | SearchAttributes
+  | SuggestionClickedAttributes
+  | PageVisitAttributes;
+
+export interface PDPUserEvent {
+  category: UserEventCategory.PdpVisit | UserEventCategory.AddToCart;
+  attributes: PDPAttributes;
+}
+
+export interface PLPUserEvent {
+  category: UserEventCategory.PlpVisit;
+  attributes: PLPAttributes;
+}
+
+export interface QueryTypedUserEvent {
+  category: UserEventCategory.QueryTyped;
+  attributes: QueryTypedAttributes;
+}
+
+export interface SearchUserEvent {
+  category: UserEventCategory.Search;
+  attributes: SearchAttributes;
+}
+
+export interface SuggestionsClickedUserEvent {
+  category: UserEventCategory.SuggestionClicked;
+  attributes: SuggestionClickedAttributes;
+}
+
+export interface AppLoadedUserEvent {
+  category: UserEventCategory.AppLoaded;
+}
+
+export interface AppUnloadedEvent {
+  category: UserEventCategory.AppUnloaded;
+}
+
+export interface PageVisitEvent {
+  category: UserEventCategory.PageVisit;
+  attributes: PageVisitAttributes;
+}
+
+export interface FormSubmitted {
+  category: UserEventCategory.FormSubmitted;
+  attributes: FormSubmittedAttributes;
+}
+
+export type UserEvent = CamelCasedPropertiesDeep<
+  Pick<ApiUserEvent, 'event_id' | 'category' | 'created_at'>
+> &
+  (
+    | SuggestionsClickedUserEvent
+    | AppLoadedUserEvent
+    | PDPUserEvent
+    | QueryTypedUserEvent
+    | SearchUserEvent
+    | AppUnloadedEvent
+    | PLPUserEvent
+    | PageVisitEvent
+    | FormSubmitted
+  );