Skip to content

Commit

Permalink
first commit
Browse files Browse the repository at this point in the history
  • Loading branch information
Ruben-Arushanyan committed Apr 13, 2021
0 parents commit 6981dc5
Show file tree
Hide file tree
Showing 11 changed files with 5,338 additions and 0 deletions.
2 changes: 2 additions & 0 deletions .github/FUNDING.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
github: Ruben-Arushanyan
custom: ["https://www.paypal.me/rubenarushanyan"]
109 changes: 109 additions & 0 deletions .github/workflows/publish.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,109 @@
# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages

name: Publish

on:
release:
types: [created]
workflow_dispatch:


jobs:
build:

runs-on: ubuntu-latest

strategy:
matrix:
node-version: [10.x, 12.x, 14.x, 15.x]
# See supported Node.js release schedule at https://nodejs.org/en/about/releases/

steps:
- uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v2
with:
node-version: ${{ matrix.node-version }}
- run: npm ci
- run: npm run build --if-present
- run: npm test

publish-npm:
needs: build
runs-on: ubuntu-latest

steps:
# Publish to Node Package Manager
- name: Checkout Repo
uses: actions/checkout@v2

- name: Setup Node.js (NPM)
uses: actions/setup-node@v2
with:
node-version: '14'
registry-url: 'https://registry.npmjs.org'

- name: Install dependencies
run: npm ci

- name: Update Publish Config
run: sed -i 's^registry-url^registry.npmjs.org^' package.json

- name: Publish to NPM
run: npm publish --access public
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}





###################### Open publish-gpr job if you need to publish also GitHub packages #######################

# publish-gpr:
# if: always()
# needs: [build, publish-npm]
# runs-on: ubuntu-latest

# steps:
# # Publish to GitHub Package Registry
# - name: Checkout Repo
# uses: actions/checkout@v2

# - name: Store lowercase actor name
# run: |
# echo 'actor_name<<EOF' >> $GITHUB_ENV
# echo ${{ github.actor }} | tr "A-Z" "a-z" >> $GITHUB_ENV
# echo 'EOF' >> $GITHUB_ENV

# - name: Store package name
# run: |
# echo 'package_name<<EOF' >> $GITHUB_ENV
# grep -Po '"name": *\K"[^"]*"' package.json | grep -oP '"\K[^"\047]+(?=["\047])' >> $GITHUB_ENV
# echo 'EOF' >> $GITHUB_ENV

# - name: Setup Node.js (GPR)
# uses: actions/setup-node@v2
# with:
# node-version: '14'
# registry-url: https://npm.pkg.github.com/
# scope: '${{ env.actor_name }}'

# - name: Install dependencies
# run: npm ci

# - name: Update Package Name
# run: |
# sed -i 's,"name": "${{ env.package_name }}","name": "@${{ env.actor_name }}/${{ env.package_name }}",' package.json
# cat package.json

# - name: Update Publish Config
# run: |
# sed -i 's^registry-url^npm.pkg.github.com/@${{ env.actor_name }}^' package.json
# cat package.json

# - name: Publish to GitHub Package Registry
# run: npm publish --access public
# env:
# NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
29 changes: 29 additions & 0 deletions .github/workflows/test.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions

name: Test

on:
push:
pull_request:
workflow_dispatch:

jobs:
build:

runs-on: ubuntu-latest

strategy:
matrix:
node-version: [10.x, 12.x, 14.x, 15.x]
# See supported Node.js release schedule at https://nodejs.org/en/about/releases/

steps:
- uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v2
with:
node-version: ${{ matrix.node-version }}
- run: npm ci
- run: npm run build --if-present
- run: npm test
7 changes: 7 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
node_modules

# ide
.idea
.vscode

.eslintcache
1 change: 1 addition & 0 deletions AUTHORS
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Ruben Arushanyan <[email protected]>
21 changes: 21 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
MIT License

