Moved from a hardcoded string to a dynamic one

slackhq · Feb 13, 2024 · 2a6fbbd · 2a6fbbd
1 parent 4d02fc9
commit 2a6fbbd
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 8 deletions.
diff --git a/src/datasource/components/Logs/LogsCell.tsx b/src/datasource/components/Logs/LogsCell.tsx
@@ -56,10 +56,11 @@ interface ExpandedDocumentProps {
     datasourceUid: string,
     datasourceName: string,
     datasourceField: string,
+    logMessageField: string,
 }
 
 
-const ExpandedDocument  = ({ log, index, datasourceUid, datasourceName, datasourceField }: ExpandedDocumentProps) => {
+const ExpandedDocument  = ({ log, index, datasourceUid, datasourceName, datasourceField, logMessageField }: ExpandedDocumentProps) => {
     // The index in the logs is off by one from the index in the table (due to the header row). In this
     // case we care about the index in the table, so add one to it.
     index += 1;
@@ -119,7 +120,7 @@ const ExpandedDocument  = ({ log, index, datasourceUid, datasourceName, datasour
                 </tr>
                 {
                     Array.from(log.keys()).map((key) => (
-                        key !== '_source' ?
+                        key !== logMessageField ?
                             <ExpandedLogKeyVal
                                 field={key}
                                 val={log.get(key)}
@@ -149,7 +150,7 @@ const ExpandedDocument  = ({ log, index, datasourceUid, datasourceName, datasour
 }
 
 
-const DocumentCell = (log: Log, style: any, rowIndex: number, expanded: boolean, datasourceUid: string, datasourceName: string, datasourceField: string) => (
+const DocumentCell = (log: Log, style: any, rowIndex: number, expanded: boolean, datasourceUid: string, datasourceName: string, datasourceField: string, logMessageField: string) => (
     <div
         style={{
                 display: 'inline-block',
@@ -164,7 +165,7 @@ const DocumentCell = (log: Log, style: any, rowIndex: number, expanded: boolean,
         <div style={{maxHeight: '115px', overflow: 'hidden'}}>
             {
                 Array.from(log.keys()).map((key) => (
-                    key !== '_source' ?
+                    key !== logMessageField ?
                         <LogKeyVal
                             field={key}
                             val={log.get(key)}
@@ -182,6 +183,7 @@ const DocumentCell = (log: Log, style: any, rowIndex: number, expanded: boolean,
                     datasourceUid={datasourceUid}
                     datasourceName={datasourceName}
                     datasourceField={datasourceField}
+                    logMessageField={logMessageField}
                 />)
 
             : ''
@@ -275,6 +277,7 @@ const LogCell = ({ columnIndex, rowIndex, style, data }) => {
     const datasourceUid: string = data.datasourceUid;
     const datasourceName: string = data.datasourceName;
     const datasourceField: string = data.datasourceField;
+    const logMessageField: string = data.logMessageField;
     const { setSize } = getLogTableContext();
     const darkModeEnabled = useTheme2().isDark ;
 
@@ -324,7 +327,7 @@ const LogCell = ({ columnIndex, rowIndex, style, data }) => {
     if (column.logColumnType === LogColumnType.TIME) {
         return TimestampCell(timestamp, style, rowIndex, expandedRows, handleOnClick);
     } else if (column.logColumnType === LogColumnType.DOCUMENT) {
-        return DocumentCell(log, style, rowIndex, expandedRows[rowIndex], datasourceUid, datasourceName, datasourceField);
+        return DocumentCell(log, style, rowIndex, expandedRows[rowIndex], datasourceUid, datasourceName, datasourceField, logMessageField);
     } else {
         return FieldCell();
     }

diff --git a/src/datasource/components/Logs/LogsTable.tsx b/src/datasource/components/Logs/LogsTable.tsx
@@ -33,9 +33,10 @@ interface LogsTableProps {
     setExpandedRows: ((value: boolean[] | ((preVar: boolean[]) => boolean[])) => void);
     setColumns: ((value: LogColumn[] | ((preVar: LogColumn[]) => LogColumn[])) => void);
     datasourceField: string;
+    logMessageField: string;
 }
 
-const LogsTable = ({ logs, timeField, columns, timestamps, expandedRows, setColumns, setExpandedRows, datasourceUid, datasourceName, datasourceField }: LogsTableProps) => {
+const LogsTable = ({ logs, timeField, columns, timestamps, expandedRows, setColumns, setExpandedRows, datasourceUid, datasourceName, datasourceField, logMessageField }: LogsTableProps) => {
     let gridRef: React.RefObject<Grid> = React.createRef<Grid>();
 
     // In order to get highly variable (and unknown at the time of rendering) row heights in a virtualized environment
@@ -79,7 +80,7 @@ const LogsTable = ({ logs, timeField, columns, timestamps, expandedRows, setColu
                             rowCount={logs.length + 1}
                             rowHeight={getSize}
                             width={width}
-                            itemData={{logs, timestamps, columns, timeField, setColumns, setExpandedRowsAndReRender, expandedRows, datasourceUid, datasourceName, datasourceField}}
+                            itemData={{logs, timestamps, columns, timeField, setColumns, setExpandedRowsAndReRender, expandedRows, datasourceUid, datasourceName, datasourceField, logMessageField}}
                         >
                             {LogCell}
                         </Grid>

diff --git a/src/datasource/components/Logs/LogsView.tsx b/src/datasource/components/Logs/LogsView.tsx
@@ -11,9 +11,10 @@ interface LogsViewProps {
     datasourceUid: string;
     datasourceName: string;
     datasourceField: string;
+    logMessageField: string;
 }
 
-const LogsView = ({ logs, timeField, timestamps, datasourceUid, datasourceName, datasourceField }: LogsViewProps) => {
+const LogsView = ({ logs, timeField, timestamps, datasourceUid, datasourceName, datasourceField, logMessageField }: LogsViewProps) => {
     const [columns, setColumns] = React.useState<LogColumn[]>([
         {
             logColumnType: LogColumnType.TIME,
@@ -46,6 +47,7 @@ const LogsView = ({ logs, timeField, timestamps, datasourceUid, datasourceName,
             datasourceUid={datasourceUid}
             datasourceName={datasourceName}
             datasourceField={datasourceField}
+            logMessageField={logMessageField}
         />
     )
 

diff --git a/src/pages/explore.tsx b/src/pages/explore.tsx
@@ -428,6 +428,11 @@ const KalDBLogsRenderer = ({ model }: SceneComponentProps<KalDBLogs>) => {
   let linkedDatasource = null;
   let linkedDatasourceName = ''; 
   let linkedDatasourceField = '';
+  let logMessageField = '';
+
+  if (currentDataSource) {
+    logMessageField = currentDataSource.jsonData.logMessageField;
+  }
 
   if (currentDataSource && currentDataSource.jsonData.dataLinks?.length > 0) {
     linkedDatasourceUid = currentDataSource.jsonData.dataLinks[0].datasourceUid;
@@ -455,6 +460,7 @@ const KalDBLogsRenderer = ({ model }: SceneComponentProps<KalDBLogs>) => {
               datasourceUid={linkedDatasourceUid}
               datasourceName={linkedDatasourceName}
               datasourceField={linkedDatasourceField}
+              logMessageField={logMessageField}
             />
         </div>
       )}