@envive-ai/react-hooks 0.1.0

package/src/interceptors/useMessageInterceptor.ts

@@ -0,0 +1,32 @@
+import { FormType, ResponseCategory } from '@spiffy-ai/commerce-api-client';
+import { useMemo } from 'react';
+import { Response } from 'src/application/models';
+import { useFormEscalation } from './useFormEscalation';
+import { MessageInterceptor } from './types';
+
+export const useMessageInterceptor = () => {
+  const formEscalation = useFormEscalation();
+
+  const interceptorMap = useMemo(() => {
+    const interceptors = new Map<FormType, MessageInterceptor>();
+    interceptors.set(FormType.Escalation, formEscalation);
+    return interceptors;
+  }, []);
+
+  const intercept = (response?: Response) => {
+    if (response?.category === ResponseCategory.Form) {
+      const formType = response.attributes.formCategory?.formType;
+      if (formType) {
+        const interceptor = interceptorMap.get(formType);
+        interceptor?.execute(response);
+        return interceptor?.blockExecution();
+      }
+    }
+
+    return false;
+  };
+
+  return {
+    intercept,
+  };
+};

package/src/main.ts

@@ -0,0 +1,85 @@
+import Logger from "./application/logging/logger";
+import { EventsDispatcher, SpiffyEvent } from "./events";
+import { PerfMetricsEvents, logPerfMetricAtom } from "./atoms/chat";
+import { getAtomStore } from "./atoms/atomStore";
+import { getAsyncOrgConfig } from "./atoms/org";
+import {
+  getOrgInfo as getOrgInfoFromSupportedOrgs,
+  VariantInfo,
+} from "./application/models";
+import { EnvironmentService } from "./application/service/environmentService";
+import { OrgInfo } from "./types";
+import { prepareMerchantPage } from "./application/utils/merchantUtils";
+import { hasParsedVariantInfoAtom } from "./atoms/app/variant";
+
+declare global {
+  interface Window {
+    dataLayer: any;
+    gtag: (...args: any[]) => void;
+  }
+}
+
+const getOrgInfo = async (): Promise<OrgInfo> => {
+  const orgConfig = await getAsyncOrgConfig();
+
+  if (!orgConfig.org) {
+    throw new Error("orgConfig.org is required but is undefined");
+  }
+
+  const orgShortName = orgConfig.org.org.shortName;
+
+  if (!orgShortName) {
+    throw new Error("orgShortName is required but is undefined");
+  }
+
+  const orgInfo = await getOrgInfoFromSupportedOrgs(orgShortName);
+
+  if (!orgInfo) {
+    throw new Error(
+      `no matching OrgInfo found for orgShortName=${orgShortName}`
+    );
+  }
+
+  return {
+    name: orgInfo.name,
+    domain: orgInfo.domain,
+    defaultProductId: orgInfo.defaultProductId,
+    alwaysEnabledMerchants: orgInfo.alwaysEnabledMerchants,
+    orgPageConfig: orgInfo.orgPageConfig,
+  };
+};
+
+export const initApp = async () => {
+  const atomStore = getAtomStore();
+  atomStore.set(logPerfMetricAtom, PerfMetricsEvents.MainBundleLoaded);
+  EventsDispatcher.dispatch(SpiffyEvent.APP_INITIALIZED);
+  EventsDispatcher.dispatch(SpiffyEvent.CALL_MERCHANT_APP);
+  prepareMerchantPage();
+  await getAsyncOrgConfig();
+
+  // container to render the chat
+  // const reactContainerRoot = createReactRoot();
+
+  const existing = window[EnvironmentService.getIdentifyingPrefix()] || {};
+  window[EnvironmentService.getIdentifyingPrefix()] = {
+    ...existing,
+    getOrgInfo,
+    isInitialized: true,
+    refresh: async () => {
+      Logger.logDebug("[spiffy-ai] window._spiffy.refresh called");
+    },
+    setVariantInfoOverride: (variantInfo: VariantInfo) => {
+      window._spiffy.variantInfoOverride = variantInfo;
+      // Reset the variant info to force a re-parse
+      atomStore.set(hasParsedVariantInfoAtom, false);
+    },
+  };
+};
+
+// #if (VITE_SPLIT_BUILD=="true")
+export {
+  tellExtensionAboutInjectionError,
+  tellExtensionInjectionIsLoading,
+  tellExtensionAboutSuccessfullInjection,
+} from "src/extension";
+// #endif

package/src/main.tsx

