fix(1657): better name as subject when deleting a flow

KaotoIO · Nov 29, 2024 · 27a4e40 · 27a4e40
1 parent 4c19ab6
commit 27a4e40
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 2 deletions.
diff --git a/packages/ui/src/components/Visualization/ContextToolbar/Flows/FlowsList.tsx b/packages/ui/src/components/Visualization/ContextToolbar/Flows/FlowsList.tsx
@@ -109,7 +109,12 @@ export const FlowsList: FunctionComponent<IFlowsList> = (props) => {
                 variant="plain"
                 onClick={async (event) => {
                   const isDeleteConfirmed = await deleteModalContext?.actionConfirmation({
-                    title: 'Permanently delete flow?',
+                    title:
+                      "Do you want to delete the '" +
+                      flow.toVizNode().getId() +
+                      "' " +
+                      flow.toVizNode().getTitle() +
+                      '?',
                     text: 'All steps will be lost.',
                   });
 

diff --git a/packages/ui/src/components/Visualization/Custom/hooks/delete-group.hook.tsx b/packages/ui/src/components/Visualization/Custom/hooks/delete-group.hook.tsx
@@ -11,7 +11,7 @@ export const useDeleteGroup = (vizNode: IVisualizationNode) => {
   const onDeleteGroup = useCallback(async () => {
     /** Open delete confirm modal, get the confirmation  */
     const isDeleteConfirmed = await deleteModalContext?.actionConfirmation({
-      title: 'Permanently delete flow?',
+      title: "Do you want to delete the '" + vizNode.getId() + "' " + vizNode.getTitle() + '?',
       text: 'All steps will be lost.',
     });
 

diff --git a/packages/ui/src/providers/action-confirmation-modal.provider.scss b/packages/ui/src/providers/action-confirmation-modal.provider.scss
@@ -0,0 +1,5 @@
+.pf-v5-c-modal-box {
+  &__title-text {
+    white-space: normal;
+  }
+}
diff --git a/packages/ui/src/providers/action-confirmation-modal.provider.tsx b/packages/ui/src/providers/action-confirmation-modal.provider.tsx
@@ -1,5 +1,6 @@
 import { Button, ButtonVariant, Modal, ModalVariant, Split, SplitItem } from '@patternfly/react-core';
 import { FunctionComponent, PropsWithChildren, createContext, useCallback, useMemo, useRef, useState } from 'react';
+import './action-confirmation-modal.provider.scss';
 
 export const ACTION_ID_CANCEL = 'cancel';
 export const ACTION_ID_CONFIRM = 'confirm';