[8.16] [Synthetics] Fixes annotation update after event change !! (#199330) (#199444)

# Backport

This will backport the following commits from `main` to `8.16`:
- [[Synthetics] Fixes annotation update after event change !!
(#199330)](https://github.com/elastic/kibana/pull/199330)

<!--- Backport version: 9.4.3 -->

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

<!--BACKPORT
[{"author":{"name":"Shahzad","email":"shahzad31comp@gmail.com"},"sourceCommit":{"committedDate":"2024-11-08T10:37:39Z","message":"[Synthetics]
Fixes annotation update after event change !! (#199330)\n\n##
Summary\r\n\r\nFixes annotation update after event change
!!\r\n\r\nFixes
https://github.com/elastic/kibana/issues/199418\r\n\r\nIn SLO details
page, create an annotation by holding Command+Dragging on\r\nchart, save
and try to change the annotation type and it should be able\r\nto save
it/update it\r\n\r\n<img width=\"1728\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/a1ac92f6-1c0c-4544-b405-1c3c45c63739\">","sha":"3094dc45c6350f030dc1b5590b02d8d7979fdddc","branchLabelMapping":{"^v9.0.0$":"main","^v8.17.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","ci:project-deploy-observability","Team:obs-ux-management","v8.16.0","backport:version","v8.17.0"],"title":"[Synthetics]
Fixes annotation update after event change
!!","number":199330,"url":"https://github.com/elastic/kibana/pull/199330","mergeCommit":{"message":"[Synthetics]
Fixes annotation update after event change !! (#199330)\n\n##
Summary\r\n\r\nFixes annotation update after event change
!!\r\n\r\nFixes
https://github.com/elastic/kibana/issues/199418\r\n\r\nIn SLO details
page, create an annotation by holding Command+Dragging on\r\nchart, save
and try to change the annotation type and it should be able\r\nto save
it/update it\r\n\r\n<img width=\"1728\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/a1ac92f6-1c0c-4544-b405-1c3c45c63739\">","sha":"3094dc45c6350f030dc1b5590b02d8d7979fdddc"}},"sourceBranch":"main","suggestedTargetBranches":["8.16","8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/199330","number":199330,"mergeCommit":{"message":"[Synthetics]
Fixes annotation update after event change !! (#199330)\n\n##
Summary\r\n\r\nFixes annotation update after event change
!!\r\n\r\nFixes
https://github.com/elastic/kibana/issues/199418\r\n\r\nIn SLO details
page, create an annotation by holding Command+Dragging on\r\nchart, save
and try to change the annotation type and it should be able\r\nto save
it/update it\r\n\r\n<img width=\"1728\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/a1ac92f6-1c0c-4544-b405-1c3c45c63739\">","sha":"3094dc45c6350f030dc1b5590b02d8d7979fdddc"}},{"branch":"8.16","label":"v8.16.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.x","label":"v8.17.0","branchLabelMappingKey":"^v8.17.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Shahzad <shahzad31comp@gmail.com>
This commit is contained in:
Kibana Machine 2024-11-08 23:24:09 +11:00 committed by GitHub
parent 8ca694359e
commit 2e03cd1a97
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -9,6 +9,7 @@ import { EuiForm, EuiFormRow, EuiHorizontalRule, EuiSpacer } from '@elastic/eui'
import { i18n } from '@kbn/i18n';
import React from 'react';
import { useFormContext, Controller } from 'react-hook-form';
import { defaultAnnotationColor } from '@kbn/event-annotation-common';
import { CreateAnnotationForm } from './components/create_annotation';
import { AnnotationApplyTo } from './components/annotation_apply_to';
import { Annotation } from '../../../common/annotations';
@ -17,7 +18,8 @@ import { AnnotationRange } from './components/annotation_range';
import { AnnotationAppearance } from './annotation_apearance';
export function AnnotationForm({ editAnnotation }: { editAnnotation?: Annotation | null }) {
const { control, formState, watch, trigger } = useFormContext<CreateAnnotationForm>();
const { control, formState, watch, trigger, unregister, setValue } =
useFormContext<CreateAnnotationForm>();
const timestampStart = watch('@timestamp');
@ -39,7 +41,14 @@ export function AnnotationForm({ editAnnotation }: { editAnnotation?: Annotation
)}
checked={Boolean(value)}
onChange={(evt) => {
field.onChange(evt.target.checked ? timestampStart : null);
if (evt.target.checked) {
field.onChange(timestampStart);
} else {
// we need to do this to avoid validation errors
unregister('event.end');
field.onChange(null);
setValue('annotation.style.color', defaultAnnotationColor);
}
}}
compressed
/>