@@ -0,0 +1,123 @@
+import ReactDOM from "react-dom/client";
+import Logger from "./application/logging/logger";
+import { EventsDispatcher, SpiffyEvent } from "./events";
+import { PerfMetricsEvents, logPerfMetricAtom } from "./atoms/chat";
+import { getAtomStore } from "./atoms/atomStore";
+import { getAsyncOrgConfig } from "./atoms/org";
+import {
+  getOrgInfo as getOrgInfoFromSupportedOrgs,
+  VariantInfo,
+} from "./application/models";
+import { EnvironmentService } from "./application/service/environmentService";
+import { OrgInfo } from "./types";
+import { prepareMerchantPage } from "./application/utils/merchantUtils";
+import { CONTAINER_ID, FLOATING_BUTTON_ID } from "./config/divIds";
+import { hasParsedVariantInfoAtom } from "./atoms/app/variant";
+import { EnviveConfigProvider } from "./contexts/enviveConfigContext";
+import React from "react";
+
+declare global {
+  interface Window {
+    dataLayer: any;
+    gtag: (...args: any[]) => void;
+  }
+}
+
+const createFloatingButtonContainer = () => {
+  const floatingButtonRoot = document.createElement("div");
+  floatingButtonRoot.id = FLOATING_BUTTON_ID;
+  floatingButtonRoot.style.position = "fixed";
+  floatingButtonRoot.style.zIndex = "1000";
+  floatingButtonRoot.style.display = "block";
+  document.body.appendChild(floatingButtonRoot);
+  return floatingButtonRoot;
+};
+
+const createReactRoot = () => {
+  const containerRoot = document.createElement("div");
+  containerRoot.id = CONTAINER_ID;
+  containerRoot.style.display = "none";
+  document.body.appendChild(containerRoot);
+  const reactContainerRoot = ReactDOM.createRoot(containerRoot);
+  return reactContainerRoot;
+};
+
+const getOrgInfo = async (): Promise<OrgInfo> => {
+  const orgConfig = await getAsyncOrgConfig();
+
+  if (!orgConfig.org) {
+    throw new Error("orgConfig.org is required but is undefined");
+  }
+
+  const orgShortName = orgConfig.org.org.shortName;
+
+  if (!orgShortName) {
+    throw new Error("orgShortName is required but is undefined");
+  }
+
+  const orgInfo = await getOrgInfoFromSupportedOrgs(orgShortName);
+
+  if (!orgInfo) {
+    throw new Error(
+      `no matching OrgInfo found for orgShortName=${orgShortName}`
+    );
+  }
+
+  return {
+    name: orgInfo.name,
+    domain: orgInfo.domain,
+    defaultProductId: orgInfo.defaultProductId,
+    alwaysEnabledMerchants: orgInfo.alwaysEnabledMerchants,
+    orgPageConfig: orgInfo.orgPageConfig,
+  };
+};
+
+const RootApp: React.FC = () => {
+  const atomStore = getAtomStore();
+  atomStore.set(logPerfMetricAtom, PerfMetricsEvents.MainBundleLoaded);
+  EventsDispatcher.dispatch(SpiffyEvent.APP_INITIALIZED);
+  EventsDispatcher.dispatch(SpiffyEvent.CALL_MERCHANT_APP);
+  prepareMerchantPage();
+  // getAsyncOrgConfig will now use the context
+  getAsyncOrgConfig();
+
+  // container to render the chat
+  // const reactContainerRoot = createReactRoot();
+  createFloatingButtonContainer();
+
+  const existing = window[EnvironmentService.getIdentifyingPrefix()] || {};
+  window[EnvironmentService.getIdentifyingPrefix()] = {
+    ...existing,
+    getOrgInfo,
+    isInitialized: true,
+    refresh: async () => {
+      Logger.logDebug("[spiffy-ai] window._spiffy.refresh called");
+    },
+    setVariantInfoOverride: (variantInfo: VariantInfo) => {
+      window._spiffy.variantInfoOverride = variantInfo;
+      // Reset the variant info to force a re-parse
+      atomStore.set(hasParsedVariantInfoAtom, false);
+    },
+  };
+
+  return null; // This component primarily sets up global state and side effects
+};
+
+export const initApp = async () => {
+  const reactContainerRoot = createReactRoot();
+  reactContainerRoot.render(
+    <EnviveConfigProvider
+      amplitudeApiKey={process.env.AMPLITUDE_API_KEY || ""}
+      dataResidency={process.env.DATA_RESIDENCY || ""}
+      env={process.env.ENV || ""}
+      baseUrl={process.env.BASE_URL || ""}
+      reactAppName={process.env.REACT_APP_NAME || ""}
+      cdnUrl={process.env.SPIFFY_CDN_URL || ""}
+      contextSource={process.env.CONTEXT_SOURCE || ""}
+      orgLevelApiKey={process.env.SPIFFY_ORG_LEVEL_API_KEY || ""}
+      orgShortName={process.env.ORG_SHORT_NAME || ""}
+    >
+      <RootApp />
+    </EnviveConfigProvider>
+  );
+};