This is an automated email from the ASF dual-hosted git repository. marat pushed a commit to branch main in repository https://gitbox.apache.org/repos/asf/camel-karavan.git
The following commit(s) were added to refs/heads/main by this push: new 75c46e4c FIx 75c46e4c is described below commit 75c46e4ce0167cc2eb7c56cac9b5de9a647da34a Author: Marat Gubaidullin <ma...@talismancloud.io> AuthorDate: Thu Oct 5 14:48:44 2023 -0400 FIx --- karavan-designer/src/designer/rest/rest.css | 5 +- karavan-web/docker/Dockerfile.devmode | 2 +- .../src/main/webui/src/designer/KaravanStore.ts | 252 --------------------- .../src/main/webui/src/designer/rest/rest.css | 5 +- .../webui/src/designer/route/DslProperties.tsx | 1 + .../webui/src/project/files/UploadFileModal.tsx | 1 - .../webui/src/project/topology/TopologyTab.tsx | 2 +- .../main/webui/src/project/topology/topology.css | 6 +- 8 files changed, 14 insertions(+), 260 deletions(-) diff --git a/karavan-designer/src/designer/rest/rest.css b/karavan-designer/src/designer/rest/rest.css index 25012e2d..3f1a53a5 100644 --- a/karavan-designer/src/designer/rest/rest.css +++ b/karavan-designer/src/designer/rest/rest.css @@ -185,6 +185,7 @@ margin-left: 6px; cursor: pointer; justify-content: space-between; + position: relative; } .karavan .rest-designer .rest-config-card, @@ -238,8 +239,8 @@ .karavan .rest-designer .rest-card .delete-button, .karavan .rest-designer .method-card .delete-button { position: absolute; - top: 3px; - right: 3px; + top: -7px; + right: -7px; line-height: 1; border: 0; padding: 0; diff --git a/karavan-web/docker/Dockerfile.devmode b/karavan-web/docker/Dockerfile.devmode index 00f743d1..0ae6bf69 100644 --- a/karavan-web/docker/Dockerfile.devmode +++ b/karavan-web/docker/Dockerfile.devmode @@ -24,7 +24,7 @@ LABEL "org.opencontainers.image.version"="4.0.1" RUN apt-get update && apt-get install git && apt-get clean ENV JBANG_VERSION=0.110.0 -ENV CAMEL_VERSION=4.0.1 +ENV CAMEL_VERSION=4.0.0 ENV KARAVAN="/karavan" ENV JBANG_DIR="$KARAVAN/.jbang" ENV MAVEN_CONFIG="$KARAVAN/.m2" diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/KaravanStore.ts b/karavan-web/karavan-app/src/main/webui/src/designer/KaravanStore.ts deleted file mode 100644 index 15a9b7be..00000000 --- a/karavan-web/karavan-app/src/main/webui/src/designer/KaravanStore.ts +++ /dev/null @@ -1,252 +0,0 @@ -/* - * 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 {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefinition"; -import {DslPosition, EventBus} from "./utils/EventBus"; -import {createWithEqualityFn} from "zustand/traditional"; -import {shallow} from "zustand/shallow"; - -interface IntegrationState { - integration: Integration; - json: string; - setIntegration: (integration: Integration, propertyOnly: boolean) => void; - propertyOnly: boolean; - reset: () => void; -} - -export const useIntegrationStore = createWithEqualityFn<IntegrationState>((set) => ({ - integration: Integration.createNew("demo", "plain"), - propertyOnly: false, - json: '{}', - setIntegration: (integration: Integration, propertyOnly: boolean) => { - set((state: IntegrationState) => { - const json = JSON.stringify(integration); - if (state.json === json) { - return {integration: state.integration, propertyOnly: state.propertyOnly, json: state.json}; - } else { - EventBus.sendIntegrationUpdate(integration, propertyOnly); - return {integration: integration, propertyOnly: propertyOnly, json: json}; - } - }) - }, - reset: () => { - set({integration: Integration.createNew("demo", "plain"), json: '{}', propertyOnly: false}); - } -}), shallow) - - -interface SelectorStateState { - showSelector: boolean; - setShowSelector: (showSelector: boolean) => void; - showSteps: boolean; - setShowSteps: (showSteps: boolean) => void; - parentDsl?: string; - setParentDsl: (parentDsl?: string) => void; - parentId: string; - setParentId: (parentId: string) => void; - selectorTabIndex?: string | number - setSelectorTabIndex: (selectorTabIndex?: string | number) => void; - selectedPosition?: number; - setSelectedPosition: (selectedPosition?: number) => void; - selectedLabels: string []; - addSelectedLabel: (label: string) => void; - deleteSelectedLabel: (label: string) => void; - clearSelectedLabels: () => void; -} - -export const useSelectorStore = createWithEqualityFn<SelectorStateState>((set) => ({ - showSelector: false, - deleteMessage: '', - parentId: '', - showSteps: true, - selectedLabels: [], - addSelectedLabel: (label: string) => { - set(state => ({ - selectedLabels: [...state.selectedLabels, label] - })) - }, - deleteSelectedLabel: (label: string) => { - set(state => ({ - selectedLabels: [...state.selectedLabels.filter(x => x !== label)] - })) - }, - clearSelectedLabels: () => { - set((state: SelectorStateState) => { - state.selectedLabels.length = 0; - return state; - }) - }, - setSelectedLabels: (selectedLabels: string []) => { - set({selectedLabels: selectedLabels}) - }, - setSelectorTabIndex: (selectorTabIndex?: string | number) => { - set({selectorTabIndex: selectorTabIndex}) - }, - setParentDsl: (parentDsl?: string) => { - set({parentDsl: parentDsl}) - }, - setShowSelector: (showSelector: boolean) => { - set({showSelector: showSelector}) - }, - setShowSteps: (showSteps: boolean) => { - set({showSteps: showSteps}) - }, - setParentId: (parentId: string) => { - set({parentId: parentId}) - }, - setSelectedPosition: (selectedPosition?: number) => { - set({selectedPosition: selectedPosition}) - }, -}), shallow) - - -interface ConnectionsState { - steps: Map<string, DslPosition>; - addStep: (uuid: string, position: DslPosition) => void; - deleteStep: (uuid: string) => void; - clearSteps: () => void; - setSteps: (steps: Map<string, DslPosition>) => void; -} - -export const useConnectionsStore = createWithEqualityFn<ConnectionsState>((set) => ({ - steps: new Map<string, DslPosition>(), - addStep: (uuid: string, position: DslPosition) => { - set(state => ({ - steps: new Map(state.steps).set(uuid, position), - })) - }, - deleteStep: (uuid: string) => { - set((state: ConnectionsState) => { - // state.steps.clear(); - Array.from(state.steps.entries()) - .filter(value => value[1]?.parent?.uuid !== uuid) - .forEach(value => state.steps.set(value[0], value[1])); - state.steps.delete(uuid) - return state; - }) - }, - clearSteps: () => { - set((state: ConnectionsState) => { - state.steps.clear(); - return state; - }) - }, - setSteps: (steps: Map<string, DslPosition>) => { - set({steps: steps}) - }, -}), shallow) - -type DesignerState = { - dark: boolean; - notificationBadge: boolean; - notificationMessage: [string, string]; - hideLogDSL: boolean; - shiftKeyPressed: boolean; - showDeleteConfirmation: boolean; - showMoveConfirmation: boolean; - deleteMessage: string; - selectedStep?: CamelElement; - selectedUuids: string[]; - clipboardSteps: CamelElement[]; - width: number, - height: number, - top: number, - left: number, -} -const designerState: DesignerState = { - notificationBadge: false, - notificationMessage: ['', ''], - dark: false, - hideLogDSL: false, - shiftKeyPressed: false, - showDeleteConfirmation: false, - showMoveConfirmation: false, - deleteMessage: '', - selectedUuids: [], - clipboardSteps: [], - width: 0, - height: 0, - top: 0, - left: 0, -}; - -type DesignerAction = { - setDark: (dark: boolean) => void; - setHideLogDSL: (hideLogDSL: boolean) => void; - setShiftKeyPressed: (shiftKeyPressed: boolean) => void; - setShowDeleteConfirmation: (showDeleteConfirmation: boolean) => void; - setShowMoveConfirmation: (showMoveConfirmation: boolean) => void; - setDeleteMessage: (deleteMessage: string) => void; - setSelectedStep: (selectedStep?: CamelElement) => void; - setSelectedUuids: (selectedUuids: string[]) => void; - setClipboardSteps: (clipboardSteps: CamelElement[]) => void; - setPosition: (width: number, height: number, top: number, left: number) => void; - reset: () => void; - setNotification: (notificationBadge: boolean, notificationMessage: [string, string]) => void; -} - -export const useDesignerStore = createWithEqualityFn<DesignerState & DesignerAction>((set) => ({ - ...designerState, - setDark: (dark: boolean) => { - set({dark: dark}) - }, - setHideLogDSL: (hideLogDSL: boolean) => { - set({hideLogDSL: hideLogDSL}) - }, - setShiftKeyPressed: (shiftKeyPressed: boolean) => { - set({shiftKeyPressed: shiftKeyPressed}) - }, - setSelectedStep: (selectedStep?: CamelElement) => { - set({selectedStep: selectedStep}) - }, - setShowDeleteConfirmation: (showDeleteConfirmation: boolean) => { - set({showDeleteConfirmation: showDeleteConfirmation}) - }, - setShowMoveConfirmation: (showMoveConfirmation: boolean) => { - set({showMoveConfirmation: showMoveConfirmation}) - }, - setDeleteMessage: (deleteMessage: string) => { - set({deleteMessage: deleteMessage}) - }, - setSelectedUuids: (selectedUuids: string[]) => { - set((state: DesignerState) => { - state.selectedUuids.length = 0; - state.selectedUuids.push(...selectedUuids); - return state; - }) - }, - setClipboardSteps: (clipboardSteps: CamelElement[]) => { - set((state: DesignerState) => { - state.clipboardSteps.length = 0; - state.clipboardSteps.push(...clipboardSteps); - return state; - }) - }, - width: 100, - height: 100, - top: 0, - left: 0, - setPosition: (width: number, height: number, top: number, left: number) => { - set({width: width, height: height, top: top, left: left}) - }, - reset: () => { - set(designerState); - }, - setNotification: (notificationBadge: boolean, notificationMessage: [string, string]) => { - set({notificationBadge: notificationBadge, notificationMessage: notificationMessage}) - } -}), shallow) \ No newline at end of file diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/rest/rest.css b/karavan-web/karavan-app/src/main/webui/src/designer/rest/rest.css index 25012e2d..3f1a53a5 100644 --- a/karavan-web/karavan-app/src/main/webui/src/designer/rest/rest.css +++ b/karavan-web/karavan-app/src/main/webui/src/designer/rest/rest.css @@ -185,6 +185,7 @@ margin-left: 6px; cursor: pointer; justify-content: space-between; + position: relative; } .karavan .rest-designer .rest-config-card, @@ -238,8 +239,8 @@ .karavan .rest-designer .rest-card .delete-button, .karavan .rest-designer .method-card .delete-button { position: absolute; - top: 3px; - right: 3px; + top: -7px; + right: -7px; line-height: 1; border: 0; padding: 0; diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/route/DslProperties.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/route/DslProperties.tsx index 82fd3dd9..d0635d26 100644 --- a/karavan-web/karavan-app/src/main/webui/src/designer/route/DslProperties.tsx +++ b/karavan-web/karavan-app/src/main/webui/src/designer/route/DslProperties.tsx @@ -127,6 +127,7 @@ export function DslProperties(props: Props) { : getProperties().filter(p => !dataFormats.includes(p.name)); const propertiesMain = properties.filter(p => !p.label.includes("advanced")); const propertiesAdvanced = properties.filter(p => p.label.includes("advanced")); + console.log(selectedStep) return ( <div key={selectedStep ? selectedStep.uuid : 'integration'} className='properties'> diff --git a/karavan-web/karavan-app/src/main/webui/src/project/files/UploadFileModal.tsx b/karavan-web/karavan-app/src/main/webui/src/project/files/UploadFileModal.tsx index 9c43b822..dfe1a198 100644 --- a/karavan-web/karavan-app/src/main/webui/src/project/files/UploadFileModal.tsx +++ b/karavan-web/karavan-app/src/main/webui/src/project/files/UploadFileModal.tsx @@ -56,7 +56,6 @@ export function UploadFileModal(props: Props) { function saveAndCloseModal () { const file = new ProjectFile(filename, props.projectId, data, Date.now()); - console.log(file); if (type === "openapi"){ KaravanApi.postOpenApi(file, generateRest, generateRoutes, integrationName, res => { if (res.status === 200) { diff --git a/karavan-web/karavan-app/src/main/webui/src/project/topology/TopologyTab.tsx b/karavan-web/karavan-app/src/main/webui/src/project/topology/TopologyTab.tsx index 4baa0117..22e9dbc4 100644 --- a/karavan-web/karavan-app/src/main/webui/src/project/topology/TopologyTab.tsx +++ b/karavan-web/karavan-app/src/main/webui/src/project/topology/TopologyTab.tsx @@ -34,8 +34,8 @@ import {useFilesStore} from "../../api/ProjectStore"; import {shallow} from "zustand/shallow"; import {useTopologyStore} from "./TopologyStore"; import {TopologyPropertiesPanel} from "./TopologyPropertiesPanel"; -import {useDesignerStore} from "../../designer/KaravanStore"; import {TopologyToolbar} from "./TopologyToolbar"; +import {useDesignerStore} from "../../designer/DesignerStore"; export const TopologyTab: React.FC = () => { diff --git a/karavan-web/karavan-app/src/main/webui/src/project/topology/topology.css b/karavan-web/karavan-app/src/main/webui/src/project/topology/topology.css index 98303ef9..bfd345b7 100644 --- a/karavan-web/karavan-app/src/main/webui/src/project/topology/topology.css +++ b/karavan-web/karavan-app/src/main/webui/src/project/topology/topology.css @@ -23,6 +23,11 @@ width: 100% } +.karavan .topology-panel .properties { + padding: 16px; + overflow: auto; +} + .karavan .topology-panel .properties-header { padding: 10px; } @@ -41,7 +46,6 @@ } .karavan .topology-sidebar { - overflow: hidden; } .karavan .topology-sidebar .pf-topology-side-bar__dismiss {