Skip to content

[Security Solution] Use static declaration for navigation hierarchy#215969

Merged
tsullivan merged 32 commits intoelastic:mainfrom
tsullivan:fix/security-solution-212903-static-hierarchy
Apr 3, 2025
Merged

[Security Solution] Use static declaration for navigation hierarchy#215969
tsullivan merged 32 commits intoelastic:mainfrom
tsullivan:fix/security-solution-212903-static-hierarchy

Conversation

@tsullivan
Copy link
Member

@tsullivan tsullivan commented Mar 25, 2025

Summary

Part of Epic: https://github.com/elastic/kibana-team/issues/1439
Addresses #212903, but does not remove the landing page access. The landing page access will be removed in #210893

Changes

  1. Converts the declaration of the Security Solution side navigation for serverless and stateful projects into a static declaration, rather than algorithmically parsing registered links to dynamically build the declaration.
  2. Updates the contents of the "Assets" panel to prepare for removal of that landing page.
  3. Eliminates the top-level nesting of the nav items, which removes the extra space between the project title and the first nav items. See 45454bd

Known issue: Clicking the "Browse integrations" button does not close the secondary nav panel. Doing that will be a relatively simple chore, but will require some changes in the SharedUX chrome-navigation package, as well as the LinkButton component in the Security Solution navigation-links package.

Screenshots

Serverless
static-nav-declaration-security-serverless-3iorteikghiskhgkseh

Stateful/ECH
static-nav-declaration-security-stateful-3iorteikghiskhgkseh

Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

@tsullivan tsullivan force-pushed the fix/security-solution-212903-static-hierarchy branch from 5c99edc to 2eb2a1f Compare March 26, 2025 19:27
@tsullivan tsullivan force-pushed the fix/security-solution-212903-static-hierarchy branch from 2eb2a1f to 199a249 Compare March 26, 2025 22:14
@tsullivan tsullivan added Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:SharedUX Platform AppEx-SharedUX (formerly Global Experience) t// labels Mar 26, 2025
@tsullivan tsullivan self-assigned this Mar 26, 2025
@tsullivan tsullivan added the release_note:skip Skip the PR/issue when compiling release notes label Mar 26, 2025
@tsullivan tsullivan force-pushed the fix/security-solution-212903-static-hierarchy branch from feec3f3 to e241e08 Compare March 27, 2025 16:47
it('navigates to the Fleet page', () => {
navigateFromHeaderTo(ServerlessHeaders.FLEET, true);
cy.url().should('include', FLEET_URL);
});
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Per @paulewing, the removal of Fleet from the primary nav "was purposeful to focus those asset mngmt workflows in a single asset UX"

Copy link
Contributor

@tomsonpl tomsonpl left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sad to see my AI_SOC changes go away after just a week ;) but it looks great and also tested locally and it all works great 👍
Thanks!

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
securitySolution 7176 7171 -5
securitySolutionEss 93 95 +2
total -3

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id before after diff
securitySolution 128 127 -1

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
securitySolution 8.9MB 8.9MB -10.9KB
securitySolutionEss 36.0KB 34.9KB -1.1KB
total -12.0KB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id before after diff
securitySolution 35 34 -1

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id before after diff
securitySolution 88.8KB 88.8KB -57.0B
securitySolutionEss 15.5KB 34.4KB +18.9KB
securitySolutionServerless 35.0KB 51.3KB +16.3KB
total +35.1KB
Unknown metric groups

API count

id before after diff
securitySolution 196 195 -1

async chunk count

id before after diff
securitySolution 126 124 -2

History

cc @tsullivan

Copy link
Contributor

@semd semd left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Thanks Tim

@tsullivan tsullivan added backport:version Backport to applied version labels v9.1.0 v8.19.0 and removed backport:prev-major labels Apr 3, 2025
@tsullivan tsullivan merged commit ef907a3 into elastic:main Apr 3, 2025
18 checks passed
@kibanamachine
Copy link
Contributor

Starting backport for target branches: 8.x

https://github.com/elastic/kibana/actions/runs/14247070283

@kibanamachine
Copy link
Contributor

💔 All backports failed

Status Branch Result
8.x Backport failed because of merge conflicts

Manual backport

To create the backport manually run:

node scripts/backport --pr 215969

Questions ?

Please refer to the Backport tool documentation

