Fix for Notebook Observability Visualization loading

Signed-off-by: Peter Fitzgibbons <peter.fitzgibbons@gmail.com>
opensearch-project · Dec 20, 2023 · b93a8ff · b93a8ff
1 parent fd55726
commit b93a8ff
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 7 deletions.
diff --git a/public/components/notebooks/components/paragraph_components/para_output.tsx b/public/components/notebooks/components/paragraph_components/para_output.tsx
@@ -17,7 +17,7 @@ import {
   DashboardStart,
 } from '../../../../../../../src/plugins/dashboard/public';
 import { ParaType } from '../../../../../common/types/notebooks';
-import { uiSettingsService } from '../../../../../common/utils';
+import { getOSDHttp, getPPLService, uiSettingsService } from '../../../../../common/utils';
 import { QueryDataGridMemo } from './para_query_grid';
 
 const createQueryColumns = (jsonColumns: any[]) => {
@@ -125,6 +125,8 @@ const OutputBody = ({
           </>
         );
       case 'OBSERVABILITY_VISUALIZATION':
+        let http = getOSDHttp();
+        let pplService = getPPLService();
         let fromObs = moment(visInput?.timeRange?.from).format(dateFormat);
         let toObs = moment(visInput?.timeRange?.to).format(dateFormat);
         fromObs = fromObs === 'Invalid date' ? visInput.timeRange.from : fromObs;
@@ -139,14 +141,14 @@ const OutputBody = ({
             </EuiText>
             <div style={{ height: '300px', width: '100%' }}>
               <VisualizationContainer
-                http={props.http}
+                http={http}
                 editMode={false}
                 visualizationId={''}
                 onEditClick={onEditClick}
-                savedVisualizationId={para.visSavedObjId}
-                pplService={props.pplService}
-                fromTime={para.visStartTime}
-                toTime={para.visEndTime}
+                savedVisualizationId={visInput.visSavedObjId}
+                pplService={pplService}
+                fromTime={visInput?.timeRange?.from}
+                toTime={visInput?.timeRange?.to}
                 onRefresh={false}
                 pplFilterValue={''}
                 usedInNotebooks={true}

diff --git a/public/components/notebooks/components/paragraph_components/paragraphs.tsx b/public/components/notebooks/components/paragraph_components/paragraphs.tsx
@@ -169,7 +169,11 @@ export const Paragraphs = forwardRef((props: ParagraphProps, ref) => {
 
   useEffect(() => {
     if (para.isVizualisation) {
-      if (para.visSavedObjId !== '') setVisInput(JSON.parse(para.vizObjectInput));
+      if (para.visSavedObjId !== '') {
+        const parsedVisInput = JSON.parse(para.vizObjectInput);
+        setVisInput({ ...parsedVisInput, visSavedObjId: para.visSavedObjId });
+      }
+
       fetchVisualizations();
     }
   }, []);
@@ -199,6 +203,7 @@ export const Paragraphs = forwardRef((props: ParagraphProps, ref) => {
       filters: [],
       useMargins: false,
       id: vizUniqueId,
+      visSavedObjectId: objectId,
       timeRange: {
         to: para.visEndTime,
         from: para.visStartTime,