SenseNet / sn-redux

A set of redux actions, reducers and redux-ovbservable epics for sensenet

sn-redux

---

This package is not under active development. You can find our latest packages in the sensenset/sn-client monorepo.

---

sn-redux is a convention driven way of building sensenet applications using Redux. It contains all the action types, actions and reducers for built-in sensenet Actions and Functions.

sn-redux gives you a standard set of:

• action types: e.g. CREATE_CONTENT_SUCCESS
• actions: e.g. updateContentSuccess, updateContentFailure
• reducers: for the action types above e.g. updateContentSuccess

Tested with the following sensenet Services version:

Installation on an existing sensenet portal

Get the latest stable version with npm

npm install --save @sensenet/redux

or from the GitHub repository and place the downloaded source into your project. If you want to use only the transpiled

If you want to use the module types you can find them in the src folder. Import them the following way:

import { Actions } from '@sensenet/redux';
import { Repository } '@sensenet/client-core';
import { Task } from '@sensenet/default-content-types';

const repository = new Repository({
  RepositoryUrl: 'http://path-to-your-portal.com',
});

const repository = new Repository({
  repositoryUrl: 'http://path-to-your-portal.com',
})

store.dispatch(Actions.deleteContent('/workspaces/MyWorkspace/MyDocs/mydoc.docx', false));

Installation into an external app with node and npm

To install the latest stable version

npm install --save @sensenet/redux

Create your sensenet portal Repository to use. You can configure your Store to use this repository, when calling Store.ConfigureStore

import { Repository } from '@sensenet/client-core';
import { Reducers, Store } from '@sensenet/redux';
import { combineReducers } from 'redux'

const sensenet = Reducers.sensenet

const myReducer = combineReducers({
  sensenet
})

const repository = new Repository({
  repositoryUrl: 'http://path-to-your-portal.com',
})

const options = {
  repository,
  rootReducer: myReducer,
} as Store.CreateStoreOptions


const store = Store.createSensenetStore(options)

To enable your external app to send request against your sensenet portal change your Portal.settings. For further information about cross-origin resource sharing in sensenet check this article.

Check your sensenet portal's web.config and if the ODataServiceToken is set, you can pass to your Repository as a config value on client side.

let repository = new Repository.SnRepository({
  RepositoryUrl: 'http://path-to-your-portal.com',
  ODataToken: 'MyODataServiceToken'
});

Import

import { Actions } '@sensenet/redux';
import { Task } from '@sensenet/default-content-types'

...
const content = { Id: 123 } as Task;
...
store.dispatch(Actions.DeleteContent(content.Id, false));

Building sn-redux

Building the project, running all the unit tests and the ts linter and get the code coverage report, use:

npm run build

Running tests

To execute all unit tests and generate coverage reports, use:

npm t

Examples

Combine custom reducer with the built-in ones

import { combineReducers } from 'redux';
import { Reducers } from  '@sensenet/redux';

const sensenet = Reducers.sensenet;
const myReducer = combineReducers({
  sensenet,
  listByFilter
});

Creating a store

import { Store } from  '@sensenet/redux';
import { Repository } from '@sensenet/client-core';

const repository = new Repository({
  repositoryUrl: 'http://path-to-your-portal.com',
})

const options = {
  repository,
  rootReducer: myReducer,
} as Store.CreateStoreOptions


const store = Store.createSensenetStore(options)

Using built-in actions

import { Repository } from '@sensenet/client-core';
import { Task } from '@sensenet/default-content-type'
import { Actions } from '@sensenet/redux';

const repository = new Repository({
  repositoryUrl: 'http://path-to-your-portal.com',
})

const parentPath = '/workspaces/Project/budapestprojectworkspace/tasks';
const content = {
          Id: 123,
          DisplayName: 'My first task'
      } as Task);

dispatch(Actions.CreateContent(parentPath, content, 'Task'))

Documentation

• sn-redux API Reference
• sn-client-core API reference
• sn-redux-promise-middleware API reference
• About OData REST API in sensenet
• About Built-in OData Actions and Function in sensenet
• Todo App with React, Redux and sensenet

Influences

• Redux
• Getting started with Redux - Awesome course from the creator of Redux, Dan Abramov.
• Building React Applications with Idiomatic Redux - Another great course of Dan Abramov about building apps with Redux.
• redux-promise-middleware

Example applications

• Using React
• Sensenet DMS Demo