This is an automated email from the ASF dual-hosted git repository. marat pushed a commit to branch feature-836 in repository https://gitbox.apache.org/repos/asf/camel-karavan.git
commit 27ebf976cdcca4d5c4ae84ce79163787c6b87ecc Author: Marat Gubaidullin <marat@Marats-MacBook-Pro.local> AuthorDate: Tue Aug 22 19:50:20 2023 -0400 Delete element for #836 --- .../src/designer/route/DeleteConfirmation.tsx | 51 ++++++++++++++++++++++ karavan-designer/src/designer/route/DslElement.tsx | 1 + .../src/designer/route/DslSelector.tsx | 4 -- .../src/designer/route/RouteDesigner.tsx | 6 +-- .../src/designer/route/useRouteDesignerHook.tsx | 3 +- 5 files changed, 56 insertions(+), 9 deletions(-) diff --git a/karavan-designer/src/designer/route/DeleteConfirmation.tsx b/karavan-designer/src/designer/route/DeleteConfirmation.tsx new file mode 100644 index 00000000..1fcf6298 --- /dev/null +++ b/karavan-designer/src/designer/route/DeleteConfirmation.tsx @@ -0,0 +1,51 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react'; +import { + Button, Modal, +} from '@patternfly/react-core'; +import '../karavan.css'; +import {useRouteDesignerHook} from "./useRouteDesignerHook"; +import {useDesignerStore} from "../KaravanStore"; +import {shallow} from "zustand/shallow"; + +export const DeleteConfirmation = () => { + + + const {deleteElement} = useRouteDesignerHook(); + + const [showDeleteConfirmation, deleteMessage , setShowDeleteConfirmation] = + useDesignerStore((s) => [s.showDeleteConfirmation, s.deleteMessage, s.setShowDeleteConfirmation], shallow) + + return ( + <Modal + className="modal-delete" + title="Confirmation" + isOpen={showDeleteConfirmation} + onClose={() => setShowDeleteConfirmation(false)} + actions={[ + <Button key="confirm" variant="primary" onClick={e => deleteElement()}>Delete</Button>, + <Button key="cancel" variant="link" + onClick={e => setShowDeleteConfirmation(false)}>Cancel</Button> + ]} + onEscapePress={e => setShowDeleteConfirmation(false)}> + <div> + {deleteMessage} + </div> + </Modal> + ) +} \ No newline at end of file diff --git a/karavan-designer/src/designer/route/DslElement.tsx b/karavan-designer/src/designer/route/DslElement.tsx index 72380c03..bf246051 100644 --- a/karavan-designer/src/designer/route/DslElement.tsx +++ b/karavan-designer/src/designer/route/DslElement.tsx @@ -76,6 +76,7 @@ export const DslElement = (props: Props) => { function onDeleteElement (evt: React.MouseEvent) { evt.stopPropagation(); + console.log("!!!!!") onShowDeleteConfirmation(props.step.uuid); } diff --git a/karavan-designer/src/designer/route/DslSelector.tsx b/karavan-designer/src/designer/route/DslSelector.tsx index d18b9a87..798a6ed6 100644 --- a/karavan-designer/src/designer/route/DslSelector.tsx +++ b/karavan-designer/src/designer/route/DslSelector.tsx @@ -132,10 +132,6 @@ export const DslSelector = (props: Props) => { const navigation: string = selectorTabIndex ? selectorTabIndex.toString() : ''; const elements = CamelUi.getSelectorModelsForParentFiltered(parentDsl, navigation, showSteps); const eipLabels = [...new Set(elements.map(e => e.labels).join(",").split(",").filter(e => e !== 'eip'))]; - console.log("-----"); - console.log(selectedLabels); - console.log(eipLabels); - console.log("-----"); const filteredElement = elements .filter((dsl: DslMetaModel) => CamelUi.checkFilter(dsl, filter)) .filter((dsl: DslMetaModel) => { diff --git a/karavan-designer/src/designer/route/RouteDesigner.tsx b/karavan-designer/src/designer/route/RouteDesigner.tsx index f6bb737b..878d806c 100644 --- a/karavan-designer/src/designer/route/RouteDesigner.tsx +++ b/karavan-designer/src/designer/route/RouteDesigner.tsx @@ -41,6 +41,7 @@ import {CamelDefinitionApiExt} from "karavan-core/lib/api/CamelDefinitionApiExt" import useResizeObserver from "./useResizeObserver"; import {DslPosition} from "../utils/EventBus"; import useMutationsObserver from "./useDrawerMutationsObserver"; +import {DeleteConfirmation} from "./DeleteConfirmation"; interface Props { // onSave?: (integration: Integration, propertyOnly: boolean) => void @@ -83,7 +84,6 @@ export const RouteDesigner = (props: Props) => { const el = flowRef.current.getBoundingClientRect(); if (width !== el.width || height !== el.height || top !== el.top || left !== el.left) { setPosition(el.width, el.height, el.top, el.left) - console.log("elmRect", el) } } } @@ -212,8 +212,8 @@ export const RouteDesigner = (props: Props) => { </DrawerContent> </Drawer> </div> - <DslSelector dark={props.dark}/> - {getDeleteConfirmation()} + {showSelector && <DslSelector dark={props.dark}/>} + {showDeleteConfirmation && <DeleteConfirmation/>} </div> ) } \ No newline at end of file diff --git a/karavan-designer/src/designer/route/useRouteDesignerHook.tsx b/karavan-designer/src/designer/route/useRouteDesignerHook.tsx index 5d78199e..f2c995da 100644 --- a/karavan-designer/src/designer/route/useRouteDesignerHook.tsx +++ b/karavan-designer/src/designer/route/useRouteDesignerHook.tsx @@ -199,8 +199,7 @@ export const useRouteDesignerHook = () => { } else { message = 'Delete element from route?'; } - setShowSelector(false); - setShowDeleteConfirmation(false); + setShowDeleteConfirmation(true); setDeleteMessage(message); setSelectedUuids(uuidsToDelete); }