mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 01:38:56 -04:00
[Obs AI Assistant] Remove double confirmation when deleting conversation (#217991)
Closes https://github.com/elastic/kibana/issues/213987 ## Summary Remove the checkbox from the confirm modal to avoid double confirmation. ### Before <img width="475" alt="Screenshot 2025-04-11 at 11 56 54" src="https://github.com/user-attachments/assets/6b24aa8a-06b8-4f97-b43d-a82e91ce8328" /> ### After <img width="580" alt="Screenshot 2025-04-11 at 11 07 19" src="https://github.com/user-attachments/assets/91965922-8b66-473a-903c-c6d14e2ee49e" /> ### Checklist - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
parent
9f5425f061
commit
b8e78bcd55
3 changed files with 5 additions and 31 deletions
|
@ -129,12 +129,7 @@ export function ChatContextMenu({
|
|||
`}
|
||||
icon={<EuiIcon type="trash" size="m" color="danger" />}
|
||||
onClick={() => {
|
||||
confirmDeleteCallback(
|
||||
i18n.translate('xpack.aiAssistant.flyout.confirmDeleteCheckboxLabel', {
|
||||
defaultMessage: 'Delete "{title}"',
|
||||
values: { title: conversationTitle },
|
||||
})
|
||||
).then((confirmed) => {
|
||||
confirmDeleteCallback().then((confirmed) => {
|
||||
if (!confirmed) {
|
||||
return;
|
||||
}
|
||||
|
|
|
@ -185,12 +185,7 @@ export function ConversationList({
|
|||
currentUser,
|
||||
}),
|
||||
onClick: () => {
|
||||
confirmDeleteCallback(
|
||||
i18n.translate('xpack.aiAssistant.flyout.confirmDeleteCheckboxLabel', {
|
||||
defaultMessage: 'Delete "{title}"',
|
||||
values: { title: conversation.label },
|
||||
})
|
||||
).then((confirmed) => {
|
||||
confirmDeleteCallback().then((confirmed) => {
|
||||
if (!confirmed) return;
|
||||
deleteConversation(conversation.id).then(() => {
|
||||
if (conversation.id === selectedConversationId) {
|
||||
|
|
|
@ -6,27 +6,22 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { EuiCheckbox, EuiConfirmModal, EuiText } from '@elastic/eui';
|
||||
import { EuiConfirmModal, EuiText } from '@elastic/eui';
|
||||
import { useState } from 'react';
|
||||
import { css } from '@emotion/css';
|
||||
|
||||
const ConfirmModal = ({
|
||||
checkboxLabel,
|
||||
onClose,
|
||||
title,
|
||||
children,
|
||||
confirmButtonText,
|
||||
setElement,
|
||||
}: {
|
||||
checkboxLabel: string;
|
||||
onClose: (confirmed: boolean) => void;
|
||||
title: React.ReactNode;
|
||||
children: React.ReactNode;
|
||||
confirmButtonText: React.ReactNode;
|
||||
setElement: (element: React.ReactNode | undefined) => void;
|
||||
}) => {
|
||||
const [isChecked, setIsChecked] = useState(false);
|
||||
|
||||
return (
|
||||
<EuiConfirmModal
|
||||
title={title}
|
||||
|
@ -41,19 +36,9 @@ const ConfirmModal = ({
|
|||
confirmButtonText={confirmButtonText}
|
||||
cancelButtonText="Cancel"
|
||||
buttonColor="danger"
|
||||
confirmButtonDisabled={!isChecked}
|
||||
maxWidth
|
||||
>
|
||||
<EuiText>{children}</EuiText>
|
||||
<EuiCheckbox
|
||||
id="deleteConfirmationCheckbox"
|
||||
label={checkboxLabel}
|
||||
checked={isChecked}
|
||||
onChange={(e) => setIsChecked(e.target.checked)}
|
||||
className={css`
|
||||
margin-top: 15px;
|
||||
`}
|
||||
/>
|
||||
</EuiConfirmModal>
|
||||
);
|
||||
};
|
||||
|
@ -68,16 +53,15 @@ export function useConfirmModal({
|
|||
confirmButtonText: React.ReactNode;
|
||||
}): {
|
||||
element: React.ReactNode | undefined;
|
||||
confirm: (checkBoxLabel: string) => Promise<boolean>;
|
||||
confirm: () => Promise<boolean>;
|
||||
} {
|
||||
const [element, setElement] = useState<React.ReactNode | undefined>(undefined);
|
||||
|
||||
const confirm = (checkboxLabel: string) => {
|
||||
const confirm = () => {
|
||||
return new Promise<boolean>((resolve) => {
|
||||
setElement(() => {
|
||||
return (
|
||||
<ConfirmModal
|
||||
checkboxLabel={checkboxLabel}
|
||||
onClose={resolve}
|
||||
title={title}
|
||||
children={children}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue