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 f828c37 Prepare for preview 0.0.10 (#169) f828c37 is described below commit f828c3722a51adca9461c17bd728bd409d6d1208 Author: Marat Gubaidullin <marat.gubaidul...@gmail.com> AuthorDate: Wed Feb 2 14:50:44 2022 -0500 Prepare for preview 0.0.10 (#169) --- README.md | 14 +++++-- karavan-designer/src/App.tsx | 2 +- karavan-designer/src/designer/DslProperties.tsx | 2 +- .../src/designer/field/DataFormatField.tsx | 3 +- karavan-designer/src/designer/karavan.css | 19 +++++---- karavan-vscode/CHANGELOG.md | 6 +++ karavan-vscode/README.md | 44 ++++++++++++++------- karavan-vscode/screenshots/karavan-vscode.png | Bin 471981 -> 319708 bytes karavan-vscode/screenshots/run.png | Bin 0 -> 5893 bytes karavan-vscode/webview/index.css | 9 ++--- screenshots/karavan-vscode.png | Bin 234850 -> 319708 bytes screenshots/karavan.png | Bin 464789 -> 401512 bytes 12 files changed, 63 insertions(+), 36 deletions(-) diff --git a/README.md b/README.md index 615d4cd..49e9186 100644 --- a/README.md +++ b/README.md @@ -9,13 +9,21 @@ # Apache Camel Karavan Karavan, an Integration Designer for Apache Camel makes integration easy and fun through visualization of integration pipeline. -### VS Code extension +## Features + +* Read/Write Integration CRD (*.yaml with kind:Integration) and plain yaml routes +* Kamelets source/sink/action +* Enterprise Integration Patterns DSL +* Components consumer/producer +* Integration with [JBang](https://www.jbang.dev) + +## VS Code extension Install Karavan VS Code extension from the [Marketplace](https://marketplace.visualstudio.com/items?itemName=camel-karavan.karavan) ![karavan-vscode](screenshots/karavan-vscode.png) -### Standalone application +## Standalone application Install Karavan Standalone command line: `docker pull ghcr.io/apache/camel-karavan:latest` @@ -64,7 +72,7 @@ You can run your application in dev mode that enables live coding using: - Backend ```shell script cd karavan-app -mvn compile quarkus:dev +mvn quarkus:dev ``` - Frontend ```shell script diff --git a/karavan-designer/src/App.tsx b/karavan-designer/src/App.tsx index bd74361..a659d91 100644 --- a/karavan-designer/src/App.tsx +++ b/karavan-designer/src/App.tsx @@ -139,7 +139,7 @@ class App extends React.Component<Props, State> { <KaravanDesigner key={this.state.key} filename={this.state.name} yaml={this.state.yaml} onSave={(filename, yaml) => this.save(filename, yaml)} borderColor="#fb8824" - borderColorSelected="black" + borderColorSelected="#303284" dark={document.body.className.includes('vscode-dark')} /> </Page> diff --git a/karavan-designer/src/designer/DslProperties.tsx b/karavan-designer/src/designer/DslProperties.tsx index 53a65b5..e67305a 100644 --- a/karavan-designer/src/designer/DslProperties.tsx +++ b/karavan-designer/src/designer/DslProperties.tsx @@ -157,7 +157,7 @@ export class DslProperties extends React.Component<Props, State> { <Form autoComplete="off" onSubmit={event => event.preventDefault()}> {this.state.step === undefined && this.getIntegrationHeader()} {this.state.step && this.getComponentHeader()} - {this.state.step && this.getProps().map((property: PropertyMeta) => + {this.state.step && !['MarshalDefinition', 'UnmarshalDefinition'].includes(this.state.step.dslName) && this.getProps().map((property: PropertyMeta) => <DslPropertyField key={property.name} property={property} element={this.state.step} diff --git a/karavan-designer/src/designer/field/DataFormatField.tsx b/karavan-designer/src/designer/field/DataFormatField.tsx index 9a29653..0250ed2 100644 --- a/karavan-designer/src/designer/field/DataFormatField.tsx +++ b/karavan-designer/src/designer/field/DataFormatField.tsx @@ -99,6 +99,7 @@ export class DataFormatField extends React.Component<Props, State> { const s = <SelectOption key={lang[0]} value={lang[0]} description={lang[2]}/>; selectOptions.push(s); }) + console.log(properties) return ( <div> <FormGroup label={"Data Format"} key={"dataFormat"} fieldId={"dataFormat"}> @@ -117,7 +118,7 @@ export class DataFormatField extends React.Component<Props, State> { {selectOptions} </Select> </FormGroup> - <div className="expression"> + <div className="object"> <FormGroup key={"properties"} fieldId={"properties"}> diff --git a/karavan-designer/src/designer/karavan.css b/karavan-designer/src/designer/karavan.css index 3ebe2ea..410f883 100644 --- a/karavan-designer/src/designer/karavan.css +++ b/karavan-designer/src/designer/karavan.css @@ -327,15 +327,8 @@ .karavan .dsl-page .properties .parameters { padding-top: 6px; padding-left: 16px; - grid-row-gap: 10px; row-gap: 6px; display: grid; - border-width: var(--pf-global--BorderWidth--sm); - border-top-color: transparent; - border-right-color: transparent; - border-bottom-color: var(--pf-global--BorderColor--200); - border-left-color: var(--pf-global--BorderColor--300); - border-style: solid; } .karavan .dsl-page .properties .expression .pf-c-form__group-label, @@ -518,10 +511,16 @@ height: 50px; } +.step-element-selected { + background-color: rgb(171, 172, 224, 0.1); +} + .step-element .selected .header-icon { - border-color: black; + border-color: rgb(48, 50, 132); + background-color: rgb(171, 172, 224); border-width: 2px; } + .step-element .header .header-text { position: absolute; top: 8px; @@ -586,8 +585,8 @@ } .step-element .add-element-button { - top: 4px; - left: 4px; + top: 5px; + left: 5px; font-size: 15px; height: 15px; line-height: 1; diff --git a/karavan-vscode/CHANGELOG.md b/karavan-vscode/CHANGELOG.md index 4df3855..82b4dc6 100644 --- a/karavan-vscode/CHANGELOG.md +++ b/karavan-vscode/CHANGELOG.md @@ -1,5 +1,11 @@ # Changelog +## 0.0.10 +1. New look and Feel +2. Expression languages +3. DSL implementation for Try, Catch, Finally, CircuitBreaker, etc + + ## 0.0.9 1. Support Marshal and Unmarshal elements with configurable DataFormats (`any23`, `asn1`, `avro`, `barcode`, `base64`, `beanio`, `bindy`, `cbor`, `crypto`, `csv`, `custom`, `fhirJson`, `fhirXml`, `flatpack`, `grok`, `gzip`, `hl7`, `ical`, `jacksonxml`, `jaxb`, `json`, `jsonApi`, `lzf`, `mimeMultipart`, `pgp`, `protobuf`, `rss`, `secureXML`, `soapjaxb`, `syslog`, `tarfile`, `thrift`, `tidyMarkup`, `univocity-csv`, `univocity-fixed`, `univocity-tsv`, `xmlrpc`, `xstream`, `yaml`, `zip`, `zi [...] 2. Support of implicit dsl parameters configured as String, ex. `log: '${body}'` [#141](https://github.com/apache/camel-karavan/issues/141) diff --git a/karavan-vscode/README.md b/karavan-vscode/README.md index 0f1ca05..594cf64 100644 --- a/karavan-vscode/README.md +++ b/karavan-vscode/README.md @@ -7,21 +7,20 @@ ![karavan-vscode](screenshots/karavan-vscode.png) -## Features +# Features -* Read/Write Integration resources (*.yaml with kind:Integration) +* Read/Write Integration resources (*.yaml with kind:Integration) and plain yaml routes * Kamelets source/sink/action -* Enterprise Integration Patterns DSL (partial) -* Components consumer/producer (experimental) +* Enterprise Integration Patterns DSL +* Components consumer/producer +* Integration with [JBang](https://www.jbang.dev) -## Prerequisites +# Installation -* Apache Camel K installed. See the Apache Camel K installation page for details: (https://camel.apache.org/camel-k/next/installation/installation.html). -* Openshift or Kubernetes CLI +## Prerequisites * Microsoft VS Code installed. You can get the most recent version from (https://code.visualstudio.com/) for your chosen operating system. ## How to install - 1. Open your VS Code Integrated Development Environment (IDE). 2. In the VS Code Activity Bar, select Extensions. (Alternatively, press Ctrl+Shift+X). 3. In the search bar, type **Karavan** @@ -29,28 +28,45 @@ ![install](screenshots/install.png) -## How to +# Create and edit integration -### Create new Integration +## Create new Integration ![create](screenshots/create.png) -### Edit an existing Integration +## Edit an existing Integration ![open](screenshots/open.png) -### Deploy with Camel K on Kubernetes + +# Run integration + +## Run integration locally +* [JBang](https://www.jbang.dev) installed +* Click ![run](screenshots/run.png) button in VSCode or +```shell +jbang -Dcamel.jbang.version=3.15.0 CamelJBang@apache/camel run $INTEGRATION.yaml --max-messages=10 --logging-level=info +``` + +## Run integration in Kubernetes or Openshift + +## Prerequisites + +* Apache Camel K installed. See the Apache Camel K installation page for details: (https://camel.apache.org/camel-k/next/installation/installation.html). +* Openshift or Kubernetes CLI + +## Deploy with Camel K on Kubernetes ```shell kubectl apply -f integration.yaml ``` -### Deploy with Camel K on OpenShift +## Deploy with Camel K on OpenShift ```shell oc apply -f integration.yaml ``` -## Issues +# Issues If you find a new issue, please [create a new issue report in GitHub](https://github.com/apache/camel-karavan/issues)! diff --git a/karavan-vscode/screenshots/karavan-vscode.png b/karavan-vscode/screenshots/karavan-vscode.png index fda1786..036d10c 100644 Binary files a/karavan-vscode/screenshots/karavan-vscode.png and b/karavan-vscode/screenshots/karavan-vscode.png differ diff --git a/karavan-vscode/screenshots/run.png b/karavan-vscode/screenshots/run.png new file mode 100644 index 0000000..b8ee7fd Binary files /dev/null and b/karavan-vscode/screenshots/run.png differ diff --git a/karavan-vscode/webview/index.css b/karavan-vscode/webview/index.css index 09621f4..10893cb 100644 --- a/karavan-vscode/webview/index.css +++ b/karavan-vscode/webview/index.css @@ -32,7 +32,7 @@ body, } .vscode-dark .step-element-selected { - background-color: rgb(37, 37, 38, 0.5); + background-color: rgb(37, 37, 38, 0.7); } .vscode-dark .step-element .selected .text { @@ -40,7 +40,7 @@ body, } .vscode-dark .step-element .selected .header-icon { - border-color: rgb(88, 90, 194); + border-color: rgb(171, 172, 224); background: rgb(171, 172, 224); border-width: 2px; } @@ -151,11 +151,8 @@ body, --pf-c-tooltip__content--BackgroundColor: #505050; } -.vscode-dark .step-element .add-element-button { - color: #252526; -} - .vscode-dark .step-element .add-button, +.vscode-dark .step-element .add-element-button, .vscode-dark .step-element .add-button-from { background: #252526; color: rgb(239, 166, 79); diff --git a/screenshots/karavan-vscode.png b/screenshots/karavan-vscode.png index cf94dc0..036d10c 100644 Binary files a/screenshots/karavan-vscode.png and b/screenshots/karavan-vscode.png differ diff --git a/screenshots/karavan.png b/screenshots/karavan.png index 60966ae..ecf4a3c 100644 Binary files a/screenshots/karavan.png and b/screenshots/karavan.png differ