# x-task

> Rethink async tasks with JSX and React-like way

Latest version **0.1.4** (published 2017-10-16) · GPL-3.0 license · 0 weekly downloads

## Install

```sh
npm install x-task
pnpm add x-task
yarn add x-task
bun add x-task
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.4 |
| Published | 2017-10-16 |
| First published | 2017-10-15 |
| Weekly downloads | 0 |
| License | GPL-3.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | Artur Shelashskiy |
| Maintainers | a-omsk |

## Links

- npm: https://www.npmjs.com/package/x-task
- Repository: https://github.com/a-omsk/x-task
- Homepage: https://github.com/a-omsk/x-task#readme
- Issues: https://github.com/a-omsk/x-task/issues
- npm.io page: https://npm.io/package/x-task

## Dependencies (1)

- [lodash](https://npm.io/package/lodash.md) ^4.17.4

## Recent versions

- 0.1.4 (latest) — 2017-10-16
- 0.1.3 — 2017-10-16
- 0.1.2 — 2017-10-16
- 0.1.1 — 2017-10-15
- 0.1.0 — 2017-10-15

## README

# x-task

[![Build Status](https://travis-ci.org/a-omsk/x-task.svg?branch=master)](https://travis-ci.org/a-omsk/x-task)
[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)

Rethink async tasks with JSX and React style.

Write and compose your complex and domain async tasks via components and use common idioms from React community.
Works in any modern javascript environment that supports Promise.


### Install it

```
npm install x-task --save
```

### If you want to use jsx syntax
```
npm install --save-dev babel-plugin-transform-react-jsx
```

### Change default jsx pragma in your .babelrc if you don't use another jsx pragmas (like React, deku, h, etc.)
```json
{
  "plugins": [
      [
          "transform-react-jsx",
          {
              "pragma": "XTask.createTask"
          }
      ]
  ]
}
```

### If you want use it with another jsx libraries, just add it to top of your target file
```
/** @jsx XTask.createTask */
```

### And modify .babelrc
```json
{
  "plugins": ["transform-react-jsx"]
}
```



# And...

## Write your own tasks, sync or async.

```js
  import { Task } from 'x-task';

  class GetUser extends Task {
    do() {
      return fetch(`/api/users/${this.params.id}`);
    }
  }
```

## Compose your tasks with built-in tasks.

```js
import XTask, { Task, components } from 'x-task';
import { GetCurrentUser, GetUser, GetRecommendedUsers } from '...';

const { Merge, Either, Take } = components;

const task = (
  <Merge onResolve={onResolve}>
    <Either predicate={predicate}>
      <GetCurrentUser />
      <GetUser id={id} />
    </Either>
    <Take from="users" count={1}>
      <GetRecommendedUsers />
    </Take>
  </Merge>
);

task.start();
```


## Use powerful React idioms, such HOCs, etc.

```js
import XTask, { Task } from 'x-task';
import SomeTask from './SomeTask';

const withContext = (WrappedComponent) => {
    return class WithContext extends Task {
        getContext() {
            return "context";
        }

        do() {
            return (
                <WrappedComponent
                    {...this.params}
                    getContext={this.getContext.bind(this)}
                />
            );
        }
    };
};

const WrappedChild = withContext(SomeTask);

```

## Full API documentation

[Read them here](docs/API.md)

---
_Source: https://npm.io/package/x-task · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._