feat: additional tests

src/components/FlowModal/ParsedView/Configure/validateDataScheme.spec.ts

@@ -0,0 +1,30 @@
+import { sampleBrokenParsedViewConfig, sampleBrokenParsedViewConfig2, sampleBrokenParsedViewConfig3, sampleBrokenParsedViewConfig4, sampleParsedViewConfig } from "test-samples/sample-parsed-view-config"
+import { validateDataScheme } from "./validateDataScheme"
+
+describe('validateDataScheme', () => {
+
+    it('should correctly validate data scheme for valid config', () => {
+        const result = validateDataScheme(sampleParsedViewConfig)
+        expect(result).toEqual(true)
+    })
+
+    it('should correctly validate data scheme for invalid config', () => {
+        const result = validateDataScheme(sampleBrokenParsedViewConfig)
+        expect(result).toEqual(false)
+    })
+
+    it('should correctly validate data scheme for invalid config 2', () => {
+        const result = validateDataScheme(sampleBrokenParsedViewConfig2 as any)
+        expect(result).toEqual(false)
+    })
+
+    it('should correctly validate data scheme for invalid config 3', () => {
+        const result = validateDataScheme(sampleBrokenParsedViewConfig3 as any)
+        expect(result).toEqual(false)
+    })
+
+    it('should correctly validate data scheme for invalid config 4', () => {
+        const result = validateDataScheme(sampleBrokenParsedViewConfig4 as any)
+        expect(result).toEqual(false)
+    })
+})

src/components/FlowModal/ParsedView/Configure/validateDataScheme.ts

@@ -5,7 +5,7 @@ export const validateDataScheme = (dataScheme: ParsedLabel[]): boolean => {
         return false
     }
     if (dataScheme.every((item) => {
-        return Array.isArray(item.labels) && typeof item.title === 'string'
+        return Array.isArray(item.labels) && item.labels.length > 0 && typeof item.title === 'string'
     })) {
         return true
     }

src/components/FlowModal/ParsedView/ParsedView.spec.ts

@@ -0,0 +1,20 @@
+import { sampleParsedViewConfig, sampleParsedViewConfig2 } from "test-samples/sample-parsed-view-config";
+import { parseData } from "./ParsedView";
+import { parsedViewSampleDataSIP, parsedViewSampleDataSIPAfterParse, parsedViewSampleDataSIPAfterParseSecondConfig } from "test-samples/sample-data";
+
+
+describe('ParsedView', () => {
+
+    it('should correctly parse SIP data based on data scheme', () => {
+        const result = parseData(parsedViewSampleDataSIP, sampleParsedViewConfig, () => { })
+        expect(result).toEqual(parsedViewSampleDataSIPAfterParse);
+    })
+    it('should correctly parse RTCP data based on data scheme', () => {
+        const result = parseData(parsedViewSampleDataSIP, sampleParsedViewConfig, () => { })
+        expect(result).toEqual(parsedViewSampleDataSIPAfterParse);
+    })
+    it('should correctly parse SIP data based on second data scheme', () => {
+        const result = parseData(parsedViewSampleDataSIP, sampleParsedViewConfig2, () => { })
+        expect(result).toEqual(parsedViewSampleDataSIPAfterParseSecondConfig);
+    })
+});

src/components/FlowModal/ParsedView/ParsedView.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
 import { DetailItem } from '../DetailItem';
 import { ParsedLabel } from './DataScheme';
 import { parseDataIntoListOfFields } from 'helpers/dataProcessors/parseDataIntoListOfFields';
+import { sampleParsedViewConfig, sampleParsedViewConfig2 } from 'test-samples/sample-parsed-view-config';
 interface Value {
     value: string
     title: string
@@ -13,35 +14,11 @@ interface Props {
     dataScheme: ParsedLabel[]
 }
 export const ParsedView: React.FC<any> = ({ data, theme, dataScheme }: Props): JSX.Element | null => {
+    console.log(data)
     const [values, setValues] = useState<Value[]>([])
+    dataScheme = sampleParsedViewConfig2
     useEffect(() => {
-        const labelMap = new Map()
-        Object.entries(data).forEach((item: any) => {
-            let [key, value]: any = item
-            parseDataIntoListOfFields(value, labelMap, key)
-        })
-        const parsedValues = dataScheme.map((item) => {
-            let value = ''
-            if (item.isJSON) {
-                value = JSON.stringify(labelMap.get(item.labels[0]), null, 2)
-            } else {
-                const labelData = item.labels.map((label) => {
-                    return labelMap.get(label)?.value ?? ''
-                })
-
-                value = labelData.join(item.separator ?? ' | ')
-            }
-            if (item.parser) {
-                value = item.parser(value)
-            }
-            return {
-                value: value,
-                tooltip: item.tooltip,
-                title: item.title
-            }
-        })
-
-        setValues(parsedValues)
+        parseData(data, dataScheme, setValues);
     }, [data, dataScheme])
 
     return (
@@ -52,3 +29,32 @@ export const ParsedView: React.FC<any> = ({ data, theme, dataScheme }: Props): J
         </>
     );
 }
+export function parseData(data: any, dataScheme: ParsedLabel[], setValues: React.Dispatch<React.SetStateAction<Value[]>>) {
+    const labelMap = new Map();
+    Object.entries(data).forEach((item: any) => {
+        let [key, value]: any = item;
+        parseDataIntoListOfFields(value, labelMap, key);
+    });
+    const parsedValues = dataScheme.map((item) => {
+        let value = '';
+        if (item.isJSON) {
+            value = JSON.stringify(labelMap.get(item.labels[0]), null, 2);
+        } else {
+            const labelData = item.labels.map((label) => {
+                return labelMap.get(label)?.value ?? '';
+            });
+
+            value = labelData.join(item.separator ?? ' | ');
+        }
+        if (item.parser) {
+            value = item.parser(value);
+        }
+        return {
+            value: value,
+            tooltip: item.tooltip,
+            title: item.title
+        };
+    });
+    setValues(parsedValues);
+    return parsedValues
+}

src/components/FlowPanel.tsx

@@ -15,6 +15,7 @@ import { pcapExporter, textExporter } from 'helpers/exporters';
 import { FlowOptions } from 'types.js';
 import { FilterPanel, Filters, defaultFilters } from './FilterPanel/FilterPanel';
 import { FlowModal } from './FlowModal/FlowModal';
+import { sampleData } from 'test-samples/sample-data';
 
 
 
@@ -77,8 +78,8 @@ const getStyles = ({ name: themeName }: GrafanaTheme2) => {
 
 
 
-export const FlowPanel = (props: MyPanelProps) => {
-    const { options, data, width, height } = props
+export const FlowPanel = ({ options, data, width, height }: MyPanelProps) => {
+    data = sampleData    
     const [flowData, setFlowData] = useState({ actors: [], data: [] });
     const [modalIsOpen, setModalIsOpen] = useState(false);
     const [modalData, setModalData] = useState({});

src/helpers/dataProcessors/filterFlowItems.ts

@@ -35,7 +35,6 @@ export const filterFlowItems = (data: PanelData, options: any, setFlowData: Func
                         isMethodDisabled ||
                         isTypeDisabled ||
                         isCallidDisabled
-                    console.log(getOptionValue(options.details))
                     return {
                         messageID: getOptionValue(options.colorGenerator) || 'Title',
                         details: getOptionValue(options.details) || '',