tsullivan added a commit to tsullivan/kibana that referenced this pull request Apr 4, 2025
Part of elastic/kibana-team#1439
Pulled from elastic#210893
elastic#215969

## Summary

1. Allow item in the secondary panel to use the `renderItem` field
2. Fix handling of `defaultIsCollapsed` for items in the secondary panel
3. Allow secondary panel to contain a mix of ungrouped items as well as
sub-groups of items

![alksdjnfgklsdfhglskdhkds](https://github.com/user-attachments/assets/11d316d6-6c9a-4743-897f-93c40efa9013)

4. Fix the flagging of the "active" parent in the main nav panel, based
on the current URL

![jhgkdfgkjfhkhn](https://github.com/user-attachments/assets/b5f6efe3-e8f5-494b-bc12-abbd51acc12a)

### Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

(cherry picked from commit 05a8703)

# Conflicts:
#	src/platform/packages/shared/shared-ux/chrome/navigation/src/ui/navigation.stories.tsx
tsullivan added a commit to tsullivan/kibana that referenced this pull request Apr 4, 2025
Part of elastic/kibana-team#1439
Pulled from elastic#210893
elastic#215969

## Summary

1. Allow item in the secondary panel to use the `renderItem` field
2. Fix handling of `defaultIsCollapsed` for items in the secondary panel
3. Allow secondary panel to contain a mix of ungrouped items as well as
sub-groups of items

![alksdjnfgklsdfhglskdhkds](https://github.com/user-attachments/assets/11d316d6-6c9a-4743-897f-93c40efa9013)

4. Fix the flagging of the "active" parent in the main nav panel, based
on the current URL

![jhgkdfgkjfhkhn](https://github.com/user-attachments/assets/b5f6efe3-e8f5-494b-bc12-abbd51acc12a)

### Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

(cherry picked from commit 05a8703)

# Conflicts:
#	src/platform/packages/shared/shared-ux/chrome/navigation/src/ui/navigation.stories.tsx
@tsullivan
Copy link
Member Author

💚 All backports created successfully

Status Branch Result
8.x

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

tsullivan added a commit to tsullivan/kibana that referenced this pull request Apr 4, 2025
…lastic#215969)

## Summary

Part of Epic: elastic/kibana-team#1439
Addresses elastic#212903, but does not
remove the landing page access. The landing page access will be removed
in elastic#210893

**Changes**
1. Converts the declaration of the Security Solution side navigation for
serverless and stateful projects into a static declaration, rather than
algorithmically parsing registered links to dynamically build the
declaration.
2. Updates the contents of the "Assets" panel to prepare for removal of
that landing page.
3. Eliminates the top-level nesting of the nav items, which removes the
extra space between the project title and the first nav items. See
elastic@45454bd

**Known issue**: Clicking the "Browse integrations" button does not
close the secondary nav panel. Doing that will be a relatively simple
chore, but will require some changes in the SharedUX chrome-navigation
package, as well as the `LinkButton` component in the Security Solution
navigation-links package.

### Screenshots
Serverless

![static-nav-declaration-security-serverless-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/47bcbea9-7e3c-481e-b1b8-4b13bb5d63b1)

Stateful/ECH

![static-nav-declaration-security-stateful-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/3d3c8a0e-95d1-4da7-a657-c824577b6ec1)

### Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
(cherry picked from commit ef907a3)

# Conflicts:
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/ai_soc/ai_soc_navigation.ts
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/side_navigation.ts
#	x-pack/test/security_solution_cypress/cypress/e2e/explore/navigation/navigation.cy.ts
#	x-pack/test/security_solution_cypress/cypress/screens/serverless_security_header.ts
@kibanamachine kibanamachine added the backport missing Added to PRs automatically when the are determined to be missing a backport. label Apr 7, 2025
@kibanamachine
Copy link
Contributor

Looks like this PR has a backport PR but it still hasn't been merged. Please merge it ASAP to keep the branches relatively in sync.

tsullivan added a commit that referenced this pull request Apr 8, 2025
…rchy (#215969) (#217248)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Security Solution] Use static declaration for navigation hierarchy
(#215969)](#215969)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Tim
Sullivan","email":"tsullivan@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-04-03T15:38:04Z","message":"[Security
Solution] Use static declaration for navigation hierarchy
(#215969)\n\n## Summary\n\nPart of Epic:
https://github.com/elastic/kibana-team/issues/1439\nAddresses
#212903, but does not\nremove
the landing page access. The landing page access will be removed\nin
https://github.com/elastic/kibana/pull/210893\n\n**Changes**\n1.
Converts the declaration of the Security Solution side navigation
for\nserverless and stateful projects into a static declaration, rather
than\nalgorithmically parsing registered links to dynamically build
the\ndeclaration.\n2. Updates the contents of the \"Assets\" panel to
prepare for removal of\nthat landing page.\n3. Eliminates the top-level
nesting of the nav items, which removes the\nextra space between the
project title and the first nav items.
See\nhttps://github.com//pull/215969/commits/45454bdc4d03cc793705fc4cef66f67620a98b59\n\n**Known
issue**: Clicking the \"Browse integrations\" button does not\nclose the
secondary nav panel. Doing that will be a relatively simple\nchore, but
will require some changes in the SharedUX chrome-navigation\npackage, as
well as the `LinkButton` component in the Security
Solution\nnavigation-links package.\n\n###
Screenshots\nServerless\n\n![static-nav-declaration-security-serverless-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/47bcbea9-7e3c-481e-b1b8-4b13bb5d63b1)\n\nStateful/ECH\n\n![static-nav-declaration-security-stateful-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/3d3c8a0e-95d1-4da7-a657-c824577b6ec1)\n\n###
Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers
should verify this PR satisfies this list as well.\n\n- [x] Any text
added follows [EUI's
writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\nsentence case text and includes
[i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n-
[x] [Unit or
functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere
updated or added to match the most common
scenarios\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"ef907a32f2ca3885d60aebd4875f5c8104ee99b1","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team:
SecuritySolution","Team:SharedUX","backport:version","v9.1.0","v8.19.0"],"title":"[Security
Solution] Use static declaration for navigation
hierarchy","number":215969,"url":"https://github.com/elastic/kibana/pull/215969","mergeCommit":{"message":"[Security
Solution] Use static declaration for navigation hierarchy
(#215969)\n\n## Summary\n\nPart of Epic:
https://github.com/elastic/kibana-team/issues/1439\nAddresses
#212903, but does not\nremove
the landing page access. The landing page access will be removed\nin
https://github.com/elastic/kibana/pull/210893\n\n**Changes**\n1.
Converts the declaration of the Security Solution side navigation
for\nserverless and stateful projects into a static declaration, rather
than\nalgorithmically parsing registered links to dynamically build
the\ndeclaration.\n2. Updates the contents of the \"Assets\" panel to
prepare for removal of\nthat landing page.\n3. Eliminates the top-level
nesting of the nav items, which removes the\nextra space between the
project title and the first nav items.
See\nhttps://github.com//pull/215969/commits/45454bdc4d03cc793705fc4cef66f67620a98b59\n\n**Known
issue**: Clicking the \"Browse integrations\" button does not\nclose the
secondary nav panel. Doing that will be a relatively simple\nchore, but
will require some changes in the SharedUX chrome-navigation\npackage, as
well as the `LinkButton` component in the Security
Solution\nnavigation-links package.\n\n###
Screenshots\nServerless\n\n![static-nav-declaration-security-serverless-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/47bcbea9-7e3c-481e-b1b8-4b13bb5d63b1)\n\nStateful/ECH\n\n![static-nav-declaration-security-stateful-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/3d3c8a0e-95d1-4da7-a657-c824577b6ec1)\n\n###
Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers
should verify this PR satisfies this list as well.\n\n- [x] Any text
added follows [EUI's
writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\nsentence case text and includes
[i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n-
[x] [Unit or
functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere
updated or added to match the most common
scenarios\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"ef907a32f2ca3885d60aebd4875f5c8104ee99b1"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/215969","number":215969,"mergeCommit":{"message":"[Security
Solution] Use static declaration for navigation hierarchy
(#215969)\n\n## Summary\n\nPart of Epic:
https://github.com/elastic/kibana-team/issues/1439\nAddresses
#212903, but does not\nremove
the landing page access. The landing page access will be removed\nin
https://github.com/elastic/kibana/pull/210893\n\n**Changes**\n1.
Converts the declaration of the Security Solution side navigation
for\nserverless and stateful projects into a static declaration, rather
than\nalgorithmically parsing registered links to dynamically build
the\ndeclaration.\n2. Updates the contents of the \"Assets\" panel to
prepare for removal of\nthat landing page.\n3. Eliminates the top-level
nesting of the nav items, which removes the\nextra space between the
project title and the first nav items.
See\nhttps://github.com//pull/215969/commits/45454bdc4d03cc793705fc4cef66f67620a98b59\n\n**Known
issue**: Clicking the \"Browse integrations\" button does not\nclose the
secondary nav panel. Doing that will be a relatively simple\nchore, but
will require some changes in the SharedUX chrome-navigation\npackage, as
well as the `LinkButton` component in the Security
Solution\nnavigation-links package.\n\n###
Screenshots\nServerless\n\n![static-nav-declaration-security-serverless-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/47bcbea9-7e3c-481e-b1b8-4b13bb5d63b1)\n\nStateful/ECH\n\n![static-nav-declaration-security-stateful-3iorteikghiskhgkseh](https://github.com/user-attachments/assets/3d3c8a0e-95d1-4da7-a657-c824577b6ec1)\n\n###
Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers
should verify this PR satisfies this list as well.\n\n- [x] Any text
added follows [EUI's
writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing),
uses\nsentence case text and includes
[i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n-
[x] [Unit or
functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere
updated or added to match the most common
scenarios\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"ef907a32f2ca3885d60aebd4875f5c8104ee99b1"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->
@kibanamachine kibanamachine removed the backport missing Added to PRs automatically when the are determined to be missing a backport. label Apr 8, 2025
semd added a commit that referenced this pull request Apr 28, 2025
## Summary

This PR updates and simplifies the general architecture of the Security
Solution links, removing unnecessary code.

The new architecture leverages the static `navigationTree` files. This
approach was discussed and agreed with @tsullivan (Shared-UX team) and
introduced in [this PR](#215969).

With these changes, the `navigationTree` becomes the SSoT (Single Source
of Truth) for the links hierarchy. This is done by registering the
Security Solution plugin `deepLinks` using the regular
`ApplicationLinks` information, but following the same hierarchy as the
`navigationTree`. This ensures consistency across the app and keeps the
code DRY.

>[!note]
These changes only affect the new _Solution navigation_. The _Classic
navigation_ remains unchanged and isolated, as it is expected to be
deprecated and removed in the near future.

### Architecture change

- The "links switchers", which were functions to programmatically change
the links hierarchy, have been removed.
- The `NavigationLinks` from which we were generating the
`navigationTree` programatically have also been dropped.
- The SecuritySolution plugin `deepLinks` are now generated using the
`ApplicationLinks` for the link configuration (title, path...) and the
current `navigationTree` for the hierarchy.

#### Previous architecture
![Old Security Serverless links
architecture](https://github.com/user-attachments/assets/0c9db269-bd67-4967-9ca1-bec5e874abff)

#### New architecture
![New Security Serverless links
architecture](https://github.com/user-attachments/assets/9ff24ff8-3ce9-455e-ad76-4baa6b11daa1)

>[!important]
The landing pages (Rules, Explore, Assets...) were made inaccessible
recently by the shared-ux team
([PR](#210893)) in the new
Solution navigation as part of an effort to unify with the rest of
solutions. This fact also helped simplify the architecture.

>[!tip]
We have multiple static `navigationTree` definitions, which are used
depending on the serverless product tier. Right now, we have the
"default" `navigationTree` used in the _essentials_ and _complete_
tiers, and the "AI" `navigationTree` used in the new _searchAiLake_
tier.

This approach ensures consistency for the links' locations across
Kibana: the "left navigation", the "breadcrumbs", and the "global
search" will always be aligned.

### Screenshots

#### ECH navigations

| Classic nav | Solution nav |
|-|-|
|<img width="248" alt="classic"
src="https://github.com/user-attachments/assets/bb9e722e-316e-4c04-9978-068c35680382"
/>|<img width="248" alt="solution_nav"
src="https://github.com/user-attachments/assets/a993ce49-b780-4405-b829-4d36023ae627"
/>|


#### Serverless navigations

| Regular tiers | AI for SOC |
|-|-|
|<img width="248" alt="regular_serverless_nav"
src="https://github.com/user-attachments/assets/d782bf49-6c76-4414-a807-35245a5e9883"
/>|<img width="248" alt="ai_nav"
src="https://github.com/user-attachments/assets/25d9950d-77c8-4d44-ab53-4b07423713af"
/>|

#### Example of hierarchy for the `Endpoints` page:

##### Classic nav

![classic_nav_hierarchy](https://github.com/user-attachments/assets/d4c41c0a-f24f-469d-843c-10ff5b3c5174)

##### Solution nav

![solution_nav_hierarchy](https://github.com/user-attachments/assets/e7f753e2-a499-4130-9bd0-9d22788d612b)

### Other changes

- `NavLinks` are no longer used by the Solution navigation and have been
deprecated. They are only used in the Classic navigation now and will be
removed along with it.
- `ExternalPageNames` are no longer used and have been removed.
- `ApplicationLinks` observables moved to a singleton class.
- Link-related hooks have been moved to their own `links_hooks.ts` file.

### Next steps

When the Classic navigation is deprecated, we'll be able to:

- Define a flat structure of `ApplicationLinks` and remove the concept
of `category` in them.
- Remove Classic Security navigation components.
- Remove all the landing pages and their components in the navigation
package.


The
[docs](https://docs.elastic.dev/security-solution/dev-docs/app-links)
will be updated once this is merged.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
akowalska622 pushed a commit to akowalska622/kibana that referenced this pull request May 29, 2025
…c#217890)

## Summary

This PR updates and simplifies the general architecture of the Security
Solution links, removing unnecessary code.

The new architecture leverages the static `navigationTree` files. This
approach was discussed and agreed with @tsullivan (Shared-UX team) and
introduced in [this PR](elastic#215969).

With these changes, the `navigationTree` becomes the SSoT (Single Source
of Truth) for the links hierarchy. This is done by registering the
Security Solution plugin `deepLinks` using the regular
`ApplicationLinks` information, but following the same hierarchy as the
`navigationTree`. This ensures consistency across the app and keeps the
code DRY.

>[!note]
These changes only affect the new _Solution navigation_. The _Classic
navigation_ remains unchanged and isolated, as it is expected to be
deprecated and removed in the near future.

### Architecture change

- The "links switchers", which were functions to programmatically change
the links hierarchy, have been removed.
- The `NavigationLinks` from which we were generating the
`navigationTree` programatically have also been dropped.
- The SecuritySolution plugin `deepLinks` are now generated using the
`ApplicationLinks` for the link configuration (title, path...) and the
current `navigationTree` for the hierarchy.

#### Previous architecture
![Old Security Serverless links
architecture](https://github.com/user-attachments/assets/0c9db269-bd67-4967-9ca1-bec5e874abff)

#### New architecture
![New Security Serverless links
architecture](https://github.com/user-attachments/assets/9ff24ff8-3ce9-455e-ad76-4baa6b11daa1)

>[!important]
The landing pages (Rules, Explore, Assets...) were made inaccessible
recently by the shared-ux team
([PR](elastic#210893)) in the new
Solution navigation as part of an effort to unify with the rest of
solutions. This fact also helped simplify the architecture.

>[!tip]
We have multiple static `navigationTree` definitions, which are used
depending on the serverless product tier. Right now, we have the
"default" `navigationTree` used in the _essentials_ and _complete_
tiers, and the "AI" `navigationTree` used in the new _searchAiLake_
tier.

This approach ensures consistency for the links' locations across
Kibana: the "left navigation", the "breadcrumbs", and the "global
search" will always be aligned.

### Screenshots

#### ECH navigations

| Classic nav | Solution nav |
|-|-|
|<img width="248" alt="classic"
src="https://github.com/user-attachments/assets/bb9e722e-316e-4c04-9978-068c35680382"
/>|<img width="248" alt="solution_nav"
src="https://github.com/user-attachments/assets/a993ce49-b780-4405-b829-4d36023ae627"
/>|


#### Serverless navigations

| Regular tiers | AI for SOC |
|-|-|
|<img width="248" alt="regular_serverless_nav"
src="https://github.com/user-attachments/assets/d782bf49-6c76-4414-a807-35245a5e9883"
/>|<img width="248" alt="ai_nav"
src="https://github.com/user-attachments/assets/25d9950d-77c8-4d44-ab53-4b07423713af"
/>|

#### Example of hierarchy for the `Endpoints` page:

##### Classic nav

![classic_nav_hierarchy](https://github.com/user-attachments/assets/d4c41c0a-f24f-469d-843c-10ff5b3c5174)

##### Solution nav

![solution_nav_hierarchy](https://github.com/user-attachments/assets/e7f753e2-a499-4130-9bd0-9d22788d612b)

### Other changes

- `NavLinks` are no longer used by the Solution navigation and have been
deprecated. They are only used in the Classic navigation now and will be
removed along with it.
- `ExternalPageNames` are no longer used and have been removed.
- `ApplicationLinks` observables moved to a singleton class.
- Link-related hooks have been moved to their own `links_hooks.ts` file.

### Next steps

When the Classic navigation is deprecated, we'll be able to:

- Define a flat structure of `ApplicationLinks` and remove the concept
of `category` in them.
- Remove Classic Security navigation components.
- Remove all the landing pages and their components in the navigation
package.


The
[docs](https://docs.elastic.dev/security-solution/dev-docs/app-links)
will be updated once this is merged.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
semd added a commit to semd/kibana that referenced this pull request May 29, 2025
…c#217890)

## Summary

This PR updates and simplifies the general architecture of the Security
Solution links, removing unnecessary code.

The new architecture leverages the static `navigationTree` files. This
approach was discussed and agreed with @tsullivan (Shared-UX team) and
introduced in [this PR](elastic#215969).

With these changes, the `navigationTree` becomes the SSoT (Single Source
of Truth) for the links hierarchy. This is done by registering the
Security Solution plugin `deepLinks` using the regular
`ApplicationLinks` information, but following the same hierarchy as the
`navigationTree`. This ensures consistency across the app and keeps the
code DRY.

>[!note]
These changes only affect the new _Solution navigation_. The _Classic
navigation_ remains unchanged and isolated, as it is expected to be
deprecated and removed in the near future.

### Architecture change

- The "links switchers", which were functions to programmatically change
the links hierarchy, have been removed.
- The `NavigationLinks` from which we were generating the
`navigationTree` programatically have also been dropped.
- The SecuritySolution plugin `deepLinks` are now generated using the
`ApplicationLinks` for the link configuration (title, path...) and the
current `navigationTree` for the hierarchy.

#### Previous architecture
![Old Security Serverless links
architecture](https://github.com/user-attachments/assets/0c9db269-bd67-4967-9ca1-bec5e874abff)

#### New architecture
![New Security Serverless links
architecture](https://github.com/user-attachments/assets/9ff24ff8-3ce9-455e-ad76-4baa6b11daa1)

>[!important]
The landing pages (Rules, Explore, Assets...) were made inaccessible
recently by the shared-ux team
([PR](elastic#210893)) in the new
Solution navigation as part of an effort to unify with the rest of
solutions. This fact also helped simplify the architecture.

>[!tip]
We have multiple static `navigationTree` definitions, which are used
depending on the serverless product tier. Right now, we have the
"default" `navigationTree` used in the _essentials_ and _complete_
tiers, and the "AI" `navigationTree` used in the new _searchAiLake_
tier.

This approach ensures consistency for the links' locations across
Kibana: the "left navigation", the "breadcrumbs", and the "global
search" will always be aligned.

### Screenshots

#### ECH navigations

| Classic nav | Solution nav |
|-|-|
|<img width="248" alt="classic"
src="https://github.com/user-attachments/assets/bb9e722e-316e-4c04-9978-068c35680382"
/>|<img width="248" alt="solution_nav"
src="https://github.com/user-attachments/assets/a993ce49-b780-4405-b829-4d36023ae627"
/>|

#### Serverless navigations

| Regular tiers | AI for SOC |
|-|-|
|<img width="248" alt="regular_serverless_nav"
src="https://github.com/user-attachments/assets/d782bf49-6c76-4414-a807-35245a5e9883"
/>|<img width="248" alt="ai_nav"
src="https://github.com/user-attachments/assets/25d9950d-77c8-4d44-ab53-4b07423713af"
/>|

#### Example of hierarchy for the `Endpoints` page:

##### Classic nav

![classic_nav_hierarchy](https://github.com/user-attachments/assets/d4c41c0a-f24f-469d-843c-10ff5b3c5174)

##### Solution nav

![solution_nav_hierarchy](https://github.com/user-attachments/assets/e7f753e2-a499-4130-9bd0-9d22788d612b)

### Other changes

- `NavLinks` are no longer used by the Solution navigation and have been
deprecated. They are only used in the Classic navigation now and will be
removed along with it.
- `ExternalPageNames` are no longer used and have been removed.
- `ApplicationLinks` observables moved to a singleton class.
- Link-related hooks have been moved to their own `links_hooks.ts` file.

### Next steps

When the Classic navigation is deprecated, we'll be able to:

- Define a flat structure of `ApplicationLinks` and remove the concept
of `category` in them.
- Remove Classic Security navigation components.
- Remove all the landing pages and their components in the navigation
package.

The
[docs](https://docs.elastic.dev/security-solution/dev-docs/app-links)
will be updated once this is merged.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
(cherry picked from commit c9f2f7c)

# Conflicts:
#	src/platform/packages/shared/deeplinks/security/deep_links.ts
#	x-pack/platform/plugins/private/translations/translations/fr-FR.json
#	x-pack/platform/plugins/private/translations/translations/ja-JP.json
#	x-pack/platform/plugins/private/translations/translations/zh-CN.json
#	x-pack/solutions/observability/plugins/logs_explorer/.storybook/__mocks__/package_icon.tsx
#	x-pack/solutions/security/packages/navigation/src/constants.ts
#	x-pack/solutions/security/packages/navigation/src/i18n_strings.ts
#	x-pack/solutions/security/packages/navigation/src/navigation_tree/ml_navigation_tree.ts
#	x-pack/solutions/security/plugins/security_solution/public/app/links/app_links.ts
#	x-pack/solutions/security/plugins/security_solution/public/app/solution_navigation/categories.ts
#	x-pack/solutions/security/plugins/security_solution/public/app/solution_navigation/links/sections/assets_links.ts
#	x-pack/solutions/security/plugins/security_solution/public/app/solution_navigation/links/sections/assets_translations.ts
#	x-pack/solutions/security/plugins/security_solution/public/app/solution_navigation/links/sections/lazy_icons.tsx
#	x-pack/solutions/security/plugins/security_solution/public/app/solution_navigation/links/sections/ml_links.ts
#	x-pack/solutions/security/plugins/security_solution/public/app/solution_navigation/links/sections/ml_translations.ts
#	x-pack/solutions/security/plugins/security_solution/public/common/components/security_route_page_wrapper/index.test.tsx
#	x-pack/solutions/security/plugins/security_solution/public/common/components/security_route_page_wrapper/index.tsx
#	x-pack/solutions/security/plugins/security_solution/public/common/utils/timeline/use_show_timeline.test.tsx
#	x-pack/solutions/security/plugins/security_solution/public/common/utils/timeline/use_show_timeline_for_path.ts
#	x-pack/solutions/security/plugins/security_solution/public/configurations/routes.tsx
#	x-pack/solutions/security/plugins/security_solution/public/detections/pages/alert_summary/index.tsx
#	x-pack/solutions/security/plugins/security_solution/public/lazy_sub_plugins.tsx
#	x-pack/solutions/security/plugins/security_solution/tsconfig.json
#	x-pack/solutions/security/plugins/security_solution_ess/public/navigation/__snapshots__/side_navigation.test.tsx.snap
#	x-pack/solutions/security/plugins/security_solution_ess/public/navigation/side_navigation.tsx
#	x-pack/solutions/security/plugins/security_solution_serverless/public/common/lazy_icons.tsx
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/__snapshots__/side_navigation.test.tsx.snap
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/ai_navigation/callout.test.tsx
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/ai_navigation/callout.tsx
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/ai_navigation/icon.tsx
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/ai_navigation/translations.ts
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/index.ts
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/navigation.test.ts
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/security_side_navigation.tsx
#	x-pack/solutions/security/plugins/security_solution_serverless/public/navigation/side_navigation.ts
#	x-pack/test/security_solution_cypress/cypress/screens/serverless_security_header.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport:version Backport to applied version labels release_note:skip Skip the PR/issue when compiling release notes Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:SharedUX Platform AppEx-SharedUX (formerly Global Experience) t// v8.19.0 v9.1.0

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants