@memori.ai/memori-react 6.3.1 → 6.4.0

package/esm/components/ui/Expandable.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import Button from './Button';
+import cx from 'classnames';
+import { useTranslation } from 'react-i18next';
+const Expandable = ({ rows, className, innerClassName, btnClassName, defaultExpanded = false, expandSymbol = () => '...', collapseSymbol = (lang) => lang === 'it' ? 'Mostra meno' : 'Show less', children, }) => {
+    const { i18n } = useTranslation();
+    const lang = i18n.language;
+    const collapseSymbolText = collapseSymbol(lang);
+    const expandSymbolText = expandSymbol(lang);
+    const [expanded, setExpanded] = useState(defaultExpanded);
+    const [needsExpanding, setNeedsExpanding] = useState(false);
+    const [rowHeight, setRowHeight] = useState(16);
+    const ref = useRef(null);
+    useEffect(() => {
+        if (ref.current) {
+            let height = ref.current.getBoundingClientRect().height;
+            let computedStyle = getComputedStyle(ref.current);
+            let elLineHeight = computedStyle.lineHeight;
+            let lineHeight = elLineHeight === 'normal' || !(elLineHeight === null || elLineHeight === void 0 ? void 0 : elLineHeight.length)
+                ? 1.2 * parseInt(computedStyle.fontSize, 10)
+                : parseInt(elLineHeight, 10);
+            console.table({
+                rows,
+                lineHeight,
+                height,
+                maxHeight: rows * lineHeight,
+                needsExpanding: height > rows * lineHeight,
+            });
+            setRowHeight(lineHeight);
+            if (height && height > rows * lineHeight) {
+                setNeedsExpanding(true);
+            }
+        }
+    }, [rows, ref.current]);
+    return (_jsxs("div", { className: cx('memori-expandable', className), children: [_jsx("div", { ref: ref, className: cx('memori-expandable--inner', innerClassName), style: {
+                    maxHeight: expanded || !needsExpanding ? '9999px' : `${rowHeight * rows}px`,
+                }, children: children }), needsExpanding && !expanded && (_jsx(Button, { ghost: true, padded: false, className: btnClassName, onClick: () => setExpanded(true), children: expandSymbolText })), needsExpanding && expanded && (_jsx(Button, { ghost: true, padded: false, className: btnClassName, onClick: () => setExpanded(false), children: collapseSymbolText }))] }));
+};
+export default Expandable;
+//# sourceMappingURL=Expandable.js.map

package/esm/components/ui/Expandable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Expandable.js","sourceRoot":"","sources":["../../../src/components/ui/Expandable.tsx"],"names":[],"mappings":"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"}

package/esm/components/ui/Table.css

@@ -1,6 +1,6 @@
 table.memori--table {
     --memori-table-spacing: 1rem;
-    --memori-table-border-color: hsl(205, 20%, 94%);
+    --memori-table-border-color: rgb(237, 240, 243);
     --memori-table-bg-color: rgb(246, 248, 249);
 
     margin: 1rem 0;
@@ -110,4 +110,4 @@ table.memori--table td.memori--table--column-right {
 
 .memori--table--date {
     white-space: nowrap;
-}
+}

package/esm/locales/en.json

@@ -33,6 +33,7 @@
     "showTranslatedText": "Show translation",
     "exactPosition": "Exact position",
     "uncertain": "Uncertain",
+    "question": "Question",
     "nothingFound": "Nothing found",
     "venue": "Venue",
     "searchVenue": "Search venue...",
@@ -42,6 +43,8 @@
     "memoriBlockedReasonExceedChats": "because it has exceeded the monthly threshold of allowed chats.",
     "memoriBlockedGiverHelper": "You can still manage it as administrator, but other users will not be able to interact with it.",
     "generatedByAI": "Answer generated by AI, may occasionally generate incorrect informations",
+    "whyThisAnswer": "Why this answer?",
+    "whyThisAnswerHelper": "This answer was generated automatically by an artificial intelligence based on these verified contents.",
     "completionsEnabled": "Advanced AI, can respond with automatically generated answers that may sometimes contain incorrect information",
     "completionProviderDown": "This Twin is integrated with a generative AI from {{provider}}, but it is currently unavailable. Try again later.",
     "completionProviderFallbackName": "an external provider",

package/esm/locales/it.json

@@ -33,6 +33,7 @@
     "showTranslatedText": "Mostra traduzione",
     "exactPosition": "Posizione esatta",
     "uncertain": "Incertezza",
+    "question": "Domanda",
     "nothingFound": "Nessun risultato",
     "venue": "Luogo",
     "searchVenue": "Cerca luogo...",
@@ -42,6 +43,8 @@
     "memoriBlockedReasonExceedChats": "perchè ha superato la soglia mensile di chat ammesse.",
     "memoriBlockedGiverHelper": "Puoi sempre gestirlo in qualità di amministratore, ma altri utenti non potranno interrogarlo.",
     "generatedByAI": "Risposta generata da IA, può talvolta generare informazioni non corrette",
+    "whyThisAnswer": "Perché questa risposta?",
+    "whyThisAnswerHelper": "Questa risposta è stata generata automaticamente da un'intelligenza artificiale sulla base di questi contenuti verificati.",
     "completionsEnabled": "IA evoluta, può rispondere con risposte generate automaticamente che talvolta potrebbero contenere informazioni non corrette",
     "completionProviderDown": "Questo Twin è integrato con una IA generativa di {{provider}}, ma al momento non è disponibile. Riprova più tardi.",
     "completionProviderFallbackName": "un provider esterno",

package/esm/styles.css

@@ -7,6 +7,7 @@
 @import url('./components/ui/Tooltip.css');
 @import url('./components/ui/Select.css');
 @import url('./components/ui/Table.css');
+@import url('./components/ui/Expandable.css');
 
 @import url('./components/CompletionProviderStatus/CompletionProviderStatus.css');
 @import url('./components/PoweredBy/PoweredBy.css');
@@ -41,6 +42,7 @@
 @import url('./components/KnownFacts/KnownFacts.css');
 @import url('./components/LoginDrawer/LoginDrawer.css');
 @import url('./components/VenueWidget/VenueWidget.css');
+@import url('./components/WhyThisAnswer/WhyThisAnswer.css');
 @import url('./components/MemoriWidget/MemoriWidget.css');
 
 @import url('https://fonts.bunny.net/css?family=lexend-deca:200,400,700');
@@ -76,11 +78,12 @@ body.sb-show-main #root,
     --memori-chat-bubble-bg: #fff;
     --memori-chat-user-bubble-bg: var(--memori-primary);
     --memori-text-color: #000;
+    --memori-border-radius: 5px;
     --memori-button-bg: #fff;
     --memori-button-text: #000;
     --memori-button-padding: 0.5rem 1.5rem;
     --memori-button-border-color: #d9d9d9;
-    --memori-button-radius: 5px;
+    --memori-button-radius: var(--memori-border-radius);
     --memori-button-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
     --memori-blur-background: 0px;
     --memori-drawer--width: 80%;
@@ -99,4 +102,4 @@ body.sb-show-main #root,
     .mobile-hidden {
         display: none;
     }
-}
+}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "6.3.1",
+  "version": "6.4.0",
   "name": "@memori.ai/memori-react",
   "author": "Memori Srl",
   "main": "dist/index.js",
