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 0a215807 Custom Kamelet
0a215807 is described below
commit 0a2158070d309a2c6762d12ecd8e53cd7ae79ae9
Author: Marat Gubaidullin <[email protected]>
AuthorDate: Wed Jun 19 15:42:34 2024 -0400
Custom Kamelet
---
karavan-app/src/main/webui/src/designer/karavan.css | 7 +++++++
.../main/webui/src/designer/selector/DslCard.tsx | 3 +--
.../webui/src/knowledgebase/KnowledgebasePage.tsx | 2 +-
.../src/knowledgebase/kamelets/KameletCard.tsx | 8 ++++----
.../main/webui/src/knowledgebase/knowledgebase.css | 21 +++++++++++++++++++++
karavan-designer/src/designer/selector/DslCard.tsx | 3 +--
.../src/knowledgebase/KnowledgebasePage.tsx | 2 +-
.../src/knowledgebase/kamelets/KameletCard.tsx | 8 ++++----
.../src/knowledgebase/knowledgebase.css | 21 +++++++++++++++++++++
karavan-space/src/designer/karavan.css | 7 +++++++
karavan-space/src/designer/selector/DslCard.tsx | 3 +--
.../src/knowledgebase/KnowledgebasePage.tsx | 2 +-
.../src/knowledgebase/kamelets/KameletCard.tsx | 8 ++++----
karavan-space/src/knowledgebase/knowledgebase.css | 21 +++++++++++++++++++++
14 files changed, 95 insertions(+), 21 deletions(-)
diff --git a/karavan-app/src/main/webui/src/designer/karavan.css
b/karavan-app/src/main/webui/src/designer/karavan.css
index 99a0392d..d3e96c87 100644
--- a/karavan-app/src/main/webui/src/designer/karavan.css
+++ b/karavan-app/src/main/webui/src/designer/karavan.css
@@ -713,6 +713,13 @@
margin-bottom: 100px;
}
+.karavan .scrolled-page {
+ overflow: auto;
+ flex-shrink: unset;
+ flex-grow: 1;
+ background-color: var(--pf-v5-global--BackgroundColor--light-300);
+}
+
.karavan .knowledbase-eip-section .pf-v5-c-toggle-group {
margin: 16px;
}
diff --git a/karavan-app/src/main/webui/src/designer/selector/DslCard.tsx
b/karavan-app/src/main/webui/src/designer/selector/DslCard.tsx
index 78d121d5..510bce5c 100644
--- a/karavan-app/src/main/webui/src/designer/selector/DslCard.tsx
+++ b/karavan-app/src/main/webui/src/designer/selector/DslCard.tsx
@@ -51,7 +51,6 @@ export function DslCard (props: Props) {
{['kamelet',
'component'].includes(dsl.navigation.toLowerCase()) &&
<Badge isRead className="version
labels">{dsl.version}</Badge>
}
- {isCustom && <Badge className="custom">custom</Badge>}
</CardHeader>
<CardHeader>
{CamelUi.getIconForDsl(dsl)}
@@ -68,7 +67,7 @@ export function DslCard (props: Props) {
{labels.map((label, index) => <Badge key={label + "-" +
index} isRead
className="labels">{label}</Badge>)}
</div>
-
+ {isCustom && <Badge className="custom">custom</Badge>}
</CardFooter>
</Card>
)
diff --git a/karavan-app/src/main/webui/src/knowledgebase/KnowledgebasePage.tsx
b/karavan-app/src/main/webui/src/knowledgebase/KnowledgebasePage.tsx
index ef4a0fc1..a7c1d514 100644
--- a/karavan-app/src/main/webui/src/knowledgebase/KnowledgebasePage.tsx
+++ b/karavan-app/src/main/webui/src/knowledgebase/KnowledgebasePage.tsx
@@ -78,7 +78,7 @@ export const KnowledgebasePage = (props: Props) => {
</PageSection>
<PageSection className="tools-section" padding={{default:
'noPadding'}}>
<Flex direction={{default: "column"}} spaceItems={{default:
"spaceItemsNone"}}>
- <FlexItem className="knowledge-tabs">
+ <FlexItem>
<Tabs activeKey={tab} onSelect={(event, tabIndex) =>
setTab(tabIndex)}>
<Tab eventKey="eip" title="Integration Patterns"/>
<Tab eventKey="kamelets" title="Kamelets"/>
diff --git
a/karavan-app/src/main/webui/src/knowledgebase/kamelets/KameletCard.tsx
b/karavan-app/src/main/webui/src/knowledgebase/kamelets/KameletCard.tsx
index 64163e3c..a1a0f903 100644
--- a/karavan-app/src/main/webui/src/knowledgebase/kamelets/KameletCard.tsx
+++ b/karavan-app/src/main/webui/src/knowledgebase/kamelets/KameletCard.tsx
@@ -19,6 +19,7 @@ import {
CardHeader, Card, CardTitle, CardBody, CardFooter, Badge, Checkbox, Flex
} from '@patternfly/react-core';
import '../../designer/karavan.css';
+import '../knowledgebase.css';
import {KameletModel} from "karavan-core/lib/model/KameletModels";
import {CamelUi} from "../../designer/utils/CamelUi";
import {KameletApi} from "karavan-core/lib/api/KameletApi";
@@ -60,9 +61,9 @@ export function KameletCard(props: Props) {
onClick={event => click(event)}
>
<CardHeader className="header-labels">
- <Flex gap={{default:'gapNone'}}>
+ <Flex style={{width:'100%'}} gap={{default:'gapSm'}}
justifyContent={{default: 'justifyContentSpaceBetween'}}>
<Badge isRead className="support-level
labels">{kamelet.metadata.annotations["camel.apache.org/kamelet.support.level"]}</Badge>
- {isCustom && <Badge className="custom
labels">custom</Badge>}
+ <Badge isRead className="version
labels">{kamelet.metadata.annotations["camel.apache.org/catalog.version"].toLowerCase()}</Badge>
</Flex>
{showBlockCheckbox && <Checkbox id={kamelet.metadata.name}
className="block-checkbox labels" isChecked={!isblockedKamelet}
onChange={(_, checked) =>
selectKamelet(_, checked)}/>}
@@ -74,8 +75,7 @@ export function KameletCard(props: Props) {
<CardBody>{kamelet.spec.definition.description}</CardBody>
<CardFooter className="footer-labels">
<Badge isRead
className="labels">{kamelet.metadata.labels["camel.apache.org/kamelet.type"].toLowerCase()}</Badge>
- <Badge isRead className="version
labels">{kamelet.metadata.annotations["camel.apache.org/catalog.version"].toLowerCase()}</Badge>
- {/*</div>*/}
+ {isCustom && <Badge className="custom labels">custom</Badge>}
</CardFooter>
</Card>
)
diff --git a/karavan-app/src/main/webui/src/knowledgebase/knowledgebase.css
b/karavan-app/src/main/webui/src/knowledgebase/knowledgebase.css
new file mode 100644
index 00000000..6fb889de
--- /dev/null
+++ b/karavan-app/src/main/webui/src/knowledgebase/knowledgebase.css
@@ -0,0 +1,21 @@
+/*
+ * 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.
+ */
+
+.kamelets-page .kamelet-card .block-checkbox {
+ align-self: center;
+ margin-left: 6px;
+}
\ No newline at end of file
diff --git a/karavan-designer/src/designer/selector/DslCard.tsx
b/karavan-designer/src/designer/selector/DslCard.tsx
index 78d121d5..510bce5c 100644
--- a/karavan-designer/src/designer/selector/DslCard.tsx
+++ b/karavan-designer/src/designer/selector/DslCard.tsx
@@ -51,7 +51,6 @@ export function DslCard (props: Props) {
{['kamelet',
'component'].includes(dsl.navigation.toLowerCase()) &&
<Badge isRead className="version
labels">{dsl.version}</Badge>
}
- {isCustom && <Badge className="custom">custom</Badge>}
</CardHeader>
<CardHeader>
{CamelUi.getIconForDsl(dsl)}
@@ -68,7 +67,7 @@ export function DslCard (props: Props) {
{labels.map((label, index) => <Badge key={label + "-" +
index} isRead
className="labels">{label}</Badge>)}
</div>
-
+ {isCustom && <Badge className="custom">custom</Badge>}
</CardFooter>
</Card>
)
diff --git a/karavan-designer/src/knowledgebase/KnowledgebasePage.tsx
b/karavan-designer/src/knowledgebase/KnowledgebasePage.tsx
index ef4a0fc1..a7c1d514 100644
--- a/karavan-designer/src/knowledgebase/KnowledgebasePage.tsx
+++ b/karavan-designer/src/knowledgebase/KnowledgebasePage.tsx
@@ -78,7 +78,7 @@ export const KnowledgebasePage = (props: Props) => {
</PageSection>
<PageSection className="tools-section" padding={{default:
'noPadding'}}>
<Flex direction={{default: "column"}} spaceItems={{default:
"spaceItemsNone"}}>
- <FlexItem className="knowledge-tabs">
+ <FlexItem>
<Tabs activeKey={tab} onSelect={(event, tabIndex) =>
setTab(tabIndex)}>
<Tab eventKey="eip" title="Integration Patterns"/>
<Tab eventKey="kamelets" title="Kamelets"/>
diff --git a/karavan-designer/src/knowledgebase/kamelets/KameletCard.tsx
b/karavan-designer/src/knowledgebase/kamelets/KameletCard.tsx
index 64163e3c..a1a0f903 100644
--- a/karavan-designer/src/knowledgebase/kamelets/KameletCard.tsx
+++ b/karavan-designer/src/knowledgebase/kamelets/KameletCard.tsx
@@ -19,6 +19,7 @@ import {
CardHeader, Card, CardTitle, CardBody, CardFooter, Badge, Checkbox, Flex
} from '@patternfly/react-core';
import '../../designer/karavan.css';
+import '../knowledgebase.css';
import {KameletModel} from "karavan-core/lib/model/KameletModels";
import {CamelUi} from "../../designer/utils/CamelUi";
import {KameletApi} from "karavan-core/lib/api/KameletApi";
@@ -60,9 +61,9 @@ export function KameletCard(props: Props) {
onClick={event => click(event)}
>
<CardHeader className="header-labels">
- <Flex gap={{default:'gapNone'}}>
+ <Flex style={{width:'100%'}} gap={{default:'gapSm'}}
justifyContent={{default: 'justifyContentSpaceBetween'}}>
<Badge isRead className="support-level
labels">{kamelet.metadata.annotations["camel.apache.org/kamelet.support.level"]}</Badge>
- {isCustom && <Badge className="custom
labels">custom</Badge>}
+ <Badge isRead className="version
labels">{kamelet.metadata.annotations["camel.apache.org/catalog.version"].toLowerCase()}</Badge>
</Flex>
{showBlockCheckbox && <Checkbox id={kamelet.metadata.name}
className="block-checkbox labels" isChecked={!isblockedKamelet}
onChange={(_, checked) =>
selectKamelet(_, checked)}/>}
@@ -74,8 +75,7 @@ export function KameletCard(props: Props) {
<CardBody>{kamelet.spec.definition.description}</CardBody>
<CardFooter className="footer-labels">
<Badge isRead
className="labels">{kamelet.metadata.labels["camel.apache.org/kamelet.type"].toLowerCase()}</Badge>
- <Badge isRead className="version
labels">{kamelet.metadata.annotations["camel.apache.org/catalog.version"].toLowerCase()}</Badge>
- {/*</div>*/}
+ {isCustom && <Badge className="custom labels">custom</Badge>}
</CardFooter>
</Card>
)
diff --git a/karavan-designer/src/knowledgebase/knowledgebase.css
b/karavan-designer/src/knowledgebase/knowledgebase.css
new file mode 100644
index 00000000..6fb889de
--- /dev/null
+++ b/karavan-designer/src/knowledgebase/knowledgebase.css
@@ -0,0 +1,21 @@
+/*
+ * 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.
+ */
+
+.kamelets-page .kamelet-card .block-checkbox {
+ align-self: center;
+ margin-left: 6px;
+}
\ No newline at end of file
diff --git a/karavan-space/src/designer/karavan.css
b/karavan-space/src/designer/karavan.css
index 99a0392d..d3e96c87 100644
--- a/karavan-space/src/designer/karavan.css
+++ b/karavan-space/src/designer/karavan.css
@@ -713,6 +713,13 @@
margin-bottom: 100px;
}
+.karavan .scrolled-page {
+ overflow: auto;
+ flex-shrink: unset;
+ flex-grow: 1;
+ background-color: var(--pf-v5-global--BackgroundColor--light-300);
+}
+
.karavan .knowledbase-eip-section .pf-v5-c-toggle-group {
margin: 16px;
}
diff --git a/karavan-space/src/designer/selector/DslCard.tsx
b/karavan-space/src/designer/selector/DslCard.tsx
index 78d121d5..510bce5c 100644
--- a/karavan-space/src/designer/selector/DslCard.tsx
+++ b/karavan-space/src/designer/selector/DslCard.tsx
@@ -51,7 +51,6 @@ export function DslCard (props: Props) {
{['kamelet',
'component'].includes(dsl.navigation.toLowerCase()) &&
<Badge isRead className="version
labels">{dsl.version}</Badge>
}
- {isCustom && <Badge className="custom">custom</Badge>}
</CardHeader>
<CardHeader>
{CamelUi.getIconForDsl(dsl)}
@@ -68,7 +67,7 @@ export function DslCard (props: Props) {
{labels.map((label, index) => <Badge key={label + "-" +
index} isRead
className="labels">{label}</Badge>)}
</div>
-
+ {isCustom && <Badge className="custom">custom</Badge>}
</CardFooter>
</Card>
)
diff --git a/karavan-space/src/knowledgebase/KnowledgebasePage.tsx
b/karavan-space/src/knowledgebase/KnowledgebasePage.tsx
index ef4a0fc1..a7c1d514 100644
--- a/karavan-space/src/knowledgebase/KnowledgebasePage.tsx
+++ b/karavan-space/src/knowledgebase/KnowledgebasePage.tsx
@@ -78,7 +78,7 @@ export const KnowledgebasePage = (props: Props) => {
</PageSection>
<PageSection className="tools-section" padding={{default:
'noPadding'}}>
<Flex direction={{default: "column"}} spaceItems={{default:
"spaceItemsNone"}}>
- <FlexItem className="knowledge-tabs">
+ <FlexItem>
<Tabs activeKey={tab} onSelect={(event, tabIndex) =>
setTab(tabIndex)}>
<Tab eventKey="eip" title="Integration Patterns"/>
<Tab eventKey="kamelets" title="Kamelets"/>
diff --git a/karavan-space/src/knowledgebase/kamelets/KameletCard.tsx
b/karavan-space/src/knowledgebase/kamelets/KameletCard.tsx
index 64163e3c..a1a0f903 100644
--- a/karavan-space/src/knowledgebase/kamelets/KameletCard.tsx
+++ b/karavan-space/src/knowledgebase/kamelets/KameletCard.tsx
@@ -19,6 +19,7 @@ import {
CardHeader, Card, CardTitle, CardBody, CardFooter, Badge, Checkbox, Flex
} from '@patternfly/react-core';
import '../../designer/karavan.css';
+import '../knowledgebase.css';
import {KameletModel} from "karavan-core/lib/model/KameletModels";
import {CamelUi} from "../../designer/utils/CamelUi";
import {KameletApi} from "karavan-core/lib/api/KameletApi";
@@ -60,9 +61,9 @@ export function KameletCard(props: Props) {
onClick={event => click(event)}
>
<CardHeader className="header-labels">
- <Flex gap={{default:'gapNone'}}>
+ <Flex style={{width:'100%'}} gap={{default:'gapSm'}}
justifyContent={{default: 'justifyContentSpaceBetween'}}>
<Badge isRead className="support-level
labels">{kamelet.metadata.annotations["camel.apache.org/kamelet.support.level"]}</Badge>
- {isCustom && <Badge className="custom
labels">custom</Badge>}
+ <Badge isRead className="version
labels">{kamelet.metadata.annotations["camel.apache.org/catalog.version"].toLowerCase()}</Badge>
</Flex>
{showBlockCheckbox && <Checkbox id={kamelet.metadata.name}
className="block-checkbox labels" isChecked={!isblockedKamelet}
onChange={(_, checked) =>
selectKamelet(_, checked)}/>}
@@ -74,8 +75,7 @@ export function KameletCard(props: Props) {
<CardBody>{kamelet.spec.definition.description}</CardBody>
<CardFooter className="footer-labels">
<Badge isRead
className="labels">{kamelet.metadata.labels["camel.apache.org/kamelet.type"].toLowerCase()}</Badge>
- <Badge isRead className="version
labels">{kamelet.metadata.annotations["camel.apache.org/catalog.version"].toLowerCase()}</Badge>
- {/*</div>*/}
+ {isCustom && <Badge className="custom labels">custom</Badge>}
</CardFooter>
</Card>
)
diff --git a/karavan-space/src/knowledgebase/knowledgebase.css
b/karavan-space/src/knowledgebase/knowledgebase.css
new file mode 100644
index 00000000..6fb889de
--- /dev/null
+++ b/karavan-space/src/knowledgebase/knowledgebase.css
@@ -0,0 +1,21 @@
+/*
+ * 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.
+ */
+
+.kamelets-page .kamelet-card .block-checkbox {
+ align-self: center;
+ margin-left: 6px;
+}
\ No newline at end of file
