Closed doutori closed 4 years ago
Code Generating of Redux Action, Reducer, and its test code.
The file structure is changed to make code generation easier.
npm run gen redux
or
npx hygen generate redux
import { GET_SAMPLE, UPDATE_SAMPLE } from '~/constant'; import { SampleActionTypes } from '~/actionTypes'; import { SampleState } from '~/stateTypes'; export const getSample = (): SampleActionTypes => ({ type: GET_SAMPLE }); export const updateSample = (payload: SampleState): SampleActionTypes => ({ type: UPDATE_SAMPLE, payload, });
import { GET_SAMPLE, UPDATE_SAMPLE } from '~/constant'; import { SampleState } from '~/stateTypes'; interface GetSampleAction { type: typeof GET_SAMPLE; } interface UpdateSampleAction { type: typeof UPDATE_SAMPLE; payload: SampleState; } export type SampleActionTypes = GetSampleAction | UpdateSampleAction;
import { GET_SAMPLE, UPDATE_SAMPLE } from '~/constant'; import { SampleActionTypes } from '~/actionTypes'; import { SampleState } from '~/stateTypes'; export const initialSample: SampleState = { value: '' }; export const sample = ( state = initialSample, action: SampleActionTypes ): SampleState => { switch (action.type) { case GET_SAMPLE: return state; case UPDATE_SAMPLE: return { ...state, ...action.payload }; default: return state; } };
import snapshotDiff from 'snapshot-diff'; import { updateSample } from '~/actions/sample'; import { initialSample, sample } from '~/reducers/sample'; import { SampleState } from '~/stateTypes'; const testingSample: SampleState = { value: 'hoge' }; describe('Sample reducer', () => { it('update sample', () => { expect( snapshotDiff( initialSample, sample(initialSample, updateSample(testingSample)) ) ).toMatchSnapshot(); }); });
export * from './account'; export * from './counter'; +++ export * from './sample';
... export const GET_ACCOUNT = 'GET_ACCOUNT'; export const UPDATE_ACCOUNT = 'UPDATE_ACCOUNT'; +++ export const GET_SAMPLE = 'GET_SAMPLE'; +++ export const UPDATE_SAMPLE = 'UPDATE_SAMPLE';
export { account } from '~/reducers/account'; export { counter } from '~/reducers/counter'; +++ export { sample } from '~/reducers/sample';
... export interface AccountState { data: Account; } +++ export interface SampleState { +++ value: string; +++ }
Is it too many features ? ? ? And more, needs redux-saga task generator, too?
Todo
Code Generating of Redux Action, Reducer, and its test code.
The file structure is changed to make code generation easier.
how to use
or
Screen Shot
Generated Code Samples
Added Files
actions/sample/index.ts
actionTypes/sample.ts
reducers/sample/index.ts
reducers/sample/test/sample.test.ts
Updated Files ( +++ line is added )
actionTypes/index.ts
constant.ts
reducers/reducers.ts
stateTypes.ts