Fix styles in small height viewports

[JuanGarriuz]

Description

• Fix the discover table small viewport and remove duplicated code in CSS classes.
• Fix invalid date in the grid in Firefox and Safari.
• Fix the data grid full screen height and scroll.
• Set the minimum width for wazuh discover flyout field headers.
• Fix date format with pinned agent in Mitre att&ck -> Framework flyout

Issues Resolved

• New discover table gets hidden in small height viewports #6740

Evidence

Grabacion.2024-06-05.130411.mp4

Test

Data grid

• Check that inventory tabs around the app are rendered correctly (The tab selector doesn't must stay on the top of view)
• Check that the full screen in the inventory tab table works as expected.
• Check Threat intelligence > Threat Hunting > dashboard view render correctly

Controls flyout details

• In Security operations > TSC > Controls checks Flyout > Rule > Details don't shows data in JSON format

Fix date format with pinned agent in Mitre att&ck -> Framework flyout

• With pinned agent in Mitre att&ck -> Framework flyout, check the date is formated

Check List

• All tests pass
  • yarn test:jest
• New functionality includes testing.
• New functionality has been documented.
• Update CHANGELOG.md
• Commits are signed per the DCO using --signoff

[yenienserrano]

Test

• 🟡 Check that inventory tabs around the app are rendered correctly (The tab selector doesn't must stay on the top of view)

Details

I don't know if I understood the issue correctly but maybe you also want to remove the scroll inside the table so that the page only has the scroll.

Screen.Recording.2024-06-06.at.3.56.41.PM.mov

• 🔴 Check full screen in the inventory tab table works as expected.

Details

🟢 Events

🔴 Threat Hunting / dashboard

Table options are not visible

[jbiset]

CR: In Progress - Comment added

Test UI 🔴

Check that inventory tabs around the app are rendered correctly (The tab selector doesn't must stay on the top of view) 🔴

There is a difference between table scrolling in Chrome and Firefox. In Chrome the table does not have a scrollbar and grows by the size of the table. On the other hand, in Firefox the table does not grow and a scroolbar appears for the body of the table.

• Chrome

Evidence_1_Chrome.webm

• Firefox

Evidence_1_Firefox.webm

Check full screen in the inventory tab table works as expected. 🟢

• Chrome

Evidence_2_Chrome.webm

• Firefox

Evidence_2_Firefox.webm

[github-actions]

Wazuh Check Updates plugin code coverage (Jest) test	%	values
Statements	76.44%	( 172 / 225 )
Branches	58.65%	( 61 / 104 )
Functions	61.7%	( 29 / 47 )
Lines	76.44%	( 172 / 225 )

[github-actions]

Wazuh Core plugin code coverage (Jest) test	%	values
Statements	45.96%	( 399 / 868 )
Branches	41.97%	( 157 / 374 )
Functions	44.01%	( 136 / 309 )
Lines	46.16%	( 397 / 860 )

[github-actions]

Main plugin code coverage (Jest) test	%	values
Statements	11.38%	( 3897 / 34235 )
Branches	7.63%	( 1721 / 22550 )
Functions	10.67%	( 894 / 8375 )
Lines	11.54%	( 3794 / 32867 )

[yenienserrano]

Test

Data grid

• Check that inventory tabs around the app are rendered correctly (The tab selector doesn't must stay on the top of view)
• Check that the full screen in the inventory tab table works as expected.
• Check Threat intelligence > Threat Hunting > dashboard view render correctly

Details

Screen.Recording.2024-06-07.at.9.25.25.PM.mov

Controls flyout details

• In Security operations > TSC > Controls checks Flyout > Rule > Details don't shows data in JSON format

Details

Fix date format with pinned agent in Mitre att&ck -> Framework flyout

• With pinned agent in Mitre att&ck -> Framework flyout, check the date is formated

Details

[jbiset]

CR: 🟢

Test UI 🟢

Check that inventory tabs around the app are rendered correctly (The tab selector doesn't must stay on the top of view) 🟢

• Chrome

Evidence_1_Chrome_ok.webm

• Firefox

Evidence_1_Firefox_ok.webm

Check full screen in the inventory tab table works as expected. 🟢

• Chrome

Evidence_2_Chrome.webm

• Firefox

Evidence_2_Firefox.webm

Check Threat intelligence > Threat Hunting > dashboard view render correctly 🟢

• Chrome

Evidence_3_Chrome_ok.webm

• Firefox

Evidence_3_Firefox_ok.webm

[yenienserrano]

LGTM