@memori.ai/memori-react 6.8.1 → 6.8.4

package/src/helpers/utils.ts

@@ -1,7 +1,14 @@
 import { useState, useEffect, useRef, useMemo } from 'react';
+import { Material, MeshStandardMaterial, SkinnedMesh } from 'three';
+import * as THREE from 'three';
 
 export const hasTouchscreen = (): boolean => {
   let hasTouchScreen = false;
+
+  if (typeof window === 'undefined' || typeof navigator === 'undefined') {
+    return hasTouchScreen;
+  }
+
   if ('maxTouchPoints' in navigator) {
     hasTouchScreen = navigator.maxTouchPoints > 0;
   } else if ('msMaxTouchPoints' in navigator) {
@@ -61,6 +68,27 @@ export const isAndroid = (): boolean => {
   return isAndroid;
 };
 
+export const isSafari = (): boolean => {
+  if (typeof navigator === 'undefined') return false;
+  
+  const userAgent = navigator.userAgent;
+  const isSafariUA = userAgent.includes('Safari') && !userAgent.includes('Chrome');
+  const isWebKit = 'WebKit' in window && !('Chrome' in window);
+  
+  return isSafariUA || isWebKit;
+};
+
+export const isSafariIOS = (): boolean => {
+  if (typeof navigator === 'undefined') return false;
+  
+  const userAgent = navigator.userAgent;
+  return (
+    userAgent.includes('Safari') &&
+    !userAgent.includes('Chrome') &&
+    /iPad|iPhone|iPod/.test(userAgent)
+  );
+};
+
 export const pwdRegEx =
   // eslint-disable-next-line no-useless-escape
   /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$_:;|,~+=\{\}\[\]%^&*-]).{8,}$/;
