@seminarcatalog/redux v1.2.0

SeminarCatalog Redux

This project is the official redux bridge for the SeminarCatalog Javascript SDK of the SeminarCatalog developed by the Databay AG.

Table of contents

• Installation
  • yarn
  • npm
• Getting Started
• Contributing
• License
• Documentation
  • Redux resources
  • Internals
• Appendix

Installation

yarn

Install this package via yarn:

yarn add @seminarcatalog/redux

npm

Install this package via npm:

npm install @seminarcatalog/redux --save

Getting Started

Please follow the installation instruction and execute the following JS code:

import { combineReducers, createStore } from 'redux';
import promise from 'redux-promise-middleware';
import thunk from 'redux-thunk';
import {ADDRESS} from "@seminarcatalog/redux";

const reducers = combineReducers({
    address: ADDRESS.reducer
});

const store = createStore(reducers, applyMiddleware(thunk, promise));

store
    .dispatch(ADDRESS.actions.LIST())
    .then(() => console.log(ADDRESS.selectors.getList(store.getState()));

Contributing

SeminarCatalog/redux is an open-source project which is mainly developed and maintained by Databay AG. You're interested in checking out how seminarcatalog/redux works and/or want to contribute to this project? Then checkout our contribution guide!

License

This project is licensed under the MIT License. See LICENSE document.

Documentation

Documentation for redux resources

Documentation for internals

createAsyncAction

A helper function to create a redux action creator function to handle async calls.

function createAsyncAction(type, prepareFn?)

Usually this function is only used internaly. But if you want to create your own async action creator function, you can do this with:

const asyncTopicList = createAsyncAction('topic/list', ({payload}) => ({
payload: () => new Promise((resolve) => setTimeout(() => { resolve (payload) }, 2000))
}));

const action = asyncTopicList('myPayload');
// { type: 'topic/list/request', payload: () => new Promise() }

console.log(action.toString())
// topic/list/request

console.log(`Action name is ${action}`)
// Action name is topic/list/request

console.log(action.onSuccess.toString());
// topic/list/success

console.log(action.onFailure.toString());
// topic/list/failure

The onSuccess action is dispatched, if the payload resolves, otherwise onFailure is dispatched.

createResourceActions

A helper function to create crud action creators for a given resource.

function createResourceActions(resource, apiEndpoint)

This function can be used to create redux crud actions based on a @seminarcatalog/sdk api endpoint.

import {TopicApi} from '@seminarcatalog/sdk';

const topicActions = createResourceActions('topic', TopicApi);

console.log(topicActions);
/*
{
    LIST: Function, // { type: 'topic/list/request', payload: Topic.topicList }
    GET: Function,  // { type: 'topic/get/request', payload: Topic.topicGet }
    CREATE: Function, // { type: 'topic/create/request', payload: Topic.topicCreate }
    UPDATE: Function, // { type: 'topic/update/request', payload: Topic.topicUpdate }
    DELETE: Function, // { type: 'topic/delete/request', payload: Topic.topicDelete }
}
*/

createResourceSelectors

A helper function to create a collection of selector function to select data from state.

function createResourceSelectors(resource)

This function can be used to create a set of selectors for a given resource

const topicSelectors = createResourceSelectors('topic');

const state = { /* the curent state */ };

console.log(topicSelectors.getList(state));
// A list of topics [{id: 1, ...}, {id: 2, ...}]

console.log(topicSelectors.getItem(state, 1));
// A topic {id: 1, ...}

createEntityReducer

A helper function to create the entity reducer for a resource

function createEntityReducer(resource, actions)

This function can be used to create an entity reducer for a set of crud actions and a defined resource. The created reducers reduces the state for the resource onSuccess list, get, create, update or delete action.

const action = createResourceActions('topic');
const topicReducer = createEntityReducer('topic', actions);

console.log(topicReducer);
/*
{
    [action.LIST.onSucces]: fn(state, action),
    [action.GET.onSucces]: fn(state, action),
    [action.CREATE.onSucces]: fn(state, action),
    [action.UPDATE.onSucces]: fn(state, action),
    [action.DELETE.onSucces]: fn(state, action)
}
*/

createResourceReducer

A helper function to create a combined reducer for all resource reducers.

function createResourceReducer(resource, actions)

This function can be used to create a combined reducer of all resource reducers. Currently the following reducers are combinded into one resource reducer:

• Reducer created by createEntityReducer

const actions = createResourceActions('topic');
const resourceReducer = createResourceReducer('topic', actions);

console.log(resourceReducer);
/*
{
    entities: createEntityReducer('topic')
}
*/

createReduxResource

A helper function to create a collection object for all redux function of a defined resource.

function createReduxResource(resource, apoEndpoint)

This function is the all-in-one creator function for a resource to create a resource reducer, resource crud actions and resource selectors and collects them in one object. The library uses this function to provide the full functionality for all @seminarcatalog/sdk endpoints.

import {TopicApi} from '@seminarcatalog/sdk';

const TOPIC = createReduxResource('topic', TopicApi);

• TOPIC.reducer: The reducer created by createResourceReducer
• TOPIC.actions: The reducer created by createResourceActions
• TOPIC.selectors: The reducer created by createResourceSelectors

Appendix

This SDK is automatically generated by the Swagger Codegen project:

• API version: 1.0.0
• Build package: de.databay.seminarcatalog.codegen.DatabayReduxGenerator For more information, please visit https://www.databay.de