github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

[8.11] [RAM] Reset scroll in rule form when selecting rule type (#167219) (#168515)

Browse source 
# Backport

This will backport the following commits from `main` to `8.11`:
- [[RAM] Reset scroll in rule form when selecting rule type
(#167219)](https://github.com/elastic/kibana/pull/167219)

<!--- Backport version: 8.9.7 -->

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

<!--BACKPORT [{"author":{"name":"Umberto
Pepato","email":"umbopepato@users.noreply.github.com"},"sourceCommit":{"committedDate":"2023-10-10T17:04:46Z","message":"[RAM]
Reset scroll in rule form when selecting rule type (#167219)\n\nCloses
#158675\r\n\r\n## Summary\r\n\r\nResets the scroll position of the rule
add/edit flyout when changing the\r\nrule
type.\r\n\r\nBefore:\r\n\r\n![before](5dc35fef-e5e3-48f9-9a17-60a821f219f3)","sha":"cb22b6ce25ef4ae97606431cd9bae172b385be61","branchLabelMapping":{"^v8.12.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","v8.11.0","v8.12.0"],"number":167219,"url":"https://github.com/elastic/kibana/pull/167219","mergeCommit":{"message":"[RAM]
Reset scroll in rule form when selecting rule type (#167219)\n\nCloses
#158675\r\n\r\n## Summary\r\n\r\nResets the scroll position of the rule
add/edit flyout when changing the\r\nrule
type.\r\n\r\nBefore:\r\n\r\n![before](5dc35fef-e5e3-48f9-9a17-60a821f219f3)","sha":"cb22b6ce25ef4ae97606431cd9bae172b385be61"}},"sourceBranch":"main","suggestedTargetBranches":["8.11"],"targetPullRequestStates":[{"branch":"8.11","label":"v8.11.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.12.0","labelRegex":"^v8.12.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/167219","number":167219,"mergeCommit":{"message":"[RAM]
Reset scroll in rule form when selecting rule type (#167219)\n\nCloses
#158675\r\n\r\n## Summary\r\n\r\nResets the scroll position of the rule
add/edit flyout when changing the\r\nrule
type.\r\n\r\nBefore:\r\n\r\n![before](5dc35fef-e5e3-48f9-9a17-60a821f219f3)","sha":"cb22b6ce25ef4ae97606431cd9bae172b385be61"}}]}]
BACKPORT-->

Co-authored-by: Umberto Pepato <umbopepato@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2023-10-10 14:19:46 -04:00 • committed by GitHub
parent 28044e6d8f
commit 4e747c1963
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 26 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

27
x-pack/plugins/triggers_actions_ui/public/application/sections/rule_form/rule_form.tsx
View file

@ -5,7 +5,15 @@
* 2.0.
*/
import React, { Fragment, useState, useEffect, useCallback, Suspense, useMemo } from 'react';
import React, {
Fragment,
useState,
useEffect,
useCallback,
Suspense,
useMemo,
useRef,
} from 'react';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import {
@ -184,6 +192,7 @@ export const RuleForm = ({
const canShowActions = hasShowActionsCapability(capabilities);
const [ruleTypeModel, setRuleTypeModel] = useState<RuleTypeModel | null>(null);
const flyoutBodyOverflowRef = useRef<HTMLDivElement | HTMLSpanElement | null>(null);
const defaultRuleInterval = getInitialInterval(config.minimumScheduleInterval?.value);
const defaultScheduleInterval = getDurationNumberInItsUnit(defaultRuleInterval);
@ -306,6 +315,22 @@ export const RuleForm = ({
}
}, [rule.schedule.interval, defaultScheduleInterval, defaultScheduleIntervalUnit]);
useEffect(() => {
if (!flyoutBodyOverflowRef.current) {
// We're using this as a reliable way to reset the scroll position
// of the flyout independently of the selected rule type
flyoutBodyOverflowRef.current = document.querySelector('.euiFlyoutBody__overflow');
}
}, []);
const resetContentScroll = useCallback(() => flyoutBodyOverflowRef?.current?.scroll?.(0, 0), []);
useEffect(() => {
if (rule.ruleTypeId) {
resetContentScroll();
}
}, [rule.ruleTypeId, resetContentScroll]);
const setRuleProperty = useCallback(
<Key extends keyof Rule>(key: Key, value: Rule[Key] | null) => {
dispatch({ command: { type: 'setProperty' }, payload: { key, value } });