Updated type definitions for next-redux-wrapper@2.x (#27321)

This commit is contained in:
Jungwoo An
2018-07-24 02:31:37 +09:00
committed by Andy
parent e84f8afeef
commit 77ee2ed0dc
2 changed files with 35 additions and 89 deletions

View File

@@ -1,17 +1,11 @@
// Type definitions for next-redux-wrapper 1.4
// Type definitions for next-redux-wrapper 2.0
// Project: https://github.com/kirill-konshin/next-redux-wrapper
// Definitions by: Steve <https://github.com/stevegeek>
// Jungwoo-An <https://github.com/Jungwoo-An>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 2.8
/// <reference types="node" />
/*~ Note that ES6 modules cannot directly export callable functions.
*~ This file should be imported using the CommonJS-style:
*~ import x = require('next-redux-wrapper');
*~
*~ Refer to the documentation to understand common
*~ workarounds for this limitation of ES6 modules.
*/
import { IncomingMessage, ServerResponse } from 'http';
import { ComponentType } from 'react';
@@ -21,46 +15,34 @@ import {
} from 'react-redux';
import { Store } from 'redux';
export = nextReduxWrapper;
declare function nextReduxWrapper<TInitialState = any, TStateProps = any, TDispatchProps = any, TOwnProps = any, TMergedProps = any>(
options: nextReduxWrapper.Options<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps>
): (ComponentType: ComponentType<TOwnProps & TMergedProps>) => nextReduxWrapper.NextReduxWrappedComponent<TOwnProps>;
declare function nextReduxWrapper<TInitialState = any, TStateProps = any, TDispatchProps = any, TOwnProps = any, TMergedProps = any>(
createStore: nextReduxWrapper.NextStoreCreator<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps>,
mapStateToProps?: MapStateToPropsParam<TStateProps, TOwnProps, any>,
mapDispatchToProps?: MapDispatchToPropsParam<TDispatchProps, TOwnProps>,
mergeProps?: MergeProps<TStateProps, TDispatchProps, TOwnProps, TMergedProps>,
options?: ConnectOptions
): (ComponentType: ComponentType<TOwnProps & TMergedProps>) => nextReduxWrapper.NextReduxWrappedComponent<TOwnProps>;
declare namespace nextReduxWrapper {
interface NextPageComponentMethods {
getInitialProps(props: any): Promise<any>;
}
type NextReduxWrappedComponent<P> = ComponentType<P> & NextPageComponentMethods;
type NextStoreCreator<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps> = (
initialState: TInitialState,
options: StoreCreatorOptions<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps>
) => Store<TInitialState>;
interface Options<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps> {
createStore: NextStoreCreator<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps>;
debug?: boolean;
interface Options {
storeKey?: string;
mapStateToProps?: MapStateToPropsParam<TStateProps, TOwnProps, any>;
mapDispatchToProps?: MapDispatchToPropsParam<TDispatchProps, TOwnProps>;
mergeProps?: MergeProps<TStateProps, TDispatchProps, TOwnProps, TMergedProps>;
connectOptions?: ConnectOptions;
debug?: boolean;
}
interface StoreCreatorOptions<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps> extends Options<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps> {
interface StoreCreatorOptions<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps> extends Options {
isServer: boolean;
req?: IncomingMessage;
res?: ServerResponse;
query?: any;
}
function setPromise(Promise: any): void;
function setDebug(debug: boolean): void;
interface NextPageComponentMethods {
getInitialProps(props: any): Promise<any>;
}
type NextReduxWrappedComponent<P> = ComponentType<P> & NextPageComponentMethods;
type NextStoreCreator<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps> = (
initialState: TInitialState,
options: StoreCreatorOptions<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps>
) => Store<TInitialState>;
}
declare function nextReduxWrapper<TInitialState = any, TStateProps = any, TDispatchProps = any, TOwnProps = any, TMergedProps = any>(
makeStore: nextReduxWrapper.NextStoreCreator<TInitialState, TStateProps, TDispatchProps, TOwnProps, TMergedProps>,
config?: nextReduxWrapper.Options
): (ComponentType: ComponentType<TOwnProps & TMergedProps>) => nextReduxWrapper.NextReduxWrappedComponent<TOwnProps>;
export default nextReduxWrapper;

View File

@@ -1,18 +1,17 @@
import * as React from 'react';
import withRedux = require('next-redux-wrapper');
import withRedux from 'next-redux-wrapper';
import { createStore, Reducer, Store, AnyAction } from 'redux';
import { StoreCreatorOptions } from 'next-redux-wrapper';
interface InitialState {
foo: string;
}
const reducer: Reducer<InitialState> = (state: InitialState = {foo: ''}, action: AnyAction): InitialState => {
const reducer: Reducer<InitialState> = (state: InitialState = { foo: '' }, action: AnyAction): InitialState => {
switch (action.type) {
case 'FOO':
return {...state, foo: action.payload};
default:
return state;
return { ...state, foo: action.payload };
default:
return state;
}
};
@@ -29,14 +28,10 @@ interface Props {
custom: string;
}
interface ReduxStore {
foo: string;
}
class Page extends React.Component<OwnProps & Props> {
static getInitialProps({store, isServer, pathname, query}: any) {
store.dispatch({type: 'FOO', payload: 'foo'});
return {custom: 'custom'};
static getInitialProps({ store, isServer, pathname, query }: any) {
store.dispatch({ type: 'FOO', payload: 'foo' });
return { custom: 'custom' };
}
render() {
return (
@@ -53,48 +48,17 @@ type DispatchProps = Props;
type MergedProps = Props;
// Test various typings
const Com1 = withRedux(makeStore, (state: ReduxStore) => ({foo: state.foo}))(Page);
const Com2 = withRedux(makeStore, (state: ReduxStore) => ({foo: state.foo}))(Page);
const Com3 = withRedux<InitialState>(makeStore, (state: ReduxStore) => ({foo: state.foo}))(Page);
const Com4 = withRedux<InitialState, ConnectStateProps>(
makeStore,
(state: ReduxStore) => ({foo: state.foo, custom: 'hi'})
)(Page);
const Com5 = withRedux<InitialState, ConnectStateProps, DispatchProps, OwnProps, MergedProps>(
makeStore,
(state: ReduxStore) => ({foo: state.foo, custom: 'hi'}),
undefined,
(state: Props) => ({foo: state.foo, custom: 'hi'})
)(Page);
const Com6 = withRedux<InitialState, ConnectStateProps, DispatchProps, OwnProps, MergedProps>(
(initialState: InitialState, options: StoreCreatorOptions<InitialState, ConnectStateProps, DispatchProps, OwnProps, MergedProps>) => {
const Com1 = withRedux<InitialState, ConnectStateProps, DispatchProps, OwnProps, MergedProps>(
(initialState: InitialState, options) => {
if (options.isServer || options.req || options.query || options.res) {
const a = 1;
}
return createStore(reducer, initialState);
},
(state: ReduxStore) => ({foo: state.foo, custom: 'hi'}),
undefined,
(state: Props) => ({foo: state.foo, custom: 'hi'})
)(Page);
const Com7 = withRedux({
createStore: makeStore,
mapStateToProps: (state: ReduxStore) => ({foo: state.foo})
})(Page);
const Com2 = withRedux(makeStore)(Page);
const com1Instance = (<Com1 />);
const com1Instance = (<Com1 bar="foo" />);
const com2Instance = (<Com2 />);
const com3Instance = (<Com3 />);
const com4Instance = (<Com4 />);
const com5Instance = (<Com5 bar="foo" />);
const com6Instance = (<Com6 bar="foo" />);
const com7Instance = (<Com7 />);
withRedux.setPromise(Promise);
withRedux.setDebug(true);