[Security Assistant] Responsive design for welcome screen#226062
[Security Assistant] Responsive design for welcome screen#226062stephmilovic merged 5 commits intoelastic:mainfrom
Conversation
|
Pinging @elastic/security-solution (Team: SecuritySolution) |
e40pud
left a comment
There was a problem hiding this comment.
Thanks for the improvement! Tested locally and it works great 🚀
LGTM
|
|
||
| export type VerticalBreakpoint = 'short' | 'medium' | 'tall'; | ||
|
|
||
| export function useVerticalBreakpoint(): VerticalBreakpoint { |
There was a problem hiding this comment.
Not relevant to these changes, just a general question:
Do we have any guidelines on using classic function declaration vs arrow function? I see we mix both notations in kibana and assistant code base, but was wondering whether we have a preferred way.
There was a problem hiding this comment.
to quote ElasticGPT "The codebase and documentation show that both notations are used interchangeably, and there is no current enforcement of one style over the other."
| const handleResizeRef = useRef<((event: UIEvent) => void) & { cancel: () => void }>(); | ||
|
|
||
| useEffect(() => { | ||
| const handleResize = debounce(() => { |
There was a problem hiding this comment.
I wonder if using useRafState will be better here https://www.reactuse.com/state/userafstate? Looks like it could help to get rid of both debounce and handleResizeRef.
There was a problem hiding this comment.
Thanks, didn't know about that one
💚 Build Succeeded
Metrics [docs]Module Count
Async chunks
Page load bundle
|
|
Starting backport for target branches: 8.19, 9.1 https://github.com/elastic/kibana/actions/runs/16030488619 |
💔 Some backports could not be created
Note: Successful backport PRs will be merged automatically after passing CI. Manual backportTo create the backport manually run: Questions ?Please refer to the Backport tool documentation |
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation |
) (#226270) # Backport This will backport the following commits from `main` to `9.1`: - [[Security Assistant] Responsive design for welcome screen (#226062)](#226062) <!--- Backport version: 9.6.6 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Steph Milovic","email":"stephanie.milovic@elastic.co"},"sourceCommit":{"committedDate":"2025-07-02T16:21:59Z","message":"[Security Assistant] Responsive design for welcome screen (#226062)","sha":"128d6fc7735cca837e887a989a0a945cf5503396","branchLabelMapping":{"^v9.2.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team: SecuritySolution","Team:Security Generative AI","backport:version","v9.1.0","v8.19.0","v9.2.0"],"title":"[Security Assistant] Responsive design for welcome screen","number":226062,"url":"https://github.com/elastic/kibana/pull/226062","mergeCommit":{"message":"[Security Assistant] Responsive design for welcome screen (#226062)","sha":"128d6fc7735cca837e887a989a0a945cf5503396"}},"sourceBranch":"main","suggestedTargetBranches":["9.1","8.19"],"targetPullRequestStates":[{"branch":"9.1","label":"v9.1.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.19","label":"v8.19.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.2.0","branchLabelMappingKey":"^v9.2.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/226062","number":226062,"mergeCommit":{"message":"[Security Assistant] Responsive design for welcome screen (#226062)","sha":"128d6fc7735cca837e887a989a0a945cf5503396"}}]}] BACKPORT--> Co-authored-by: Steph Milovic <stephanie.milovic@elastic.co>
…6062) (#226273) # Backport This will backport the following commits from `main` to `8.19`: - [[Security Assistant] Responsive design for welcome screen (#226062)](#226062) <!--- Backport version: 10.0.1 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Steph Milovic","email":"stephanie.milovic@elastic.co"},"sourceCommit":{"committedDate":"2025-07-02T16:21:59Z","message":"[Security Assistant] Responsive design for welcome screen (#226062)","sha":"128d6fc7735cca837e887a989a0a945cf5503396","branchLabelMapping":{"^v9.2.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team: SecuritySolution","Team:Security Generative AI","backport:version","v9.1.0","v8.19.0","v9.2.0"],"title":"[Security Assistant] Responsive design for welcome screen","number":226062,"url":"https://github.com/elastic/kibana/pull/226062","mergeCommit":{"message":"[Security Assistant] Responsive design for welcome screen (#226062)","sha":"128d6fc7735cca837e887a989a0a945cf5503396"}},"sourceBranch":"main","suggestedTargetBranches":["8.19"],"targetPullRequestStates":[{"branch":"9.1","label":"v9.1.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"url":"https://github.com/elastic/kibana/pull/226270","number":226270,"state":"OPEN"},{"branch":"8.19","label":"v8.19.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.2.0","branchLabelMappingKey":"^v9.2.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/226062","number":226062,"mergeCommit":{"message":"[Security Assistant] Responsive design for welcome screen (#226062)","sha":"128d6fc7735cca837e887a989a0a945cf5503396"}}]}] BACKPORT-->
Summary
Implements a responsive design for the Security Assistant welcome screen based on the available vertical space.
Tall vertical space
Short vertical space
Transition
Screen.Recording.2025-07-01.at.3.36.45.PM.mov