@memori.ai/memori-react 7.19.1 → 7.21.0

package/src/components/WhyThisAnswer/WhyThisAnswer.stories.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import { Meta, Story } from '@storybook/react';
-import { sessionID, memoryQuestion } from '../../mocks/data';
+import { sessionID } from '../../mocks/data';
 import I18nWrapper from '../../I18nWrapper';
 import WhyThisAnswer, { Props } from './WhyThisAnswer';
+import { SearchMatches } from '@memori.ai/memori-api-client/dist/types';
 
 import './WhyThisAnswer.css';
-import { SearchMatches } from '@memori.ai/memori-api-client/dist/types';
 
 const meta: Meta = {
   title: 'Why This Answer',
@@ -69,6 +69,7 @@ WithData.args = {
       confidenceLevel: 'HIGH',
       memory: {
         memoryID: '1',
+        memoryType: 'Question',
         title: 'This is the title of the content',
         titleVariants: [
           "This is a variant of the content's title",
@@ -89,6 +90,7 @@ WithData.args = {
       confidenceLevel: 'LOW',
       memory: {
         memoryID: '2',
+        memoryType: 'Question',
         title: 'Content with a long answer',
         titleVariants: undefined,
         answers: [
@@ -105,6 +107,7 @@ WithData.args = {
         memoryID: '3',
         title: 'Content with sources',
         titleVariants: undefined,
+        memoryType: 'Question',
         answers: [
           {
             text: 'This is a test answer',
@@ -130,9 +133,9 @@ WithData.args = {
       confidence: 0.7,
       confidenceLevel: 'MEDIUM',
       memory: {
-        ...memoryQuestion,
         memoryID: '4',
         title: 'Content with links',
+        memoryType: 'Question',
         titleVariants: undefined,
         answers: [
           {
@@ -155,5 +158,43 @@ WithData.args = {
         ],
       },
     } as SearchMatches,
+    {
+      confidence: 0.7,
+      confidenceLevel: 'MEDIUM',
+      memory: {
+        memoryID: '5',
+        memoryType: 'Question',
+        title: 'Content with receiver',
+        titleVariants: undefined,
+        receiverName: 'receiver',
+        receiverTag: '🧑‍💻',
+        answers: [
+          {
+            text: 'This is a an answer',
+          },
+        ],
+        media: [],
+      },
+    } as SearchMatches,
+    {
+      confidence: 0.5,
+      confidenceLevel: 'MEDIUM',
+      memory: {
+        memoryID: '5',
+        memoryType: 'Question',
+        title: 'Content with context',
+        titleVariants: undefined,
+        contextVars: {
+          KEY1: 'VALUE1',
+          KEY2: 'VALUE2',
+        },
+        answers: [
+          {
+            text: 'This is a an answer',
+          },
+        ],
+        media: [],
+      },
+    } as SearchMatches,
   ],
 };

package/src/components/WhyThisAnswer/WhyThisAnswer.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import WhyThisAnswer from './WhyThisAnswer';
-import { sessionID, memoryQuestion } from '../../mocks/data';
+import { sessionID } from '../../mocks/data';
 
 beforeEach(() => {
   // @ts-ignore
@@ -61,12 +61,37 @@ it('renders WhyThisAnswer visible unchanged', () => {
   expect(container).toMatchSnapshot();
 });
 
+it('renders WhyThisAnswer loading unchanged', () => {
+  const { container } = render(
+    <WhyThisAnswer
+      apiURL="https://backend.memori.ai"
+      sessionID={sessionID}
+      visible={true}
+      message={{
+        questionAnswered: 'Test message',
+        text: 'This is a test content',
+        date: '2021-01-01',
+        placeName: 'Test Place',
+        placeLatitude: 0,
+        placeLongitude: 0,
+        placeUncertaintyKm: 0,
+        contextVars: {
+          KEY: 'value',
+        },
+      }}
+      closeDrawer={jest.fn()}
+      _TEST_loading={true}
+    />
+  );
+  expect(container).toMatchSnapshot();
+});
+
 it('renders WhyThisAnswer with data unchanged', () => {
   const { container } = render(
     <WhyThisAnswer
       apiURL="https://backend.memori.ai"
       sessionID={sessionID}
-      visible={false}
+      visible={true}
       message={{
         questionAnswered: 'Test message',
         text: 'This is a test content',
@@ -84,7 +109,8 @@ it('renders WhyThisAnswer with data unchanged', () => {
           confidence: 0.8,
           confidenceLevel: 'HIGH',
           memory: {
-            ...memoryQuestion,
+            memoryID: '1',
+            memoryType: 'Question',
             title: 'This is the title of the content',
             titleVariants: [
               "This is a variant of the content's title",
@@ -94,26 +120,120 @@ it('renders WhyThisAnswer with data unchanged', () => {
               {
                 text: 'This is a test answer',
               },
+              {
+                text: 'This is another answer',
+              },
+            ],
+          },
+        },
+        {
+          confidence: 0.5,
+          confidenceLevel: 'LOW',
+          memory: {
+            memoryID: '2',
+            memoryType: 'Question',
+            title: 'Content with a long answer',
+            titleVariants: undefined,
+            answers: [
+              {
+                text: 'Suspendisse a sodales nulla, sed semper nisi. Suspendisse a sodales nulla, sed semper nisi. Suspendisse a sodales nulla, sed semper nisi. Suspendisse a sodales nulla, sed semper nisi. Suspendisse a sodales nulla, sed semper nisi.',
+              },
+            ],
+          },
+        },
+        {
+          confidence: 0.5,
+          confidenceLevel: 'LOW',
+          memory: {
+            memoryID: '3',
+            title: 'Content with sources',
+            titleVariants: undefined,
+            memoryType: 'Question',
+            answers: [
+              {
+                text: 'This is a test answer',
+              },
+            ],
+            media: [
+              {
+                mediumID: '1',
+                mimeType: 'text/plain',
+                content:
+                  'This is a source. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse a sodales nulla, sed semper nisi. Suspendisse a sodales nulla, sed semper nisi.',
+              },
+              {
+                mediumID: '2',
+                mimeType: 'text/plain',
+                content:
+                  'This is a source.\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit.\nCras lobortis volutpat nunc.\nProin tincidunt enim in felis aliquet, a ultricies purus bibendum.\n\nQuisque in ultrices lectus.\nNulla at urna diam.\n\nProin sodales lobortis libero eu facilisis.',
+              },
             ],
-            memoryID: '1',
           },
         },
         {
           confidence: 0.7,
           confidenceLevel: 'MEDIUM',
           memory: {
-            ...memoryQuestion,
-            memoryID: '2',
-            title: 'This is a test title',
+            memoryID: '4',
+            title: 'Content with links',
+            memoryType: 'Question',
             titleVariants: undefined,
             answers: [
               {
                 text: 'This is a an answer',
               },
+            ],
+            media: [
               {
-                text: 'This is another answer',
+                mediumID: '1',
+                mimeType: 'text/html',
+                url: 'https://memori.ai',
+                title: 'Memori.AI',
+              },
+              {
+                mediumID: '2',
+                mimeType: 'text/html',
+                url: 'https://nzambello.dev',
+                title: 'Nicola Zambello',
+              },
+            ],
+          },
+        },
+        {
+          confidence: 0.7,
+          confidenceLevel: 'MEDIUM',
+          memory: {
+            memoryID: '5',
+            memoryType: 'Question',
+            title: 'Content with receiver',
+            titleVariants: undefined,
+            receiverName: 'receiver',
+            receiverTag: '🧑‍💻',
+            answers: [
+              {
+                text: 'This is a an answer',
+              },
+            ],
+            media: [],
+          },
+        },
+        {
+          confidence: 0.5,
+          confidenceLevel: 'MEDIUM',
+          memory: {
+            memoryID: '5',
+            memoryType: 'Question',
+            title: 'Content with context',
+            titleVariants: undefined,
+            contextVars: {
+              KEY: 'VALUE',
+            },
+            answers: [
+              {
+                text: 'This is a an answer',
               },
             ],
+            media: [],
           },
         },
       ]}

package/src/components/WhyThisAnswer/WhyThisAnswer.tsx

@@ -12,6 +12,7 @@ import { getErrori18nKey } from '../../helpers/error';
 import { useTranslation } from 'react-i18next';
 import Snippet from '../Snippet/Snippet';
 import MediaWidget from '../MediaWidget/MediaWidget';
+import Card from '../ui/Card';
 
 export interface Props {
   apiURL: string;
@@ -152,16 +153,40 @@ const WhyThisAnswer = ({
                     {m.confidenceLevel}
                   </span>
                   <div className="memori--whythisanswer-title-text">
-                    <p>
-                      <strong>{addQuestionMark(m.memory.title ?? '')}</strong>
-                    </p>
+                    <div className="memori--whythisanswer-title-text-top-container">
+                      <p>
+                        <strong>{addQuestionMark(m.memory.title ?? '')}</strong>
+                      </p>
+                    </div>
                     <p>
                       {m.memory.titleVariants
                         ?.map(t => addQuestionMark(t))
                         ?.join(' | ')}
                     </p>
+                    {(m.memory.receiverName || m.memory.receiverTag) && (
+                      <p className="memori--whythisanswer-title-text-top">
+                        {t('receiverLabel')}: {m.memory.receiverTag}{' '}
+                        {m.memory.receiverName}
+                      </p>
+                    )}
                   </div>
                 </div>
+                {m.memory.contextVars && (
+                  <div className="memori--whythisanswer-contextvars">
+                    {Object.entries(m.memory.contextVars || {}).map(
+                      ([key, value]) => (
+                        <Card
+                          key={key}
+                          className="memori--whythisanswer-contextvars-card"
+                        >
+                          <span>
+                            {key}: {value?.toString() || '✔️'}
+                          </span>
+                        </Card>
+                      )
+                    )}
+                  </div>
+                )}
                 {m.memory.answers?.map((a, i) => (
                   <p key={i} className="memori--whythisanswer-answer">
                     <Expandable rows={3}>{a.text}</Expandable>

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

@@ -2,6 +2,14 @@
 
 exports[`renders WhyThisAnswer hidden unchanged 1`] = `<div />`;
 
+exports[`renders WhyThisAnswer loading unchanged 1`] = `
+<div>
+  <div
+    style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px; display: none;"
+  />
+</div>
+`;
+
 exports[`renders WhyThisAnswer visible unchanged 1`] = `
 <div>
   <div
@@ -10,4 +18,10 @@ exports[`renders WhyThisAnswer visible unchanged 1`] = `
 </div>
 `;
 
-exports[`renders WhyThisAnswer with data unchanged 1`] = `<div />`;
+exports[`renders WhyThisAnswer with data unchanged 1`] = `
+<div>
+  <div
+    style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px; display: none;"
+  />
+</div>
+`;

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

@@ -572,14 +572,6 @@ ZoomedFullBody.args = {
         lastChangeTimestamp: '2022-06-13T14:44:52.833573Z',
       },
     ],
-    avatarURL:
-      'https://assets.memori.ai/api/v2/asset/3049582f-db5f-452c-913d-e4340d4afd0a.png',
-    coverURL:
-      'https://assets.memori.ai/api/v2/asset/e9bb9f6d-8f34-45ab-af9e-6d630d9a51a8.png',
-    avatar3DURL:
-      'https://assets.memori.ai/api/v2/asset/3932bf70-e953-4e8a-b63a-f316544c283e.glb',
-    avatarOriginal3DURL:
-      'https://assets.memori.ai/api/v2/asset/3932bf70-e953-4e8a-b63a-f316544c283e.glb',
     needsPosition: false,
     voiceType: 'FEMALE',
     culture: 'it-IT',

package/src/context/visemeContext.tsx

@@ -115,19 +115,18 @@ const timing = {
     currentWeight + (targetWeight - currentWeight) * SMOOTHING_FACTOR,
 };
 
-const createLogger =
-  (type: 'event' | 'error' | 'debug') => (event: string, data: any) => {
-    const styles = {
-      event: 'color: #4CAF50; font-weight: bold;',
-      error: 'color: #f44336; font-weight: bold;',
-      debug: 'color: #2196F3; font-weight: bold;',
-    };
-    console.log(`%c[VisemeContext] ${event}`, styles[type], data);
-  };
-
-const logVisemeEvent = createLogger('event');
-const logVisemeError = createLogger('error');
-const logVisemeDebug = createLogger('debug');
+// const createLogger =
+//   (type: 'event' | 'error' | 'debug') => (event: string, data: any) => {
+//     const styles = {
+//       event: 'color: #4CAF50; font-weight: bold;',
+//       error: 'color: #f44336; font-weight: bold;',
+//       debug: 'color: #2196F3; font-weight: bold;',
+//     };
+//   };
+
+// const logVisemeEvent = createLogger('event');
+// const logVisemeError = createLogger('error');
+// const logVisemeDebug = createLogger('debug');
 
 type VisemeState = 'idle' | 'preparing' | 'active' | 'paused' | 'finished';
 
@@ -148,10 +147,10 @@ export const VisemeProvider: React.FC<{ children: React.ReactNode }> = ({
 
     // Listen to audio context state changes
     ctx.onstatechange = () => {
-      logVisemeEvent('Audio Context State Change', {
-        state: ctx.state,
-        currentTime: ctx.currentTime,
-      });
+      // logVisemeEvent('Audio Context State Change', {
+      //   state: ctx.state,
+      //   currentTime: ctx.currentTime,
+      // });
 
       switch (ctx.state) {
         case 'running':
@@ -212,7 +211,7 @@ export const VisemeProvider: React.FC<{ children: React.ReactNode }> = ({
 
   const startProcessing = useCallback((audioCtx: IAudioContext) => {
     if (!audioCtx) {
-      logVisemeError('No audio context provided', { state: visemeState });
+      // logVisemeError('No audio context provided', { state: visemeState });
       return;
     }
 
@@ -222,11 +221,11 @@ export const VisemeProvider: React.FC<{ children: React.ReactNode }> = ({
     setIsProcessing(true);
     setVisemeState('active');
 
-    logVisemeEvent('Started Processing', {
-      audioTime: audioCtx.currentTime,
-      queueLength: visemeQueueRef.current.length,
-      state: visemeState,
-    });
+    // logVisemeEvent('Started Processing', {
+    //   audioTime: audioCtx.currentTime,
+    //   queueLength: visemeQueueRef.current.length,
+    //   state: visemeState,
+    // });
   }, []);
 
   const stopProcessing = useCallback(() => {
@@ -237,10 +236,10 @@ export const VisemeProvider: React.FC<{ children: React.ReactNode }> = ({
     frameCountRef.current = 0;
     audioContextRef.current = null;
 
-    logVisemeEvent('Stopped Processing', {
-      queueLength: visemeQueueRef.current.length,
-      state: visemeState,
-    });
+    // logVisemeEvent('Stopped Processing', {
+    //   queueLength: visemeQueueRef.current.length,
+    //   state: visemeState,
+    // });
   }, []);
 
   const updateCurrentViseme = useCallback(
@@ -263,13 +262,13 @@ export const VisemeProvider: React.FC<{ children: React.ReactNode }> = ({
       );
 
       //log it every LOG_INTERVAL frames
-      if (frameCountRef.current % LOG_INTERVAL === 60) {
-        logVisemeDebug('Current Viseme', {
-          currentViseme,
-          audioTime,
-          visemeQueue: visemeQueueRef.current,
-        });
-      }
+      // if (frameCountRef.current % LOG_INTERVAL === 60) {
+      //   logVisemeDebug('Current Viseme', {
+      //     currentViseme,
+      //     audioTime,
+      //     visemeQueue: visemeQueueRef.current,
+      //   });
+      // }
 
       if (currentViseme) {
         const progress =
@@ -312,17 +311,17 @@ export const VisemeProvider: React.FC<{ children: React.ReactNode }> = ({
     frameCountRef.current = 0;
     setVisemeState('idle');
 
-    logVisemeEvent('Reset Viseme Queue', {
-      previousState: visemeState,
-    });
+    // logVisemeEvent('Reset Viseme Queue', {
+    //   previousState: visemeState,
+    // });
   }, [visemeState]);
 
   const resetAndStartProcessing = useCallback(
     (audioCtx: IAudioContext) => {
-      logVisemeEvent('Reset And Start Processing', {
-        previousState: visemeState,
-        queueLength: visemeQueueRef.current.length,
-      });
+      // logVisemeEvent('Reset And Start Processing', {
+      //   previousState: visemeState,
+      //   queueLength: visemeQueueRef.current.length,
+      // });
 
       stopProcessing();
       resetVisemeQueue();

package/src/index.stories.tsx

@@ -179,64 +179,6 @@ Giovanna.args = {
   layout: 'ZOOMED_FULL_BODY',
 };
 
-export const GiovannaRPMProva = Template.bind({});
-GiovannaRPMProva.args = {
-  memoriName: 'Giovanna Test',
-  ownerUserName: 'andrea.patini3',
-  memoriID: '431d9819-c958-442c-a799-f90617371c0c',
-  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: 'EN',
-  spokenLang: 'IT',
-  layout: 'ZOOMED_FULL_BODY',
-  integrationID: '061898c0-2138-49da-a6b3-5d86267aad05',
-  initialQuestion: 'inizio simulazione',
-};
-
-export const GiovannaGLBProva = Template.bind({});
-GiovannaGLBProva.args = {
-  ...GiovannaRPMProva.args,
-  integrationID: 'd2099459-0f10-40cd-85e1-06e77a678723',
-  layout: 'ZOOMED_FULL_BODY',
-};
-
-export const MoodChefAssistant = Template.bind({});
-MoodChefAssistant.args = {
-  memoriName: 'Mood Chef Assistant',
-  ownerUserName: 'andrea.patini3',
-  memoriID: 'fb4f9251-e7ec-4002-b0e5-ffa6e75b2fd8',
-  ownerUserID: '58770358-a5db-4b49-b3a4-734fc468e745',
-  tenantID: 'aisuru-staging.aclambda.online',
-  engineURL: 'https://engine-staging-tmp.memori.ai',
-  apiURL: 'https://backend-staging.memori.ai',
-  baseURL: 'https://aisuru-staging.aclambda.online',
-  uiLang: 'EN',
-  spokenLang: 'IT',
-  layout: 'ZOOMED_FULL_BODY',
-  integrationID: '6e289cc1-df99-4879-8a3a-fe10baea7eac',
-};
-
-export const GiovannaProvaWithPreviousSession = Template.bind({});
-GiovannaProvaWithPreviousSession.args = {
-  memoriName: 'Giovanna Test',
-  ownerUserName: 'andrea.patini3',
-  memoriID: '431d9819-c958-442c-a799-f90617371c0c',
-  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: 'EN',
-  spokenLang: 'IT',
-  layout: 'ZOOMED_FULL_BODY',
-  integrationID: 'e92ac275-39b5-474d-8f9e-826cc5284f1e',
-  initialQuestion: 'inizio simulazione',
-  sessionID: 'c1d13cec-1571-41a0-90bc-15bd2d62e263',
-};
-
 export const CreaRiassunti = Template.bind({});
 CreaRiassunti.args = {
   memoriName: 'Crea Riassunti',
@@ -287,22 +229,78 @@ NunzioFiore.args = {
   enableAudio: 'true',
 };
 
-export const DancingAvatar = Template.bind({});
-DancingAvatar.args = {
-  memoriName: 'Dancing Avatar',
+export const TestCustomAnimationsWithRPMSequence = Template.bind({});
+TestCustomAnimationsWithRPMSequence.args = {
+  memoriName: 'Test Custom Animations with RPM sequence',
   ownerUserName: 'andrea.patini3',
-  memoriID: '04a56ff0-c202-425d-907d-1ca0b7563e44',
+  memoriID: '45420d30-a103-455c-bab1-b708a0566a02',
   ownerUserID: '58770358-a5db-4b49-b3a4-734fc468e745',
   tenantID: 'aisuru-staging.aclambda.online',
+  engineURL: 'https://engine-staging-tmp.memori.ai',
   apiURL: 'https://backend-staging.memori.ai',
+  baseURL: 'https://aisuru-staging.aclambda.online',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  layout: 'ZOOMED_FULL_BODY',
+  showInstruct: 'false',
+  showSettings: 'true',
+  showClear: 'false',
+  showTypingText: 'false',
+  showOnlyLastMessages: 'false',
+  showTranslationOriginal: 'false',
+  showCopyButton: 'false',
+  showShare: 'true',
+  showLogin: 'false',
+  useMathFormatting: 'false',
+  showUpload: 'false',
+  autoStart: 'false',
+  enableAudio: 'true',
+  integrationID: 'a2b9bddc-bb8c-4b0e-b80f-b50ec90e9c99',
+};
+
+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-tmp.memori.ai',
+  apiURL: 'https://backend-staging.memori.ai',
   baseURL: 'https://aisuru-staging.aclambda.online',
   uiLang: 'IT',
   spokenLang: 'IT',
-  layout: 'FULLPAGE',
-  multilingual: 'true',
+  layout: 'TOTEM',
+  showInstruct: 'false',
+  showSettings: 'true',
+  showClear: 'false',
+  showTypingText: 'false',
+  showOnlyLastMessages: 'false',
+  showTranslationOriginal: 'false',
+  showCopyButton: 'false',
   showShare: 'true',
-  integrationID: '16a142a0-cb4e-4484-b2b1-662f965fc29c',
+  showLogin: 'false',
+  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-tmp.memori.ai',
+  apiURL: 'https://backend-staging.memori.ai',
+  baseURL: 'https://aisuru-staging.aclambda.online',
+  uiLang: 'IT',
+  spokenLang: 'IT',
+  layout: 'ZOOMED_FULL_BODY',
+  integrationID: '60a37903-44a2-48c2-82e3-c7b8b620cb64',
 };
 
 const TemplateWithBatchButton: Story<Props> = args => (

package/src/index.tsx

@@ -15,7 +15,6 @@ import MemoriWidget, {
 import { VisemeProvider } from './context/visemeContext';
 
 import { Toaster } from 'react-hot-toast';
-import { getTenant } from './helpers/tenant';
 import { safeParseJSON } from './helpers/utils';
 
 import i18n from './i18n';
@@ -217,8 +216,11 @@ const Memori: React.FC<Props> = ({
    * Fetches the Tenant data from the backend
    */
   const fetchTenant = useCallback(async () => {
-    const tenant = await getTenant(tenantID, baseURL);
-    if (tenant) setTenant(tenant);
+    const { tenant, ...resp } = await client.backend.tenant.getTenantConfig(
+      tenantID
+    );
+    if (tenant && resp.resultCode === 0) setTenant(tenant);
+    else console.debug('[TENANT]', resp, tenant);
   }, [tenantID, apiURL]);
   useEffect(() => {
     fetchTenant();