Copyright (c) 2020-present Ruben Arushanyan (https://github.com/ruben-arushanyan)

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
149 changes: 149 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,149 @@
# Redux Cool

> ### **Build redux logic, without getting nervous**
## Description
**`Redux Cool`** is an awesome tiny package that allows you to easily and intuitively write redux logic. It is the collection of two separate libraries, one designed to create reducer functions and the other to create action objects: ([Reducers Creator](https://github.com/Ruben-Arushanyan/reducers-creator) for creating reducers functions and [Actions Creator](https://github.com/Ruben-Arushanyan/actions-creator) for creating actions object)

## Installation

```bash
npm install redux redux-cool
```

## Getting Started

Create a file named `src/accountReducer.js`

*src/accountReducer.js*
```javascript
import {reducersCreator} from "redux-cool"

const initialState = {
profile: {
data: null
}
}

const reducerTree = {

PROFILE: {

SET: (state, action) => {
const [data] = action.args
state.profile.data = data
},

UPDATE_EMAIL: (state, action) => {
const [email] = action.args
state.profile.data.email = email
}
},

CLEAR: (state, action) => {
state.profile.data = null
}

}

const accountReducer = reducersCreator(
"ACCOUNT",
initialState,
reducerTree,
)

export default accountReducer

```
As you can see in the example above, we create an **`accountReducer`** by calling the `reducersCreator` function and passing it three arguments:

- **`"ACCOUNT"`** : It's the **name** of the reducer, it can be any `String`
- **`initialState`** : It's the **initial state** of the reducer, it can be any `Object`
- **`reducerTree`** : It's an `Object` *(can have any deep and nested structure)* that intuitively and in readible ways, defines `handler functions` for reducer. `Handler functions` as an argument take `state` and `action` and update the state. It automatically uses the [immer library](https://immerjs.github.io/immer/) to do **immutable updates** with normal mutative code, like `state.profile.data.email = email`. There is no need to manually do immutable updates and return the result. If you are not familiar with the [immer library](https://immerjs.github.io/immer/), please look at it, it is very important.

As a result, we get the **`accountReducer`** function, which can handle the following type of actions:
- types: `"PROFILE/SET"` or `"ACCOUNT/PROFILE/SET"`
- types: `"PROFILE/UPDATE_EMAIL"` or `"ACCOUNT/PROFILE/UPDATE_EMAIL"`
- types: `"CLEAR"` or `"ACCOUNT/CLEAR"`

As you can see, each handler can work with **two** types of actions, one consisting of the path described in *reducerTree*, the second is the same as the first type plus the reducer name that should be added from the beginning like `"CLEAR"` and `"ACCOUNT/CLEAR"`. That is the most important and useful feature of this library.
### In both cases (`"CLEAR"` and `"ACCOUNT/CLEAR"`), the **CLEAR** handler is called in the **accountReducer**, but when we have multiple reducers that have the **CLEAR** handler and we need to clear the state of all reducers, we must use `"CLEAR"` action type, but if we need to delete only the **ACCOUNT** reducer state we must use the `"ACCOUNT/CLEAR"` action type.

<br/>

Now that we have the **accountReducer**, let's create the redux store

Create a file named **src/store.js**

*src/store.js*
```javascript
import {createStore} from "redux"
import {actionsCreator} from "redux-cool"
import accountReducer from "./accountReducer.js"

// Create Store
const store = createStore(accountReducer)

// Dispatch Set Profile Action
store.dispatch(actionsCreator.PROFILE.SET({
email: 'test@test',
name: 'Test'
})
)
console.log(store.getState())
// {
// profile: {
// data: {email: 'test@test', name: 'Test'}
// }
// }


// Dispatch Update Email Action
store.dispatch(actionsCreator.PROFILE.UPDATE_EMAIL('test2@test2'))
console.log(store.getState())
// {
// profile: {
// data: {email: 'test2@test2', name: 'Test'}
// }
// }



// Dispatch Clear Email Action
store.dispatch(actionsCreator.CLEAR())
console.log(store.getState())
// {
// profile: {
// data: null
// }
// }

```


## API

### **`reducersCreator(name, initialState, reducerTree)`**
<br/>

- **`name`** \<String> **name** of the reducer, it can be any `String`
- **`initialState`** \<Object> **initial state** of the reducer, it can be any `Object`
- **`reducerTree`** \<Object> object *(can have any deep and nested structure)* that intuitively and in readible ways, defines `handler functions` for reducer. `Handler functions` as an argument take `state` and `action` and update the state. It automatically uses the [immer library](https://immerjs.github.io/immer/) to do **immutable updates** with normal mutative code, like `state.profile.data.email = email`. There is no need to manually do immutable updates and return the result. If you are not familiar with the [immer library](https://immerjs.github.io/immer/), please look at it, it is very important.

<br/>

### **`actionsCreator.ANY.ACTION.TYPE(...args)`**
<br/>

- see: [Actions Creator](https://github.com/Ruben-Arushanyan/actions-creator) for details

<hr/>

## Maintainers

- [Ruben Arushanyan](https://github.com/ruben-arushanyan)

<hr/>

## License
[MIT](https://github.com/ruben-arushanyan/redux-cool/blob/master/LICENSE)
Loading

0 comments on commit 6981dc5

Please sign in to comment.