@@ -148,6 +176,7 @@ export const stripEmojis = (text: string) => {
 
 export const stripMarkdown = (text: string) => {
   // Remove code blocks
+  text = text.replaceAll(/```*?```/g, '');
   text = text.replaceAll(/```[\s\S]*?```/g, '');
   // Remove inline code
   text = text.replaceAll(/`[^`]*`/g, '');
@@ -180,6 +209,38 @@ export const stripMarkdown = (text: string) => {
   return text;
 };
 
+export const stripOutputTags = (text: string): string => {
+  const outputTagRegex = /<output.*?<\/output>/gs;
+
+  if (!outputTagRegex.test(text)) {
+    return text;
+  }
+
+  const strippedText = text.replace(outputTagRegex, '');
+
+  // Recursively strip nested output tags
+  return stripOutputTags(strippedText);
+};
+
+export const stripReasoningTags = (text: string) => {
+  const reasoningTagRegex = /<think.*?<\/think>/gs;
+
+  if (!reasoningTagRegex.test(text)) {
+    return text;
+  }
+
+  const strippedText = text.replace(reasoningTagRegex, '');
+
+  // Recursively strip nested reasoning tags
+  return stripOutputTags(strippedText);
+};
+
+export const stripHTML = (text: string) => {
+  const el = document.createElement('div');
+  el.innerHTML = text;
+  return el.textContent || '';
+};
+
 export const escapeHTML = (text: string) => {
   const el = document.createElement('textarea');
   el.textContent = text;
@@ -201,6 +262,29 @@ export const getFieldFromCustomData = (
   }
 };
 
+const MAX_MSG_CHARS = 4000;
+
+const MAX_MSG_WORDS = 300;
+
+export const truncateMessage = (message: string) => {
+
+  let truncatedMessage = message;
+
+  if (message.length > MAX_MSG_CHARS) {
+    truncatedMessage = `${message.slice(0, MAX_MSG_CHARS)}\n<br />...`;
+  }
+
+  if (truncatedMessage.split(' ').length > MAX_MSG_WORDS) {
+    truncatedMessage = truncatedMessage
+      .split(' ')
+      .slice(0, MAX_MSG_WORDS)
+      .join(' ')
+      .concat('\n<br/>...');
+  }
+
+  return truncatedMessage;
+};
+
 export const stripObjNulls = (obj: { [key: string]: any }) => {
   const newObj = { ...obj };
   Object.keys(newObj).forEach(key => {
@@ -239,3 +323,119 @@ export function cleanUrl(href: string) {
   }
   return href;
 }
+
+export const mathJaxConfig = {
+  startup: {
+    elements: ['.memori-chat--bubble-content'],
+  },
+  options: {
+    processHtmlClass: 'memori-chat--bubble-content',
+  },
+  tex: {
+    inlineMath: [
+      ['$', '$'],
+      ['\\$', '\\$'],
+    ],
+    displayMath: [['$$', '$$']],
+    processEscapes: true,
+  },
+  asciimath: {
+    fixphi: true,
+    displaystyle: true,
+    decimalsign: '.',
+  },
+  skipStartupTypeset: true,
+  chtml: {
+    displayAlign: 'left',
+  },
+  svg: {
+    fontCache: 'global',
+  },
+};
+
+export const installMathJaxScript = () => {
+  const script = document.createElement('script');
+  script.src = 'https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js';
+  script.async = true;
+  script.id = 'mathjax-script';
+  document.head.appendChild(script);
+};
+
+export const installMathJax = () => {
+  // @ts-ignore
+  window.MathJax = mathJaxConfig;
+
+  installMathJaxScript();
+};
+/**
+ * Corrects materials by setting some specific properties.
+ * This is often necessary when working with imported 3D models.
+ *
+ * @param materials - An object containing materials to be corrected.
+ */
+export function correctMaterials(materials: { [key: string]: Material }) {
+  Object.values(materials).forEach(material => {
+    if (material instanceof MeshStandardMaterial) {
+      // Improve the material's appearance
+      material.roughness = 0.8;
+      material.metalness = 0.1;
+
+      // Enable shadow casting and receiving
+      material.shadowSide = 2; // FrontSide and BackSide
+
+      // Improve texture rendering if the material uses textures
+      if (material.map) {
+        material.map.anisotropy = 16;
+      }
+    }
+  });
+}
+
+/**
+ * Type guard to check if an object is a SkinnedMesh.
+ * This is useful when working with 3D models that may contain different types of meshes.
+ *
+ * @param object - The object to check.
+ * @returns True if the object is a SkinnedMesh, false otherwise.
+ */
+export function isSkinnedMesh(object: any): object is SkinnedMesh {
+  return object.isSkinnedMesh === true;
+}
+
+/**
+ * Disposes of a Three.js object and its children recursively.
+ * This is important for memory management, especially when removing objects from the scene.
+ *
+ * @param object - The Three.js object to dispose.
+ */
+export function disposeObject(object: any) {
+  if ('geometry' in object && object.geometry instanceof THREE.BufferGeometry) {
+    object.geometry.dispose();
+  }
+
+  if ('material' in object) {
+    if (Array.isArray(object.material)) {
+      if (Array.isArray(object.material)) {
+        object.material.forEach((material: any) => {
+          if (material instanceof THREE.Material) {
+            material.dispose();
+          }
+        });
+      } else if (object && object.material instanceof THREE.Material) {
+        object.material.dispose();
+      }
+    }
+  }
+
+  if (object.children) {
+    object.children.forEach(disposeObject);
+  }
+}
+
+export const safeParseJSON = (jsonString: string, fallbackString = false) => {
+  try {
+    return JSON.parse(jsonString);
+  } catch (error) {
+    return fallbackString ? jsonString : null;
+  }
+};

package/src/i18n.ts

@@ -1,6 +1,9 @@
 import { createInstance } from 'i18next';
 import it from './locales/it.json';
 import en from './locales/en.json';
+import fr from './locales/fr.json';
+import de from './locales/de.json';
+import es from './locales/es.json';
 
 const resources = {
   en: {
@@ -9,13 +12,22 @@ const resources = {
   it: {
     translation: it,
   },
+  es: {
+    translation: es,
+  },
+  fr: {
+    translation: fr,
+  },
+  de: {
+    translation: de,
+  },
 };
 
 const i18n = createInstance({
   resources,
   lng: 'en',
   fallbackLng: 'it',
-  supportedLngs: ['en', 'it'],
+  supportedLngs: ['en', 'it', 'fr', 'es', 'de'],
   nonExplicitSupportedLngs: true,
   interpolation: {
     escapeValue: false,

package/src/index.stories.tsx

@@ -28,9 +28,102 @@ export const Anonymous = Template.bind({});
 Anonymous.args = {
   ownerUserName: 'nzambello',
   memoriName: 'Nicola',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  enableAudio: true,
+  autoStart: true,
+  showChatHistory: true,
+};
+
+export const WithInitialContextAndQuestion = Template.bind({});
+WithInitialContextAndQuestion.args = {
+  ownerUserName: 'nzambello',
+  memoriName: 'Nicola',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  enableAudio: true,
+  autoStart: true,
+  initialQuestion: 'Ciao',
+  context: { STORYBOOK: 'true' },
+};
+
+export const WithInitialContextAndQuestionFromIntegration = Template.bind({});
+WithInitialContextAndQuestionFromIntegration.args = {
+  ownerUserName: 'nzambello',
+  memoriName: 'Nicola',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  enableAudio: true,
+  autoStart: true,
+  integration: {
+    integrationID: 'test',
+    customData: JSON.stringify({
+      initialQuestion: 'Ciao',
+      contextVars: 'STORYBOOK:true',
+    }),
+  },
+};
+
+export const WithPreviousSession = Template.bind({});
+WithPreviousSession.args = {
+  ownerUserName: 'nzambello',
+  memoriName: 'Nicola',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  sessionID: '1234567890',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+};
+
+export const WithChatHistory = Template.bind({});
+WithChatHistory.args = {
+  ownerUserName: 'nzambello',
+  memoriName: 'Nicola',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  showChatHistory: true,
+};
+
+export const WithUpload = Template.bind({});
+WithUpload.args = {
+  ownerUserName: 'nzambello',
+  memoriName: 'Nicola',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  enableAudio: true,
+  showUpload: true,
+};
+
+export const Nunzio = Template.bind({});
+Nunzio.args = {
+  ownerUserName: 'nunzio.fiore',
+  memoriName: 'Nunzio',
   tenantID: 'aisuru.com',
+  engineURL: 'https://engine.memori.ai',
   apiURL: 'https://backend.memori.ai',
-  baseURL: 'https://aisuru.com',
+  baseURL: 'https://www.aisuru.com',
   uiLang: 'it',
   showShare: true,
   showSettings: true,
@@ -38,18 +131,32 @@ Anonymous.args = {
 
 export const Localhost = Template.bind({});
 Localhost.args = {
-  memoriName: 'test memori',
-  ownerUserName: 'nicola',
-  memoriID: '1a9c75e8-57aa-4ce3-8ea5-256185fa79a7',
-  ownerUserID: '04a8cff9-13d6-4367-9cb2-72b9af9ee494',
-  tenantID: 'app.memorytwin.com',
+  memoriName: 'test9',
+  ownerUserName: 'andrea.patini',
+  memoriID: 'e31aa393-08c4-469a-b2e8-971eb45f4925',
+  ownerUserID: '9266e23e-6822-4658-bbb0-4bebbc232bd4',
+  tenantID: 'localhost:3000',
+  engineURL: 'http://localhost:7778',
   apiURL: 'http://localhost:7778',
   baseURL: 'http://localhost:3000',
-  uiLang: 'EN',
-  lang: 'IT',
+  uiLang: 'IT',
+  spokenLang: 'IT',
   layout: 'FULLPAGE',
+  showInstruct: false,
+  showSettings: true,
+  showChatHistory: true,
+  showClear: false,
+  showTypingText: false,
+  showOnlyLastMessages: false,
+  showTranslationOriginal: false,
+  showCopyButton: false,
   showShare: true,
-  integrationID: '82f017cc-450b-4c47-acf5-47910d336ce9',
+  showLogin: true,
+  useMathFormatting: false,
+  showUpload: false,
+  autoStart: false,
+  enableAudio: true,
+  integrationID: 'c13fe42a-2d25-4bde-a502-f34824cd4ff1',
 };
 
 export const LocalhostBoE = Template.bind({});
@@ -58,7 +165,8 @@ LocalhostBoE.args = {
   ownerUserName: 'nicola',
   memoriID: '2b094cd6-77b8-4e09-a807-0039b84c988e',
   ownerUserID: '04a8cff9-13d6-4367-9cb2-72b9af9ee494',
-  tenantID: 'app.memorytwin.com',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'http://localhost:7777',
   apiURL: 'http://localhost:7778',
   baseURL: 'http://localhost:3000',
   uiLang: 'EN',
@@ -76,24 +184,140 @@ Staging.args = {
   ownerUserID: 'fbee9aaa-0c46-460e-9800-15e31d7c99c0',
   tenantID: 'aisuru-staging.aclambda.online',
   apiURL: 'https://backend-staging.memori.ai',
+  engineURL: 'https://engine-staging.memori.ai',
   baseURL: 'https://aisuru-staging.aclambda.online',
   uiLang: 'EN',
   lang: 'IT',
   layout: 'FULLPAGE',
 };
 
-export const StagingTokenized = Template.bind({});
-StagingTokenized.args = {
-  memoriName: 'Test',
-  ownerUserName: 'nicola',
-  memoriID: '36798f8a-7018-4cf7-9be4-e681949a46a3',
-  ownerUserID: '585ec0ff-e805-495e-b8fc-5b0b8dd288ff',
-  tenantID: 'aisuru-staging-tokenized.aclambda.online',
+export const Giovanna = Template.bind({});
+Giovanna.args = {
+  memoriName: 'Giovanna',
+  ownerUserName: 'memoridev',
+  memoriID: '3b308d07-0ff8-4f18-b885-fad501164c43',
+  ownerUserID: '13ab0379-a51d-4a83-8389-4f4b95e15567',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  layout: 'ZOOMED_FULL_BODY',
+};
+
+export const CreaRiassunti = Template.bind({});
+CreaRiassunti.args = {
+  memoriName: 'Crea Riassunti',
+  ownerUserName: 'patini929',
+  memoriID: '514dd043-ec26-4c57-a014-a512c9014822',
+  ownerUserID: '1941d326-6986-4fa1-872b-458d09fb654c',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'FR',
+  layout: 'CHAT',
+  showUpload: true,
+  showSettings: true,
+  showClear: false,
+  showAIicon: true,
+  showWhyThisAnswer: true,
+  showTypingText: false,
+  showOnlyLastMessages: false,
+  showTranslationOriginal: false,
+  showCopyButton: false,
+  showShare: true,
+  showLogin: false,
+};
+
+export const NunzioFiore = Template.bind({});
+NunzioFiore.args = {
+  ownerUserName: 'nunzio.fiore',
+  memoriName: 'Nunzio',
+  tenantID: 'www.aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  apiURL: 'https://backend.memori.ai',
+  baseURL: 'https://www.aisuru.com',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  layout: 'ZOOMED_FULL_BODY',
+  showSettings: 'true',
+  showClear: 'false',
+  showAIicon: 'true',
+  showWhyThisAnswer: 'true',
+  showTypingText: 'false',
+  showOnlyLastMessages: 'false',
+  showTranslationOriginal: 'false',
+  showCopyButton: 'false',
+  showShare: 'true',
+  showLogin: 'false',
+  enableAudio: 'true',
+};
+
+export const TestCustomAnimationsWithRPMSequence = Template.bind({});
+TestCustomAnimationsWithRPMSequence.args = {
+  memoriName: 'Dancing Avatar',
+  ownerUserName: 'andrea.patini3',
+  memoriID: '45420d30-a103-455c-bab1-b708a0566a02',
+  ownerUserID: '58770358-a5db-4b49-b3a4-734fc468e745',
+  tenantID: 'aisuru-staging.aclambda.online',
+  engineURL: 'https://engine-staging.memori.ai/memori/v2',
+  apiURL: 'https://backend-staging.memori.ai/api/v2',
+  baseURL: 'https://aisuru-staging.aclambda.online',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  layout: 'HIDDEN_CHAT',
+  showLogin: true,
+  autoStart: true,
+  integrationID: '2f6e11a0-d799-4974-aa17-cf111d0af82a',
+};
+
+export const TestCustomGLBSingleAnimation = Template.bind({});
+TestCustomGLBSingleAnimation.args = {
+  memoriName: "Dragon's Journey",
+  ownerUserName: 'andrea.patini3',
+  memoriID: 'fa0568c0-aac2-494b-bde7-6a8ec7725a2d',
+  ownerUserID: '58770358-a5db-4b49-b3a4-734fc468e745',
+  tenantID: 'aisuru-staging.aclambda.online',
+  engineURL: 'https://engine-staging.memori.ai',
   apiURL: 'https://backend-staging.memori.ai',
-  baseURL: 'https://aisuru-staging-tokenized.aclambda.online',
-  uiLang: 'EN',
-  lang: 'IT',
-  layout: 'FULLPAGE',
+  baseURL: 'https://aisuru-staging.aclambda.online',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  layout: 'TOTEM',
+  showInstruct: false,
+  showLogin: true,
+  showSettings: 'true',
+  showClear: 'false',
+  showTypingText: 'false',
+  showOnlyLastMessages: 'false',
+  showTranslationOriginal: 'false',
+  showCopyButton: 'false',
+  showShare: 'true',
+  useMathFormatting: 'false',
+  showUpload: 'false',
+  autoStart: 'false',
+  enableAudio: 'true',
+  integrationID: 'eea150e2-3ab3-47ae-a9ad-d3ea1704f623',
+};
+
+export const TestRPMEmotionFunction = Template.bind({});
+TestRPMEmotionFunction.args = {
+  memoriName: 'Test RPM',
+  ownerUserName: 'andrea.patini3',
+  memoriID: '35b7059f-08f4-45ab-98d8-899957666b77',
+  ownerUserID: '58770358-a5db-4b49-b3a4-734fc468e745',
+  tenantID: 'aisuru-staging.aclambda.online',
+  engineURL: 'https://engine-staging.memori.ai',
+  apiURL: 'https://backend-staging.memori.ai',
+  baseURL: 'https://aisuru-staging.aclambda.online',
+  uiLang: 'IT',
+  showUpload: true,
+  spokenLang: 'IT',
+  layout: 'ZOOMED_FULL_BODY',
+  integrationID: '60a37903-44a2-48c2-82e3-c7b8b620cb64',
 };
 
 const TemplateWithBatchButton: Story<Props> = args => (
@@ -136,7 +360,8 @@ WithBatch.args = {
   memoriName: 'Nicola',
   tenantID: 'aisuru.com',
   apiURL: 'https://backend.memori.ai',
-  baseURL: 'https://aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  baseURL: 'https://www.aisuru.com',
   uiLang: 'it',
   showShare: true,
   showSettings: true,
@@ -148,7 +373,8 @@ WithCustomUserAvatar.args = {
   memoriName: 'Nicola',
   tenantID: 'aisuru.com',
   apiURL: 'https://backend.memori.ai',
-  baseURL: 'https://aisuru.com',
+  engineURL: 'https://engine.memori.ai',
+  baseURL: 'https://www.aisuru.com',
   uiLang: 'it',
   showShare: true,
   showSettings: true,
@@ -168,3 +394,20 @@ WithCustomUserAvatar.args = {
 //   pin: 'giver pin',
 //   authToken: 'your login token',
 // };
+
+export const Test = Template.bind({});
+Test.args = {
+  memoriName: 'Test Artifact',
+  ownerUserName: 'Andrea-Patini',
+  memoriID: '8cec936c-d440-4781-91df-e4ddf044255e',
+  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: 'https://aisuru-staging.aclambda.online',
+  layout: 'FULLPAGE',
+  uiLang: 'EN',
+  spokenLang: 'EN',
+  showLogin: true,
+  integrationID: '2b37c25d-8cf9-456f-b9ee-2c27dc4d54fc',
+};