@@ -291,7 +291,7 @@
   },
   "dependencies": {
     "@headlessui/react": "1.7.4",
-    "@memori.ai/memori-api-client": "^4.1.0",
+    "@memori.ai/memori-api-client": "^4.1.2",
     "@react-three/drei": "8.20.2",
     "@react-three/fiber": "7.0.25",
     "classnames": "2.3.2",

package/src/components/Chat/Chat.tsx

@@ -202,6 +202,7 @@ const Chat: React.FC<Props> = ({
                 tenant={tenant}
                 baseUrl={baseUrl}
                 apiUrl={apiUrl}
+                sessionID={sessionID}
                 simulateUserPrompt={simulateUserPrompt}
                 showAIicon={showAIicon}
                 showFeedback={

package/src/components/ChatBubble/ChatBubble.css

@@ -146,17 +146,22 @@
     margin-left: auto;
 }
 
-.memori-chat--bubble.memori-chat--with-addon .memori-chat--bubble-ai-icon {
+.memori-chat--bubble.memori-chat--with-addon .memori-chat--bubble-action-icon {
     display: flex;
     justify-content: flex-end;
-    padding: 3px;
+    padding: 0;
     text-align: right;
 }
 
-.memori-chat--bubble.memori-chat--with-addon .memori-chat--bubble-ai-icon svg {
+.memori-chat--bubble.memori-chat--with-addon .memori-chat--bubble-action-icon.memori-chat--bubble-action-icon--ai {
+    padding: 3px;
+}
+
+.memori-chat--bubble.memori-chat--with-addon .memori-chat--bubble-action-icon svg {
     overflow: visible;
-    width: 0.85rem;
-    height: 0.85rem;
+    width: 1rem;
+    height: 1rem;
+    color: #000;
 }
 
 .memori-chat--bubble-addon .memori-chat--feedback {
@@ -180,6 +185,11 @@
     height: 0.9rem;
 }
 
+.memori-chat--bubble.memori-chat--with-addon .memori-chat--bubble-action-icon.memori-chat--bubble-action-icon--ai svg {
+    width: 0.85rem;
+    height: 0.85rem;
+}
+
 .memori-chat--bubble-addon-separator {
     width: 1px;
     height: 1.5em;
@@ -260,4 +270,4 @@
     30% {
         transform: translateY(-10px);
     }
-}
+}

package/src/components/ChatBubble/ChatBubble.test.tsx

@@ -1,13 +1,14 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import ChatBubble from './ChatBubble';
-import { memori, tenant } from '../../mocks/data';
+import { memori, tenant, sessionID } from '../../mocks/data';
 
 it('renders ChatBubble unchanged', () => {
   const { container } = render(
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       message={{
         fromUser: false,
         text: 'Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.',
@@ -25,6 +26,7 @@ it('renders ChatBubble with initial msg unchanged', () => {
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       message={{
         fromUser: false,
         text: 'Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.',
@@ -42,6 +44,7 @@ it('renders ChatBubble with user msg unchanged', () => {
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       message={{
         fromUser: true,
         text: 'Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.',
@@ -59,6 +62,7 @@ it('renders ChatBubble with msg generated by AI unchanged', () => {
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       message={{
         fromUser: true,
         text: 'Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.',
@@ -80,6 +84,7 @@ it('renders ChatBubble with msg from BoE expert unchanged', () => {
         enableBoardOfExperts: true,
       }}
       tenant={tenant}
+      sessionID={sessionID}
       apiUrl="https://backend.memori.ai"
       experts={[
         {
@@ -109,6 +114,7 @@ it('renders ChatBubble from user with avatar unchanged', () => {
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       user={{ avatarURL: 'https://picsum.photos/200' }}
       message={{
         fromUser: true,
@@ -127,6 +133,7 @@ it('renders ChatBubble from user with custom avatar unchanged', () => {
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       userAvatar="https://picsum.photos/200"
       message={{
         fromUser: true,
@@ -145,6 +152,7 @@ it('renders ChatBubble from user with avatar as react element unchanged', () =>
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       user={{ avatarURL: 'https://picsum.photos/200' }}
       userAvatar={<span>USER</span>}
       message={{
@@ -164,6 +172,7 @@ it('renders ChatBubble with markdown unchanged', () => {
     <ChatBubble
       memori={memori}
       tenant={tenant}
+      sessionID={sessionID}
       message={{
         fromUser: false,
         text: '## Test\n\nEcco tutte le possibili personalizzazioni che puoi applicare:\n\n- **Colletto**:\n - Girocollo\n - Scollo a V\n\n- **Manica**:\n - Manica Lunga\n - Manica Corta\n\n- **Taglia**:\n - XS\n - S\n - M\n - L\n - XL\n - XXL\n - 3XL\n\n- **Posizione Stampa**:\n - Fronte Petto\n - Retro Schiena\n - Fronte DX\n - Fronte SX\n\n- **Generazione Immagine**:\n - Prompt generazione immagine\n\nSeleziona le personalizzazioni che desideri applicare.\n\n[Vedi altro](https://memori.ai)',

package/src/components/ChatBubble/ChatBubble.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import cx from 'classnames';
 import {
   ExpertReference,
@@ -18,14 +18,19 @@ import { useTranslation } from 'react-i18next';
 import { marked } from 'marked';
 import { sanitize } from 'dompurify';
 import { cleanUrl } from '../../helpers/utils';
+import Button from '../ui/Button';
+import QuestionHelp from '../icons/QuestionHelp';
+import WhyThisAnswer from '../WhyThisAnswer/WhyThisAnswer';
 
 export interface Props {
   message: Message;
   memori: Memori;
+  sessionID: string;
   tenant?: Tenant;
   baseUrl?: string;
   apiUrl?: string;
   showFeedback?: boolean;
+  showWhyThisAnswer?: boolean;
   simulateUserPrompt?: (msg: string) => void;
   showAIicon?: boolean;
   isFirst?: boolean;
@@ -61,7 +66,9 @@ const ChatBubble: React.FC<Props> = ({
   tenant,
   baseUrl,
   apiUrl,
+  sessionID,
   showFeedback,
+  showWhyThisAnswer = true,
   simulateUserPrompt,
   showAIicon = true,
   isFirst = false,
@@ -70,6 +77,7 @@ const ChatBubble: React.FC<Props> = ({
   experts,
 }) => {
   const { t } = useTranslation();
+  const [showingWhyThisAnswer, setShowingWhyThisAnswer] = useState(false);
 
   const renderedText = sanitize(
     (marked.parse(message.translatedText || message.text) as string)
@@ -187,11 +195,6 @@ const ChatBubble: React.FC<Props> = ({
             message.fromUser ? '30' : '-30'
           }`}
         >
-          {/*(message.translatedText || message.text)
-            .split(/\r\n|\r|\n/)
-            .map((row, index) => (
-              <p key={index}>{row}</p>
-            ))*/}
           <div dangerouslySetInnerHTML={{ __html: renderedText }} />
           {((message.generatedByAI && showAIicon) ||
             (showFeedback && simulateUserPrompt)) && (
@@ -211,13 +214,30 @@ const ChatBubble: React.FC<Props> = ({
                 <Tooltip
                   align="left"
                   content={t('generatedByAI')}
-                  className="memori-chat--bubble-ai-icon"
+                  className="memori-chat--bubble-action-icon memori-chat--bubble-action-icon--ai"
                 >
                   <span>
                     <AI title={t('generatedByAI') || undefined} />
                   </span>
                 </Tooltip>
               )}
+
+              {!message.fromUser &&
+                message.questionAnswered &&
+                apiUrl &&
+                showWhyThisAnswer && (
+                  <Button
+                    ghost
+                    shape="circle"
+                    title={t('whyThisAnswer') || undefined}
+                    className="memori-chat--bubble-action-icon"
+                    onClick={() => setShowingWhyThisAnswer(true)}
+                    disabled={showingWhyThisAnswer}
+                    icon={
+                      <QuestionHelp title={t('whyThisAnswer') || undefined} />
+                    }
+                  />
+                )}
             </div>
           )}
         </Transition.Child>
@@ -284,6 +304,16 @@ const ChatBubble: React.FC<Props> = ({
           </>
         )}
       </Transition>
+
+      {showingWhyThisAnswer && apiUrl && (
+        <WhyThisAnswer
+          visible={showingWhyThisAnswer}
+          message={message}
+          closeDrawer={() => setShowingWhyThisAnswer(false)}
+          apiURL={apiUrl}
+          sessionID={sessionID}
+        />
+      )}
     </>
   );
 };

package/src/components/ChatBubble/__snapshots__/ChatBubble.test.tsx.snap

@@ -339,7 +339,7 @@ exports[`renders ChatBubble with msg from BoE expert unchanged 1`] = `
         class="memori-chat--bubble-addon"
       >
         <div
-          class="memori-tooltip memori-tooltip--align-left memori-chat--bubble-ai-icon"
+          class="memori-tooltip memori-tooltip--align-left memori-chat--bubble-action-icon memori-chat--bubble-action-icon--ai"
         >
           <div
             class="memori-tooltip--content"
@@ -421,7 +421,7 @@ exports[`renders ChatBubble with msg generated by AI unchanged 1`] = `
         class="memori-chat--bubble-addon"
       >
         <div
-          class="memori-tooltip memori-tooltip--align-left memori-chat--bubble-ai-icon"
+          class="memori-tooltip memori-tooltip--align-left memori-chat--bubble-action-icon memori-chat--bubble-action-icon--ai"
         >
           <div
             class="memori-tooltip--content"

package/src/components/Header/Header.css

@@ -63,6 +63,12 @@
     white-space: nowrap;
 }
 
+@media (max-width: 768px) {
+    .memori-header--position .memori-header--position-placeName {
+        display: none;
+    }
+}
+
 .memori-header--position .memori-header--button {
     margin-right: 0.5rem;
     margin-left: 0.5rem;
@@ -76,4 +82,4 @@
 
 .memori-header .memori-header--button--position {
     margin-right: 0.25rem;
-}
+}

package/src/components/KnownFacts/KnownFacts.tsx

@@ -87,84 +87,6 @@ const KnownFacts = ({
   const [selectedRowKeys, setSelectedRowKeys] = useState<(string | number)[]>(
     []
   );
-  // const rowSelection = {
-  //   selectedRowKeys,
-  //   onChange: setSelectedRowKeys,
-  // };
-
-  // const columns = [
-  //   {
-  //     title: t('knownFacts.text'),
-  //     dataIndex: 'text',
-  //   },
-  //   {
-  //     title: t('createdAt'),
-  //     dataIndex: 'creationTimestamp',
-  //     sorter: (a: KnownFact, b: KnownFact) =>
-  //       new Date(a.creationTimestamp ?? Date.now()).getTime() -
-  //       new Date(b.creationTimestamp ?? Date.now()).getTime(),
-  //     render: (creationTimestamp: Date) => (
-  //       <div className={styles.columnCentered}>
-  //         <span className={styles.date}>
-  //           {creationTimestamp
-  //             ? new Intl.DateTimeFormat('it', {
-  //                 dateStyle: 'short',
-  //                 timeStyle: 'short',
-  //               }).format(new Date(creationTimestamp))
-  //             : '-'}
-  //         </span>
-  //       </div>
-  //     ),
-  //   },
-  //   {
-  //     title: t('actions'),
-  //     key: 'action',
-  //     render: (_value: any, kf: KnownFact) => (
-  //       <div className={styles.actionColumn}>
-  //         <Button
-  //           danger
-  //           icon={<DeleteOutlined />}
-  //           disabled={selectedRowKeys?.length > 0}
-  //           title={t('delete') || 'Delete'}
-  //           onClick={() => {
-  //             kf.knownFactID &&
-  //               Modal.confirm({
-  //                 title: t('knownFacts.deleteConfirmTitle'),
-  //                 content: t('knownFacts.deleteConfirmMessage'),
-  //                 okText: t('confirm'),
-  //                 cancelText: t('cancel'),
-  //                 centered: true,
-  //                 autoFocusButton: 'cancel',
-  //                 onOk: async () => {
-  //                   try {
-  //                     const response = await deleteKnownFact(
-  //                       sessionID,
-  //                       kf.knownFactID
-  //                     );
-  //                     if (response.resultCode === 0) {
-  //                       toast.success(t('knownFacts.deleteSuccess'));
-  //                       setSelectedRowKeys([]);
-  //                       fetchKnownFacts();
-  //                     } else {
-  //                       console.error(response);
-  //                       toast.error(
-  //                         t(getErrori18nKey(response.resultCode), {
-  //                           ns: 'common',
-  //                         })
-  //                       );
-  //                     }
-  //                   } catch (_e) {
-  //                     let error = _e as Error;
-  //                     toast.error(t('Error') + error.message);
-  //                   }
-  //                 },
-  //               });
-  //           }}
-  //         />
-  //       </div>
-  //     ),
-  //   },
-  // ];
 
   return (
     <Drawer

package/src/components/MemoriWidget/MemoriWidget.tsx

@@ -688,6 +688,13 @@ const MemoriWidget = ({
               emitter: currentState.emitter,
               media: currentState.media,
               fromUser: false,
+              questionAnswered: msg,
+              contextVars: currentState.contextVars,
+              date: currentState.currentDate,
+              placeName: currentState.currentPlaceName,
+              placeLatitude: currentState.currentLatitude,
+              placeLongitude: currentState.currentLongitude,
+              placeUncertaintyKm: currentState.currentUncertaintyKm,
             });
             speak(emission);
           }
@@ -717,6 +724,13 @@ const MemoriWidget = ({
                 emitter: currentState.emitter,
                 media: currentState.media,
                 fromUser: false,
+                questionAnswered: msg,
+                contextVars: currentState.contextVars,
+                date: currentState.currentDate,
+                placeName: currentState.currentPlaceName,
+                placeLatitude: currentState.currentLatitude,
+                placeLongitude: currentState.currentLongitude,
+                placeUncertaintyKm: currentState.currentUncertaintyKm,
               });
               speak(emission);
             }
@@ -736,7 +750,7 @@ const MemoriWidget = ({
         !instruct &&
         isMultilanguageEnabled
       ) {
-        translateDialogState(currentState, userLang).then(ts => {
+        translateDialogState(currentState, userLang, msg).then(ts => {
           if (ts.emission) {
             speak(ts.emission);
           }
@@ -753,7 +767,14 @@ const MemoriWidget = ({
             emitter: currentState.emitter,
             media: currentState.media,
             fromUser: false,
+            questionAnswered: msg,
             generatedByAI: !!currentState.completion,
+            contextVars: currentState.contextVars,
+            date: currentState.currentDate,
+            placeName: currentState.currentPlaceName,
+            placeLatitude: currentState.currentLatitude,
+            placeLongitude: currentState.currentLongitude,
+            placeUncertaintyKm: currentState.currentUncertaintyKm,
           });
           speak(emission);
         }
@@ -794,7 +815,11 @@ const MemoriWidget = ({
   /**
    * Traduzioni istantanee
    */
-  const translateDialogState = async (state: DialogState, userLang: string) => {
+  const translateDialogState = async (
+    state: DialogState,
+    userLang: string,
+    msg?: string
+  ) => {
     const emission = state.emission ?? currentDialogState?.emission;
 
     let translatedState = { ...state };
@@ -813,6 +838,13 @@ const MemoriWidget = ({
           emitter: state.emitter,
           media: state.media,
           fromUser: false,
+          questionAnswered: msg,
+          contextVars: state.contextVars,
+          date: state.currentDate,
+          placeName: state.currentPlaceName,
+          placeLatitude: state.currentLatitude,
+          placeLongitude: state.currentLongitude,
+          placeUncertaintyKm: state.currentUncertaintyKm,
         };
       }
     } else {
@@ -853,7 +885,14 @@ const MemoriWidget = ({
           emitter: state.emitter,
           media: state.media,
           fromUser: false,
+          questionAnswered: msg,
           generatedByAI: !!state.completion,
+          contextVars: state.contextVars,
+          date: state.currentDate,
+          placeName: state.currentPlaceName,
+          placeLatitude: state.currentLatitude,
+          placeLongitude: state.currentLongitude,
+          placeUncertaintyKm: state.currentUncertaintyKm,
         };
     }
 
@@ -1086,6 +1125,12 @@ const MemoriWidget = ({
                     media: currentState.media,
                     fromUser: false,
                     initial: true,
+                    contextVars: currentState.contextVars,
+                    date: currentState.currentDate,
+                    placeName: currentState.currentPlaceName,
+                    placeLatitude: currentState.currentLatitude,
+                    placeLongitude: currentState.currentLongitude,
+                    placeUncertaintyKm: currentState.currentUncertaintyKm,
                   },
                 ])
               : pushMessage({
@@ -1094,6 +1139,12 @@ const MemoriWidget = ({
                   media: currentState.media,
                   fromUser: false,
                   initial: true,
+                  contextVars: currentState.contextVars,
+                  date: currentState.currentDate,
+                  placeName: currentState.currentPlaceName,
+                  placeLatitude: currentState.currentLatitude,
+                  placeLongitude: currentState.currentLongitude,
+                  placeUncertaintyKm: currentState.currentUncertaintyKm,
                 });
           }
         }
@@ -1373,6 +1424,12 @@ const MemoriWidget = ({
             media: currentState.media,
             fromUser: false,
             generatedByAI: !!currentState.completion,
+            contextVars: currentState.contextVars,
+            date: currentState.currentDate,
+            placeName: currentState.currentPlaceName,
+            placeLatitude: currentState.currentLatitude,
+            placeLongitude: currentState.currentLongitude,
+            placeUncertaintyKm: currentState.currentUncertaintyKm,
           });
           speak(emission);
           setCurrentDialogState({
@@ -2263,6 +2320,12 @@ const MemoriWidget = ({
                 emitter: currentState.emitter,
                 media: currentState.media,
                 fromUser: false,
+                contextVars: currentState.contextVars,
+                date: currentState.currentDate,
+                placeName: currentState.currentPlaceName,
+                placeLatitude: currentState.currentLatitude,
+                placeLongitude: currentState.currentLongitude,
+                placeUncertaintyKm: currentState.currentUncertaintyKm,
               });
             }
           } else {
@@ -2277,6 +2340,12 @@ const MemoriWidget = ({
               emitter: currentState.emitter,
               media: currentState.media,
               fromUser: false,
+              contextVars: currentState.contextVars,
+              date: currentState.currentDate,
+              placeName: currentState.currentPlaceName,
+              placeLatitude: currentState.currentLatitude,
+              placeLongitude: currentState.currentLongitude,
+              placeUncertaintyKm: currentState.currentUncertaintyKm,
             });
           }
         }