Enhance rework vulnerabilities inventory flyout

CHANGELOG.md

@@ -55,6 +55,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Added a toast message when there is an error creating a new group [#3804](https://github.com/wazuh/wazuh-kibana-app/pull/3804)
 - Added a step to start the agent to the deploy new Windowns agent guide [#3846](https://github.com/wazuh/wazuh-kibana-app/pull/3846)
 - Added 3 new panels to `Vulnerabilities/Inventory` [#3893](https://github.com/wazuh/wazuh-kibana-app/pull/3893)
+- Added new fields of `Vulnerabilities` to the details flyout [#3893](https://github.com/wazuh/wazuh-kibana-app/pull/3893) [#3908](https://github.com/wazuh/wazuh-kibana-app/pull/3908)
 
 ### Changed
 
@@ -75,6 +76,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Changed agent install codeblock copy button and powershell terminal warning [#3792](https://github.com/wazuh/wazuh-kibana-app/pull/3792)
 - Refactored as the plugin platform name and references is managed [#3811](https://github.com/wazuh/wazuh-kibana-app/pull/3811)
 - Removed `Dashboard` tab for the `Vulnerabilities` modules [#3893](https://github.com/wazuh/wazuh-kibana-app/pull/3893)
+- Display all fields in the `Table` tab when expading an alert row in the alerts tables of flyouts and the `Modules/Security Events/Dashboard` table [#3908](https://github.com/wazuh/wazuh-kibana-app/pull/3908)
 
 ### Fixed
 

public/components/agents/vuls/inventory/detail.tsx

@@ -129,17 +129,17 @@ export class Details extends Component {
       },
       {
         field: 'last_full_scan',
-        name: 'Last Full Scan',
+        name: 'Last full scan',
         icon: 'clock',
         link: false,
-        transformValue: formatUIDate
+        transformValue: this.beautifyDate
       },
       {
         field: 'last_partial_scan',
-        name: 'Last Partial Scan',
+        name: 'Last partial scan',
         icon: 'clock',
         link: false,
-        transformValue: formatUIDate
+        transformValue: this.beautifyDate
       },
       {
         field: 'published',
@@ -165,6 +165,13 @@ export class Details extends Component {
     ];
   }
 
+  // This method was created because Wazuh API returns 1970-01-01T00:00:00Z dates
+  // when vulnerability module is not configured
+  // its meant to render nothing when such date is received
+  beautifyDate(date: string) {
+    return ['', '1970-01-01T00:00:00Z'].includes(date) ? '-' : formatUIDate(date);
+  }
+
   viewInEvents = (ev) => {
     const { cve } = this.props.currentItem;
     if (this.props.view === 'extern') {
@@ -451,6 +458,7 @@ export class Details extends Component {
                   { field: 'rule.description', label: 'Description' },
                   { field: 'rule.level', label: 'Level' },
                   { field: 'rule.id', label: 'Rule ID' },
+                  { field: 'data.vulnerability.status', label: 'Status', width: '20%' },
                 ]}
                 includeFilters="vulnerability"
                 implicitFilters={implicitFilters}

public/components/common/modules/discover/discover.tsx

@@ -103,6 +103,7 @@ export const Discover = compose(
       initialFilters: object[];
       query?: { language: 'kuery' | 'lucene'; query: string };
       type?: any;
+      rowDetailsFields?: string[];
       updateTotalHits: Function;
       includeFilters?: string;
       initialColumns: ColumnDefinition[];
@@ -323,6 +324,8 @@ export const Discover = compose(
 
     toggleDetails = (item) => {
       const itemIdToExpandedRowMap = { ...this.state.itemIdToExpandedRowMap };
+      const { rowDetailsFields } = this.props;
+
       if (itemIdToExpandedRowMap[item._id]) {
         delete itemIdToExpandedRowMap[item._id];
         this.setState({ itemIdToExpandedRowMap });
@@ -336,6 +339,7 @@ export const Discover = compose(
               addFilter={(filter) => this.addFilter(filter)}
               addFilterOut={(filter) => this.addFilterOut(filter)}
               toggleColumn={(id) => this.addColumn(id)}
+              rowDetailsFields={rowDetailsFields}
             />
           </div>
         );
@@ -474,7 +478,7 @@ export const Discover = compose(
       const columns = columnsList.map((item) => {
         if (item === 'icon') {
           return {
-            width: '25px',
+            width: '2.3%',
             isExpander: true,
             render: (item) => {
               return (

public/components/common/modules/discover/row-details.tsx

@@ -60,6 +60,7 @@ export class RowDetails extends Component {
       },
       syscheck: Object
     }
+    rowDetailsFields?: string[]
   }
 
   constructor(props) {
@@ -94,6 +95,15 @@ export class RowDetails extends Component {
 
     const paths = (obj = {}, head = '') => {
       return Object.entries(obj)
+        .sort(([keyA], [keyB]) => {
+          if (keyA > keyB) {
+            return 1;
+          } else if (keyA < keyB) {
+            return -1;
+          } else {
+            return 0;
+          };
+        })        
         .reduce((product, [key, value]) => {
           let fullPath = addDelimiter(head, key)
           return isObject(value) ?
@@ -146,7 +156,10 @@ export class RowDetails extends Component {
 
 
   renderRows() {
-    const fieldsToShow = ['agent', 'cluster', 'manager', 'rule', 'decoder', 'syscheck', 'full_log', 'location'];
+    // By default show all available fields, otherwise show the fields specified in rowDetailsFields string array
+    const fieldsToShow = this.props.rowDetailsFields?.length ?
+      this.props.rowDetailsFields.sort() : Object.keys(this.props.item).sort();
+
     var rows: any[] = [];
     const isString = val => typeof val === 'string';
     for (var i = 0; i < fieldsToShow.length; i++) {