@tramvai/state NPM

State

State is a library built into tramvai for managing application state.

Peculiarities

Redux-like state manager
Built-in library similar to redux-act to reduce boilerplate code
Contains bindings to react components such as connect and useSelector
Dynamic initialization of reducers. You can register a reducer at any time or generate a new one.
Point subscriptions to changes in the states of reducers. When data changes, only the affected connect and useSelector are recalculated, not everything.
Support for SSR mode.

Basic concepts

Store - A class that contains the state of all reducers, change subscriptions and is created for each client
Reducers - entities in which we describe how data will be stored and transformed
Events - events with which you can change the states of reducers
Actions - functions that allow you to perform side effects and update data in the store. Similar to redux-thunk

Recommendations

You cannot mutate data in reducers. Otherwise, due to various optimizations, subscribers will not be notified about the changes.
Initialize reducers as early as possible and before using it. Otherwise, when calling dispatch(userLoadInformation()), the reducer will not yet track events and will not receive data.
Do not store static data in stores. Since this data will be transferred from the server to the client, the data will be duplicated. Better to put in constants.
Break into small reducers. Otherwise, we have a huge reducer that contains a large amount of information and any changes will cause recalculations for a large number of components.

Installation

npm i --save @tramvai/state

Explanation

schedule

Some of the functions that deals with state (e.g. connect, useStoreSelector) will use some sort of batching (using requestAnimationFrame or SetTimeout) in browser. So any updates to state are not synchronous and happens after some time.

Most of the time this is not an issue or noticeable thing. But in tests that might be unexpected.

In order to take into account scheduling while testing use waitRaf helper or act from test-unit

How to

Basic example

import { createReducer, createEvent } from '@tramvai/state';

export const userLoadInformation = createEvent('user load information');
export const userAddInformation = createEvent('user add information');

const userReducer = createReducer('user', {
  info: {},
})
  .on(userLoadInformation, (state, info) => ({ info }))
  .on(userAddInformation, (state, { name, info }) => ({
    ...state,
    state: {
      ...state.info,
      [name]: info,
    },
  }));

@tinkoff/react-hooks @tinkoff/utils @tramvai/types-actions-state-context @types/hoist-non-react-statics invariant react-is tslib use-sync-external-store

@everything-registry/sub-chunk-930 @tramvai/test-mocks @zalastax/nolb-_tram @tramvai/test-react @tramvai/test-unit @tramvai/module-metrics

3 days ago

8 days ago

8 days ago

9 days ago

9 days ago

9 days ago

9 days ago

12 days ago

12 days ago

13 days ago

13 days ago

17 days ago

17 days ago

18 days ago

18 days ago

18 days ago

20 days ago

20 days ago

20 days ago

20 days ago

20 days ago

20 days ago

23 days ago

24 days ago

24 days ago

24 days ago

24 days ago

25 days ago

27 days ago

27 days ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

2 months ago

2 months ago

2 months ago

2 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

8 months ago

8 months ago

6 months ago

8 months ago

8 months ago

5 months ago

6 months ago

6 months ago

6 months ago

6 months ago

10 months ago

6 months ago

6 months ago

9 months ago

10 months ago

9 months ago

10 months ago

10 months ago

8 months ago

7 months ago

6 months ago

6 months ago

7 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

6 months ago

6 months ago

7 months ago

7 months ago

7 months ago

6 months ago

6 months ago

6 months ago

7 months ago

8 months ago

8 months ago

7 months ago

8 months ago

8 months ago

9 months ago

9 months ago

9 months ago

7 months ago

9 months ago

7 months ago

7 months ago

7 months ago

10 months ago

5 months ago

5 months ago

8 months ago

8 months ago

5 months ago

9 months ago

7 months ago

9 months ago

8 months ago

8 months ago

10 months ago

6 months ago

9 months ago

7 months ago

9 months ago

9 months ago

8 months ago

9 months ago

9 months ago

9 months ago

8 months ago

8 months ago

8 months ago

10 months ago

8 months ago

9 months ago

8 months ago

9 months ago

9 months ago

8 months ago

9 months ago

8 months ago

8 months ago

9 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

11 months ago

11 months ago

11 months ago

1 year ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

11 months ago

12 months ago

11 months ago

12 months ago

11 months ago

11 months ago

11 months ago

12 months ago

12 months ago

12 months ago

11 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

1 year ago

2 years ago

2 years ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

1 year ago

2 years ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago