Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(wes): create Lit package for WES #149

Merged
merged 19 commits into from
Nov 14, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/documentation/docs/.vitepress/config.mts
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ export default defineConfig({
{ text: 'Usage', link: '/wes/usage' },
{
text: 'Components',
items: [],
items: [{ text: 'Create Run', link: '/wes/components/wes-create-run.md' }],
},
],
},
Expand Down
99 changes: 99 additions & 0 deletions apps/documentation/docs/wes/components/wes-create-run.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,99 @@
# Form Component <Badge type="warning" text="beta" />

<div class="component-name">&lt;ecc-client-lit-ga4gh-wes-create-run&gt;</div>
This component is used to create workflows runs using WES API.
<ClientOnly>
<div :class="isDark ? 'component-dark component' : 'component-light component'">
<ecc-client-lit-ga4gh-wes-create-run />

::: details Code Blocks
::: code-group

```js [HTML]
import "@elixir-cloud/lit-wes";

<ecc-utils-design-form />;
```

<!-- ```jsx [React]

``` -->

:::

</div>
</ClientOnly>

## Importing

```js [HTML]
import "@elixir-cloud/lit-wes";
```

## Properties

| Property | Required | Default | Type | Description |
| --------------------- | -------- | ----------------------------------------- | -------- | ----------- |
| [`baseURL`](#baseURL) | `false` | `https://prowes.rahtiapp.fi/ga4gh/wes/v1` | `String` | Base URL |

### baseURL

This property is used to give `POST` endpoint to create workflow. The provided baseURL is concatinated with `/runs` and is used as an endpoint to create a `POST` request.

## Parts

TODO:
anuragxxd marked this conversation as resolved.
Show resolved Hide resolved

<!-- | Part Name | Description |
| --------------- | --------------------------------------------------------------------------------- |
| `` | Component's internal form. | -->

## CSS Variables

## Examples

### With baseURL

<ClientOnly>
<div :class="isDark ? 'component-dark component' : 'component-light component'">
<!-- Render ecc-utils-design-form component only after the component is loaded -->
<ecc-client-lit-ga4gh-wes-create-run
baseURL="http://localhost:8090/ga4gh/wes/v1"
/>

::: details Code Blocks
::: code-group

```js [HTML]
import "@elixir-cloud/lit-wes";

<ecc-client-lit-ga4gh-wes-create-run baseURL="http://localhost:8090/ga4gh/wes/v1" />;
```

<!-- ```jsx [React]

``` -->

:::

</div>
</ClientOnly>

> The baseURL provided is localhost:8090, for this to work, have a WES implementation running on PORT 8090 or locally deploy [proWES](https://github.com/elixir-cloud-aai/proWES).

<script setup>
import { onMounted } from "vue";
import { useData } from "vitepress";
const { isDark } = useData();
onMounted(() => {
import("@elixir-cloud/lit-wes").then((module) => {
renderComponent.value = false;
renderComponent.value = true;
document.querySelectorAll("ecc-client-lit-ga4gh-wes-create-run").forEach((element) => {
element.addEventListener("form-submit", (e) => {
console.log("form-submitted", e.detail);
});
});
});
});
</script>
7 changes: 7 additions & 0 deletions apps/documentation/docs/wes/installation.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<!-- # Installation

`@elixir-cloud/wes` can be installed using npm as

```bash
npm install @elixir-cloud/lit-wes
``` -->
3 changes: 3 additions & 0 deletions apps/documentation/docs/wes/introduction.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# Introduction

`@elixir-cloud/wes` package provides a collection of Web Components for interacting with [WES (Workflow Execution Service)](https://github.com/ga4gh/workflow-execution-service-schemas/blob/develop/openapi/workflow_execution_service.openapi.yaml). It offers functionalities for listing, creating, and deleting task runs. These components facilitate seamless integration and enhanced user experience when working with WES.
1 change: 1 addition & 0 deletions apps/documentation/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
},
"dependencies": {
"@elixir-cloud/design": "*",
"@elixir-cloud/lit-wes": "*",
"vitepress": "^1.0.0-rc.24",
"vue": "3.3.5"
},
Expand Down
Loading
Loading