@memori.ai/memori-react 8.25.0 → 8.27.0

package/src/components/MemoriWidget/MemoriWidget.tsx

@@ -115,6 +115,14 @@ const getMemoriState = (integrationId?: string): object | null => {
   };
 };
 
+/** Place spec with all nulls for postTextEnteredEvent when position is not set or user chose "I don't want to provide my position". */
+const NULL_PLACE_SPEC = {
+  placeName: null,
+  latitude: null,
+  longitude: null,
+  uncertaintyKm: null,
+} as const;
+
 type MemoriTextEnteredEvent = CustomEvent<{
   text: string;
   waitForPrevious?: boolean;
@@ -729,31 +737,60 @@ const MemoriWidget = ({
    * Position drawer
    */
   const [position, _setPosition] = useState<Venue>();
-  const applyPosition = async (venue?: Venue, sessionID?: string) => {
-    const session = sessionID ?? sessionId;
-    // Only apply position if memori.needsPosition is true
-    if (venue && session && memori.needsPosition) {
-      const { currentState, ...response } = await postPlaceChangedEvent({
-        sessionId: session,
-        placeName: venue.placeName,
-        latitude: venue.latitude,
-        longitude: venue.longitude,
-        uncertaintyKm: venue.uncertainty ?? 0,
-      });
 
-      if (currentState && response.resultCode === 0) {
-        _setCurrentDialogState(cds => ({
-          ...cds,
-          ...currentState,
-          hints: currentState.hints?.length ? currentState.hints : cds?.hints,
-        }));
-      }
+  /** True when the user has set a real position; false when position is missing or "I don't want to provide my position". */
+  const hasUserProvidedPosition = useCallback((venue: Venue | undefined) => {
+    if (!venue) return false;
+    if (
+      venue.placeName === 'Position' &&
+      venue.latitude === 0 &&
+      venue.longitude === 0
+    ) {
+      return false;
     }
-  };
+    return true;
+  }, []);
+
+  /** Build optional place for EnterTextSpecs (placeName and/or lat/lon; lat/lon must be together). */
+  const buildEnterTextPlace = useCallback((venue: Venue | undefined) => {
+    if (!venue) return undefined;
+    const place: {
+      placeName?: string;
+      latitude?: number;
+      longitude?: number;
+      uncertaintyKm?: number;
+    } = {};
+    if (
+      venue.latitude != null &&
+      venue.longitude != null
+    ) {
+      place.latitude = venue.latitude;
+      place.longitude = venue.longitude;
+      if (venue.placeName) place.placeName = venue.placeName;
+      if (
+        venue.uncertainty != null &&
+        venue.uncertainty > 0
+      )
+        place.uncertaintyKm = venue.uncertainty;
+    } else if (venue.placeName) {
+      place.placeName = venue.placeName;
+    }
+    return Object.keys(place).length > 0 ? place : undefined;
+  }, []);
+
+  /** Place to send with postTextEnteredEvent: real place, nulls when no/declined position, or undefined when position not needed. */
+  const getPlaceSpecForEnterText = useCallback(
+    (venue: Venue | undefined) => {
+      if (!memori.needsPosition) return undefined;
+      return hasUserProvidedPosition(venue)
+        ? buildEnterTextPlace(venue)
+        : NULL_PLACE_SPEC;
+    },
+    [memori.needsPosition, hasUserProvidedPosition, buildEnterTextPlace]
+  );
 
   const setPosition = (venue?: Venue) => {
     _setPosition(venue);
-    applyPosition(venue);
 
     // Only save position to local config if memori.needsPosition is true
     if (venue && memori.needsPosition) {
@@ -834,10 +871,6 @@ const MemoriWidget = ({
       (window.getMemoriState() as MemoriSession)?.sessionID;
     if (!sessionID || !text?.length) return;
 
-    if (memori.needsDateTime) {
-      await sendDateChangedEvent({ sessionID: sessionID });
-    }
-
     // Build full message text (same as what will be sent) so we can run PII check on it.
     // Order: user text -> optional translation -> appended document attachment content.
     let msg = text;
@@ -926,9 +959,14 @@ const MemoriWidget = ({
       //     '"></chat-reference>';
       // }
 
+      const placeSpec = getPlaceSpecForEnterText(position);
       const { currentState, ...response } = await postTextEnteredEvent({
         sessionId: sessionID,
         text: msg,
+        ...(memori.needsDateTime && {
+          dateUTC: DateTime.utc().toISO() ?? undefined,
+        }),
+        ...(placeSpec !== undefined && { place: placeSpec }),
       });
       if (response.resultCode === 0 && currentState) {
         setChatLogID(undefined);
@@ -1405,16 +1443,6 @@ const MemoriWidget = ({
           setInstruct(false);
         }
 
-        if (position && memori.needsPosition)
-          applyPosition(position, session.sessionID);
-
-        if (memori.needsDateTime) {
-          await sendDateChangedEvent({
-            sessionID: session.sessionID,
-            state: session?.currentState,
-          });
-        }
-
         setLoading(false);
         return {
           dialogState: session.currentState,
@@ -1638,16 +1666,6 @@ const MemoriWidget = ({
           }
         }
 
-        // Apply position and date settings if needed
-        if (position && memori.needsPosition) {
-          // console.log('[REOPEN_SESSION] Applying position');
-          applyPosition(position, sessionID);
-        }
-        if (memori.needsDateTime) {
-          // console.log('[REOPEN_SESSION] Sending date changed event');
-          sendDateChangedEvent({ sessionID: sessionID, state: currentState });
-        }
-
         setLoading(false);
         return {
           dialogState: currentState,
@@ -1707,9 +1725,14 @@ const MemoriWidget = ({
           pin &&
           (currentState.state === 'X1a' || currentState.state === 'X1b')
         ) {
+          const placeSpec = getPlaceSpecForEnterText(position);
           const { resultCode: textResultCode } = await postTextEnteredEvent({
             sessionId,
             text: pin ?? '',
+            ...(memori.needsDateTime && {
+              dateUTC: DateTime.utc().toISO() ?? undefined,
+            }),
+            ...(placeSpec !== undefined && { place: placeSpec }),
           });
           textResult = textResultCode;
         }
@@ -1786,49 +1809,6 @@ const MemoriWidget = ({
     return null;
   };
 
-  /**
-   * Polling dates
-   */
-  const sendDateChangedEvent = useCallback(
-    async ({
-      sessionID,
-      date,
-      state,
-    }: {
-      sessionID?: string;
-      date?: string;
-      state?: DialogState;
-    }) => {
-      const session = sessionID ?? sessionId;
-      const dialogState = state ?? currentDialogState;
-
-      if (!session || !memori.needsDateTime || dialogState?.hints?.length) {
-        return;
-      }
-
-      const now = (date ? DateTime.fromISO(date) : DateTime.now())
-        .toUTC()
-        .toFormat('yyyy/MM/dd HH:mm:ss ZZ')
-        .split(':')
-        .slice(0, -1)
-        .join(':');
-
-      const { currentState, ...response } = await postDateChangedEvent(
-        session,
-        now
-      );
-
-      if (response.resultCode === 0 && currentState) {
-        _setCurrentDialogState(cds => ({
-          ...cds,
-          ...currentState,
-          hints: currentState.hints?.length ? currentState.hints : cds?.hints,
-        }));
-      }
-    },
-    [currentDialogState, memori.needsDateTime, sessionId]
-  );
-
   /**
    * Timeout conversazione
    */
@@ -2527,14 +2507,6 @@ const MemoriWidget = ({
         // reset history
         setHistory([]);
 
-        // date and place events
-        if (position && memori.needsPosition) {
-          applyPosition(position, sessionID);
-        }
-        if (memori.needsDateTime) {
-          sendDateChangedEvent({ sessionID: sessionID, state: currentState });
-        }
-
         // Handle personification tag changes
         if (
           personification &&
@@ -2698,9 +2670,14 @@ const MemoriWidget = ({
             setMemoriTyping(true);
 
             // we have no chat history, we start by initial question
+            const placeSpec = getPlaceSpecForEnterText(position);
             const response = await postTextEnteredEvent({
               sessionId: sessionID!,
               text: initialQuestion,
+              ...(memori.needsDateTime && {
+                dateUTC: DateTime.utc().toISO() ?? undefined,
+              }),
+              ...(placeSpec !== undefined && { place: placeSpec }),
             });
 
             // Handle 500 error from TextEnteredEvent
@@ -2729,13 +2706,6 @@ const MemoriWidget = ({
           }
         }
 
-        // date and place events
-        if (position && memori.needsPosition) {
-          applyPosition(position, sessionID);
-        }
-        if (memori.needsDateTime) {
-          sendDateChangedEvent({ sessionID: sessionID, state: currentState });
-        }
       }
       // Default case - just translate and activate
       else {
@@ -3328,13 +3298,17 @@ const MemoriWidget = ({
           open={!!showPositionDrawer}
           venue={position}
           setVenue={setPosition}
-          onClose={position => {
-            if (position) applyPosition(position);
+          onClose={() => {
             setShowPositionDrawer(false);
             if (autoStart) {
               onClickStart();
             }
           }}
+          drawerClassName={
+            selectedLayout === 'WEBSITE_ASSISTANT'
+              ? 'memori-drawer--above-website-assistant'
+              : undefined
+          }
         />
       )}
 
@@ -3367,6 +3341,11 @@ const MemoriWidget = ({
           user={user}
           loginToken={loginToken}
           onClose={() => setShowLoginDrawer(false)}
+          drawerClassName={
+            selectedLayout === 'WEBSITE_ASSISTANT'
+              ? 'memori-drawer--above-website-assistant'
+              : undefined
+          }
           onLogin={(user, token) => {
             //The user is logged in, so we need to set open a new session with the new token
             reopenSession(

package/src/components/PositionDrawer/PositionDrawer.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Memori, Venue } from '@memori.ai/memori-api-client/dist/types';
 import Drawer from '../ui/Drawer';
 import { useTranslation } from 'react-i18next';
+import cx from 'classnames';
 import VenueWidget from '../VenueWidget/VenueWidget';
 
 export interface Props {
@@ -10,14 +11,23 @@ export interface Props {
   onClose: (venue?: Venue) => void;
   venue?: Venue;
   setVenue: (venue: Venue) => void;
+  /** Optional class for the drawer root (e.g. for z-index when layout is WEBSITE_ASSISTANT). */
+  drawerClassName?: string;
 }
 
-const PositionDrawer = ({ memori, open, onClose, venue, setVenue }: Props) => {
+const PositionDrawer = ({
+  memori,
+  open,
+  onClose,
+  venue,
+  setVenue,
+  drawerClassName,
+}: Props) => {
   const { t } = useTranslation();
 
   return (
     <Drawer
-      className="memori-position-drawer"
+      className={cx('memori-position-drawer', drawerClassName)}
       open={open}
       onClose={() => onClose(venue)}
       title={t('widget.position') || 'Position'}

package/src/components/layouts/layouts.stories.tsx

@@ -145,29 +145,27 @@ WebsiteAssistant2.args = {
   apiURL: 'https://backend.memori.ai',
   baseURL: 'https://exmachina.aclambda.online',
   uiLang: 'IT',
+  avatar3dHidden: true,
   spokenLang: 'IT',
   layout: 'WEBSITE_ASSISTANT',
 };
 
 export const WebsiteAssistant3 = Template.bind({});
 WebsiteAssistant3.args = {
-  memoriName: 'FestinaLente',
-  memoriID: 'c0ab75e2-4c56-41dc-9df6-58fa7959cda3',
-  ownerUserID: 'cca0733c-9f24-4f1c-a3e3-99675cbb729f',
-  tenantID: 'firenzesmart.aclambda.online',
-  engineURL: 'https://engine.memori.ai',
-  apiURL: 'https://backend.memori.ai',
-  baseURL: 'https://firenzesmart.aclambda.online',
-  uiLang: 'IT',
-  spokenLang: 'IT',
-  integrationID: '35a9e856-0333-4543-a428-bfe4d8025027',
-  layout: 'WEBSITE_ASSISTANT',
-  showSettings: false,
-  showClear: false,
-  showTypingText: false,
-  showOnlyLastMessages: false,
-  showTranslationOriginal: false,
-  showCopyButton: false,
+  memoriName: "Layout Storybook",
+  ownerUserName: "Andrea-Patini",
+  memoriID: "ae20fc5a-cc15-4db9-b7dd-2cd4a621b85e",
+  ownerUserID: "91dbc9ba-b684-4fbe-9828-b5980af6cda9",
+  tenantID: "aisuru-staging.aclambda.online",
+  engineURL: "https://engine-staging.memori.ai/memori/v2",
+  apiURL: "https://backend-staging.memori.ai/api/v2",
+  baseURL: "http://localhost:3000",
+  layout: "WEBSITE_ASSISTANT",
+  avatar3dHidden: true,
+  uiLang: "IT",
+  spokenLang: "IT",
+  showOnlyLastMessages: true,
+  integrationID: "716f4728-919c-4015-aae1-88998a081c6f",
 };
 
 

package/src/components/layouts/website-assistant.css

@@ -152,6 +152,16 @@
     font-size: 14px;
 }
 
+/*
+ * Login and Position drawers are portaled to body by Headless UI.
+ * When layout is WEBSITE_ASSISTANT we pass drawerClassName so they sit above the fixed panel.
+ */
+.memori-drawer.memori-drawer--above-website-assistant,
+.memori-drawer.memori-drawer--above-website-assistant .memori-drawer--backdrop,
+.memori-drawer.memori-drawer--above-website-assistant .memori-drawer--container {
+    z-index: 2147483648;
+}
+
 .memori-widget.memori-layout-website_assistant .memori-website_assistant--collapsed,
 .memori-widget.memori-layout-website_assistant .memori-website_assistant--expanded {
     position: fixed;
@@ -300,6 +310,7 @@
     z-index: 1000;
     display: inline-flex;
     width: auto;
+    max-width: 60px;
     height: auto;
     flex-direction: column;
     padding: 0.5rem;
@@ -333,9 +344,11 @@
     margin-left: 0;
 }
 
+/* Position dropdown below the trigger so it does not cover the share button */
 .memori-widget.memori-layout-website_assistant .memori-share-button .memori-share-button--overlay {
-    z-index: 1000;
-    top: -6rem;
+    z-index: 1002;
+    top: 100%;
+    margin-top: 0.5rem;
 }
 
 .memori-widget.memori-layout-website_assistant .memori-header--button--fullscreen {

package/src/version.ts

@@ -1,2 +1,2 @@
 // This file is auto-generated. Do not edit manually.
-export const version = '8.25.0';
+export const version = '8.27.0';