Skip to content
This repository was archived by the owner on Feb 11, 2021. It is now read-only.

Commit 9e6ea29

Browse files
committed
Add initial redux-trigger implementation example.
This code adds the redux-trigger implementation to the simple example code.
1 parent c50d37f commit 9e6ea29

File tree

9 files changed

+138
-13
lines changed

9 files changed

+138
-13
lines changed

examples/simple/actions/primes.js

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,34 @@
11

22
export const ADD_PRIME = 'ADD_PRIME';
33
export const ADD_NON_PRIME = 'ADD_PRIME';
4-
export const QUEUE_NUMBER = 'QUEUE_NUMBER';
4+
export const ADD_QUEUE_NUMBER = 'ADD_QUEUE_NUMBER';
5+
export const REMOVE_QUEUE_NUMBER = 'REMOVE_QUEUE_NUMBER';
56

6-
export function addNumber( number ) {
7+
export function addQueueNumber( number ) {
78
return {
8-
type: QUEUE_NUMBER,
9+
type: ADD_QUEUE_NUMBER,
910
number
1011
};
1112
}
1213

14+
export function removeQueueNumber( number ) {
15+
return {
16+
type: REMOVE_QUEUE_NUMBER,
17+
number
18+
};
19+
}
20+
21+
export function addPrime( number ) {
22+
return {
23+
type: ADD_PRIME,
24+
number
25+
};
26+
}
27+
28+
export function addNonPrime( number ) {
29+
return {
30+
type: ADD_NON_PRIME,
31+
number
32+
};
33+
}
34+

examples/simple/containers/App.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import NumberPicker from '../components/NumberPicker';
44
import NumberList from '../components/NumberList';
55
import WorkingMessage from '../components/WorkingMessage';
66
import { setNumberEntry } from '../actions/numberentry';
7-
import { addNumber } from '../actions/primes';
7+
import { addQueueNumber } from '../actions/primes';
88

99
class App extends Component {
1010
constructor( props ) {
@@ -22,7 +22,7 @@ class App extends Component {
2222

2323
const { numberEntry } = this.props;
2424
this.props.dispatch( setNumberEntry( '' ) );
25-
this.props.dispatch( addNumber( numberEntry ) );
25+
this.props.dispatch( addQueueNumber( numberEntry ) );
2626
}
2727

2828
render() {

examples/simple/index.jsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,10 @@ import { render } from 'react-dom';
44
import { Provider } from 'react-redux';
55
import App from './containers/App';
66
import configureStore from './store/configureStore';
7+
import { addQueueTrigger } from './triggers/primeStateTriggers';
78

89
const store = configureStore();
10+
store.dispatch( addQueueTrigger() );
911

1012
const rootComponent =
1113
<Provider store={ store }>
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
import { removeQueueNumber, addPrime, addNonPrime } from '../actions/primes';
2+
3+
export const CHECK_NEXT_PRIME = 'CHECK_NEXT_PRIME';
4+
5+
function createPrimesMiddleware() {
6+
return ( store ) => ( next ) => ( action ) => {
7+
switch ( action.type ) {
8+
case CHECK_NEXT_PRIME:
9+
const { queue } = store.getState().primeState;
10+
checkNextPrime( queue, store.dispatch );
11+
return true;
12+
default:
13+
return next( action );
14+
}
15+
};
16+
}
17+
18+
function checkNextPrime( queue, dispatch ) {
19+
if ( queue.length > 0 ) {
20+
const number = queue[0];
21+
console.log( 'checking next number ' + number );
22+
checkPrime( number ).then(
23+
( isPrime ) => {
24+
if ( isPrime ) {
25+
console.log( 'number ' + number + ' is prime!' );
26+
dispatch( addPrime( number ) );
27+
} else {
28+
console.log( 'number ' + number + ' is not prime!' );
29+
dispatch( addNonPrime( number ) );
30+
}
31+
dispatch( removeQueueNumber( number ) );
32+
}
33+
);
34+
}
35+
}
36+
37+
function checkPrime( number ) {
38+
return new Promise(
39+
( resolve, reject ) => {
40+
41+
for ( let i = 0; i < number; i++ ) {
42+
if ( Number.isInteger( number / i ) ) {
43+
resolve( true );
44+
}
45+
}
46+
47+
// No numbers below this one divided cleanly, it's prime.
48+
resolve( false );
49+
}
50+
);
51+
}
52+
53+
export function checkNextPrimeAction() {
54+
return { type: CHECK_NEXT_PRIME };
55+
}
56+
57+
export default createPrimesMiddleware;
58+

examples/simple/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,8 @@
3131
"react-dom": "^0.14.3",
3232
"react-redux": "^4.0.5",
3333
"redux": "^3.0.5",
34-
"redux-logger": "^2.3.1"
34+
"redux-logger": "^2.3.1",
35+
"redux-multi": "^0.1.10"
3536
},
3637
"devDependencies": {
3738
"babel": "^5.8.29",

examples/simple/reducers/index.js

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ import {
55
import {
66
ADD_PRIME,
77
ADD_NON_PRIME,
8-
QUEUE_NUMBER
8+
ADD_QUEUE_NUMBER,
9+
REMOVE_QUEUE_NUMBER
910
} from '../actions/primes';
1011

1112
function numberEntry( state = '', action ) {
@@ -35,22 +36,32 @@ const primesInitialState = {
3536
function primeState( state = primesInitialState, action ) {
3637
switch ( action.type ) {
3738
case ADD_PRIME:
38-
const primes = [ ...state.primes, action.prime ];
39+
const primes = [ ...state.primes, action.number ];
3940

4041
return Object.assign( {}, state, {
4142
primes
4243
} );
4344
case ADD_NON_PRIME:
44-
const nonPrimes = [ ...state.nonPrimes, action.nonPrime ];
45+
const nonPrimes = [ ...state.nonPrimes, action.number ];
4546

4647
return Object.assign( {}, state, {
4748
nonPrimes
4849
} );
49-
case QUEUE_NUMBER:
50-
const queue = [ ...state.queue, action.number ];
50+
case ADD_QUEUE_NUMBER:
51+
console.log("queueing number: " + action.number);
52+
const addedQueue = [ ...state.queue, action.number ];
5153

5254
return Object.assign( {}, state, {
53-
queue
55+
queue: addedQueue
56+
} );
57+
case REMOVE_QUEUE_NUMBER:
58+
console.log("unqueuing number: " + action.number);
59+
const removedQueue = state.queue.filter(
60+
( num ) => { return num != action.number }
61+
);
62+
63+
return Object.assign( {}, state, {
64+
queue: removedQueue
5465
} );
5566
default:
5667
return state;

examples/simple/store/configureStore.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,15 @@
11
import { createStore, applyMiddleware } from 'redux';
22
import createLogger from 'redux-logger';
3+
// TODO: Move this import to a proper module after it's build.
4+
import createTrigger from '../../../src';
5+
import multi from 'redux-multi';
6+
import createPrimesMiddleware from '../middleware/primesMiddleware';
37
import rootReducer from '../reducers';
48

59
const createStoreWithMiddleware = applyMiddleware(
10+
multi,
11+
createTrigger(),
12+
createPrimesMiddleware(),
613
createLogger()
714
)( createStore );
815

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// TODO: Switch this out with a proper import from the module when it's ready.
2+
import { createTrigger, addTrigger } from '../../../src';
3+
import { checkNextPrimeAction } from '../middleware/primesMiddleware';
4+
5+
const REMOVE_FROM_QUEUE = 'REMOVE_FROM_QUEUE';
6+
7+
function queueMatcher( state ) {
8+
const { queue } = state.primeState;
9+
console.log('queue');
10+
console.log(queue);
11+
return ( queue.length > 0 ? queue : null );
12+
}
13+
14+
export function addQueueTrigger() {
15+
return addTrigger( createTrigger(
16+
queueMatcher,
17+
( match ) => {
18+
return [
19+
checkNextPrimeAction(),
20+
addQueueTrigger(),
21+
];
22+
}
23+
) );
24+
}
25+

examples/simple/webpack.config.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ module.exports = {
2222
test: /\.jsx?$/,
2323
loaders: [ 'babel' ],
2424
exclude: /node_modules/,
25-
include: __dirname
2625
} ]
2726
},
2827
resolve: {

0 commit comments

Comments
 (0)