Almin v0.17 – Support `context.useCase#execute` typing and new React Context

June 9, 2018

azu

almin@0.17.0 is released 🎉

🔥 Breaking Change

Make Payload abstract class completely

You can not call super({ type: "type" }) in subclas of Payload anymore. Payload does not accept arguments.

New Payload is an abstract class.

export abstract class Payload<T = any> {
    /**
     * `type` is unique property of the payload.
     * A `type` property which may not be `undefined`
     * It is a good idea to use string constants or Symbol for payload types.
     */
    abstract readonly type: T;
}

This changes is related for TypeScript users.

⭐ Feature

Support context.useCase#execute typing #342 #107

We already have context.useCase(someUseCase).executor(useCase => useCase.execute()) for TypeScript. It is a alternative syntax of context.useCase(someUseCase).execute(), but it is type-safe method.

Previously, Almin can not expected args type of context.useCase(someUseCase).execute(args).

Almin 0.17 will expect args type of context.useCase(someUseCase).execute(args).

Examples: Almin 0.17+

import { UseCase, Context } from "almin";
class MyUseCaseA extends UseCase {
    execute(_a: string) {}
}
const context = new Context({
    store: createStore({ name: "test" })
});

// valid
context.useCase(new MyUseCaseA()).execute("A");
// invalid
context.useCase(new MyUseCaseA()).execute(); // no argument
context.useCase(new MyUseCaseA()).execute(1); // can not pass number
context.useCase(new MyUseCaseA()).execute(1, 2); // can not pass number

📝Drawback of execute()

However, execute() method has a drawback. Following case is not error in Almin 0.17.

import { UseCase, Context } from "almin";
class MyUseCaseA extends UseCase {
    execute(_a: string) {}
}
const context = new Context({
    store: createStore({ name: "test" })
});
// **valid in almin 0.17**
context.useCase(new MyUseCaseA()).execute("A". 42);

For more details, see https://github.com/almin/almin/issues/107#issuecomment-384993458

♻ Improving

use assertOK instead of assert module #341

Reduce file size of almin pacakge.

Before

Package size: 12.55 KB

After

Package size: 8.27 KB

⬇️ 4kb

Related Issue:

🆕 New Modules

@almin/react-context #346 #112

@almin/react-context provide React Context wrapper for almin. It is based on new React Context API.

It has same feature with almin-react-container, but different interface.

import { Context, StoreGroup } from "almin";
import { createStore } from "@almin/store-test-helper";
import { createReactContext } from "@almin/react-context";
// Create Almin context
const context = new Context({
    // StoreGroup has {a, b, c} state
    store: new StoreGroup({
        // createStore is a test helper that create Store instance of Almin
        // initial state of `a` is { value: "a" }
        a: createStore({ value: "a" }),
        b: createStore({ value: "b" }),
        c: createStore({ value: "c" }),
    })
});
// Create React Context that wrap Almin Context
const { Consumer, Provider } = createReactContext(context);
// Use Provider
class App extends React.Component {
    render() {
        return (
            // You should wrap Consumer with Provider
            <Provider>
                {/* Consumer children props is called when Almin's context is changed */}
                <Consumer>
                    {state => {
                        return <ul>
                            <li>{state.a.value}</li>;
                            <li>{state.b.value}</li>;
                            <li>{state.c.value}</li>;
                        </ul>
                    }}
                </Consumer>
            </Provider>
        );
    }
}

We want to provide a single React bining in the future. Because, two official way may confuse user.

Welcome feedback about @almin/react-context!

@almin/store-test-helper #347

@almin/store-test-helper provide factory function of Store for testing.

Recent Posts