code refactoring and cleaning

Author: piotrwitek

README.md

@@ -102,7 +102,7 @@ const incrementCount = () => count++;
 
 export default () => (
   <SFCCounter
-    label='SFCCounter'
+    label={'SFCCounter'}
     count={count}
     onIncrement={incrementCount}
   />
@@ -148,7 +148,6 @@ export default () => (
   />
 );
 
-
 ```
 </p></details>
 
@@ -270,7 +269,7 @@ export const StatefulCounterWithInitialCount: React.ComponentClass<StatefulCount
         </div>
       );
     }
-  }
+  };
 
 ```
 
@@ -305,7 +304,7 @@ import * as React from 'react';
 export interface GenericListProps<T> {
   items: T[],
   itemRenderer: (item: T) => JSX.Element,
-};
+}
 
 export class GenericList<T> extends React.Component<GenericListProps<T>, {}> {
   render() {
@@ -326,7 +325,7 @@ export class GenericList<T> extends React.Component<GenericListProps<T>, {}> {
 ```tsx
 import * as React from 'react';
 
-import { IUser } from '@src/models'
+import { IUser } from '@src/models';
 import { GenericList } from '@src/components';
 
 export const UserList = class extends GenericList<IUser> { };
@@ -373,7 +372,7 @@ import { SFCCounterConnected } from '@src/connected';
 
 export default () => (
   <SFCCounterConnected
-    label="SFCCounterConnected"
+    label={'SFCCounterConnected'}
   />
 );
 
@@ -414,7 +413,7 @@ import { SFCCounterConnectedVerbose } from '@src/connected';
 
 export default () => (
   <SFCCounterConnectedVerbose
-    label="SFCCounterConnectedVerbose"
+    label={'SFCCounterConnectedVerbose'}
   />
 );
 
@@ -455,7 +454,7 @@ import { SFCCounterConnectedExtended } from '@src/connected';
 
 export default () => (
   <SFCCounterConnectedExtended
-    label="SFCCounterConnectedExtended"
+    label={'SFCCounterConnectedExtended'}
     initialCount={10}
   />
 );
@@ -495,7 +494,7 @@ export function withState<WrappedComponentProps extends RequiredProps>(
 
     state: State = {
       count: 0,
-    }
+    };
 
     handleIncrement = () => {
       this.setState({ count: this.state.count + 1 });
@@ -650,7 +649,7 @@ export type Actions = {
 };
 
 // Action Creators
-export const actionCreatorss = {
+export const actionCreators = {
   incrementSfc: (): Actions[typeof INCREMENT_SFC] => ({
     type: INCREMENT_SFC,
   }),
@@ -666,7 +665,7 @@ export const actionCreatorss = {
 import store from '@src/store';
 import { actionCreators } from '@src/redux/counters';
 
-store.dispatch(actionCreators.incrementSfc(1)); // Error: Expected 0 arguments, but got 1.
+// store.dispatch(actionCreators.incrementSfc(1)); // Error: Expected 0 arguments, but got 1.
 store.dispatch(actionCreators.incrementSfc()); // OK => { type: "INCREMENT_SFC" }
 
 ```
@@ -710,7 +709,7 @@ Relevant TypeScript Docs references:
 - [Discriminated Union types](https://www.typescriptlang.org/docs/handbook/advanced-types.html)
 - [Mapped types](https://www.typescriptlang.org/docs/handbook/advanced-types.html) e.g. `Readonly` & `Partial`  
 
-### Typing Reducer State
+### Reducer State
 Declare reducer `State` type definition with readonly modifier for `type level` immutability
 ```ts
 export type State = {
@@ -796,16 +795,18 @@ export const reducer = combineReducers<State, RootAction>({
 
 ### Reducer with static `type` property from helper factory function - `createActionCreator`
 ```ts
-export default function reducer(state = 0, action: RootAction): State {
-  switch (action.type) {
-    case actionCreators.increment.type:
-      return state.counter + 1;
-    case actionCreators.decrement.type:
-      return state.counter - 1;
-
-    default: return state;
-  }
-}
+export const reducer: Reducer<State> =
+  (state = 0, action: RootAction) => {
+    switch (action.type) {
+      case actionCreators.increment.type:
+        return state + 1;
+        
+      case actionCreators.decrement.type:
+        return state - 1;
+
+      default: return state;
+    }
+  };
 ```
 
 ---
@@ -869,8 +870,7 @@ export const rootReducer = combineReducers<RootState, RootAction>({
 ```tsx
 import { createStore, applyMiddleware, compose } from 'redux';
 import { createEpicMiddleware } from 'redux-observable';
-import { rootReducer, rootEpic } from '@src/redux';
-import { RootState } from '@src/redux';
+import { rootReducer, rootEpic, RootState } from '@src/redux';
 
 const composeEnhancers = (
   process.env.NODE_ENV === 'development' &&

generator/content/2_redux.md

@@ -51,7 +51,7 @@ Relevant TypeScript Docs references:
 - [Discriminated Union types](https://www.typescriptlang.org/docs/handbook/advanced-types.html)
 - [Mapped types](https://www.typescriptlang.org/docs/handbook/advanced-types.html) e.g. `Readonly` & `Partial`  
 
-### Typing Reducer State
+### Reducer State
 Declare reducer `State` type definition with readonly modifier for `type level` immutability
 ```ts
 export type State = {
@@ -108,16 +108,18 @@ state.countersCollection[0].readonlyCounter2 = 1; // Error, cannot be mutated
 
 ### Reducer with static `type` property from helper factory function - `createActionCreator`
 ```ts
-export default function reducer(state = 0, action: RootAction): State {
-  switch (action.type) {
-    case actionCreators.increment.type:
-      return state.counter + 1;
-    case actionCreators.decrement.type:
-      return state.counter - 1;
-
-    default: return state;
-  }
-}
+export const reducer: Reducer<State> =
+  (state = 0, action: RootAction) => {
+    switch (action.type) {
+      case actionCreators.increment.type:
+        return state + 1;
+        
+      case actionCreators.decrement.type:
+        return state - 1;
+
+      default: return state;
+    }
+  };
 ```
 
 ---

playground/src/components/error-message.tsx

@@ -4,7 +4,7 @@ export const ErrorMessage: React.SFC<{ onReset: () => any }> = ({ onReset }) =>
   const handleReset = () => {
     onReset();
     // TODO: switch location with router
-  }
+  };
 
   return (
     <div>

playground/src/components/generic-list.tsx

@@ -3,7 +3,7 @@ import * as React from 'react';
 export interface GenericListProps<T> {
   items: T[],
   itemRenderer: (item: T) => JSX.Element,
-};
+}
 
 export class GenericList<T> extends React.Component<GenericListProps<T>, {}> {
   render() {

playground/src/components/generic-list.usage.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { IUser } from '@src/models'
+import { IUser } from '@src/models';
 import { GenericList } from '@src/components';
 
 export const UserList = class extends GenericList<IUser> { };

playground/src/components/sfc-counter.usage.tsx

@@ -7,7 +7,7 @@ const incrementCount = () => count++;
 
 export default () => (
   <SFCCounter
-    label='SFCCounter'
+    label={'SFCCounter'}
     count={count}
     onIncrement={incrementCount}
   />

playground/src/components/sfc-spread-attributes.usage.tsx

@@ -7,4 +7,3 @@ export default () => (
     style={{ backgroundColor: 'lightcyan' }}
   />
 );
-

playground/src/components/stateful-counter-with-initial-count.tsx

@@ -51,4 +51,4 @@ export const StatefulCounterWithInitialCount: React.ComponentClass<StatefulCount
         </div>
       );
     }
-  }
+  };

playground/src/connected/sfc-counter-connected-extended.usage.tsx

@@ -4,7 +4,7 @@ import { SFCCounterConnectedExtended } from '@src/connected';
 
 export default () => (
   <SFCCounterConnectedExtended
-    label="SFCCounterConnectedExtended"
+    label={'SFCCounterConnectedExtended'}
     initialCount={10}
   />
 );

playground/src/connected/sfc-counter-connected-verbose.usage.tsx

@@ -4,6 +4,6 @@ import { SFCCounterConnectedVerbose } from '@src/connected';
 
 export default () => (
   <SFCCounterConnectedVerbose
-    label="SFCCounterConnectedVerbose"
+    label={'SFCCounterConnectedVerbose'}
   />
 );

playground/src/connected/sfc-counter-connected.usage.tsx

@@ -4,6 +4,6 @@ import { SFCCounterConnected } from '@src/connected';
 
 export default () => (
   <SFCCounterConnected
-    label="SFCCounterConnected"
+    label={'SFCCounterConnected'}
   />
 );

playground/src/containers/home.tsx

@@ -16,4 +16,4 @@ export const Home = () => {
       <UserListUsage users={[]} />
     </section>
   );
-}
+};

playground/src/hoc/with-state.tsx

@@ -20,7 +20,7 @@ export function withState<WrappedComponentProps extends RequiredProps>(
 
     state: State = {
       count: 0,
-    }
+    };
 
     handleIncrement = () => {
       this.setState({ count: this.state.count + 1 });

playground/src/models/user.ts

@@ -8,43 +8,41 @@ export interface IUserDTO {
 
 export interface IUser {
   constructor: {
-    fromDTO(user: IUserDTO): IUser;
+    create(user: IUserDTO): IUser;
   }
-  toDTO(): IUserDTO;
 
   id: string;
   firstName: string;
   lastName: string;
   fullName: string;
+
+  serialize(): IUserDTO;
 }
 
 export class User implements IUser {
   'constructor': typeof User;
 
-  constructor(id?: string) {
-    this.id = id || v4();
+  id: string = v4();
+  firstName: string = 'Default';
+  lastName: string = 'Name';
+  get fullName(): string {
+    return `${this.firstName} ${this.lastName}`;
   }
 
-  static fromDTO(dto: IUserDTO): IUser {
-    const model = new User(dto.id);
+  static create(dto: IUserDTO): IUser {
+    const model = new User();
+    model.id = dto.id;
     model.firstName = dto.first_name;
     model.lastName = dto.last_name;
 
     return model;
   }
 
-  toDTO(): IUserDTO {
+  serialize(): IUserDTO {
     return {
       id: this.id,
       first_name: this.firstName,
       last_name: this.lastName,
-    }
-  }
-
-  id: string;
-  firstName: string = 'Default';
-  lastName: string = 'Name';
-  get fullName(): string {
-    return `${this.firstName} ${this.lastName}`;
+    };
   }
 }

playground/src/redux/counters/actions.usage.ts

@@ -1,5 +1,5 @@
 import store from '@src/store';
 import { actionCreators } from '@src/redux/counters';
 
-store.dispatch(actionCreators.incrementSfc(1)); // Error: Expected 0 arguments, but got 1.
+// store.dispatch(actionCreators.incrementSfc(1)); // Error: Expected 0 arguments, but got 1.
 store.dispatch(actionCreators.incrementSfc()); // OK => { type: "INCREMENT_SFC" }

playground/src/redux/counters/index.ts

@@ -2,5 +2,6 @@
 export * from './actions';
 // export * from './epics';
 export * from './reducer';
-export * from './selectors';
+import * as CountersSelectors from './selectors';
+export { CountersSelectors };
 // export * from './types';

playground/src/redux/types.ts

@@ -9,7 +9,6 @@ export type Reducer<S> = (state: S, action: RootAction) => S;
 export type Api = {};
 // export type ThunkAction<T> = ReduxThunkAction<T, RootState, Api>;
 
-
 // OLD ACTION MERGING
 // import { returntypeof } from 'react-redux-typescript';
 

playground/src/store.ts

@@ -1,7 +1,6 @@
 import { createStore, applyMiddleware, compose } from 'redux';
 import { createEpicMiddleware } from 'redux-observable';
-import { rootReducer, rootEpic } from '@src/redux';
-import { RootState } from '@src/redux';
+import { rootReducer, rootEpic, RootState } from '@src/redux';
 
 const composeEnhancers = (
   process.env.NODE_ENV === 'development' &&

playground/src/types/augmentations.d.ts

@@ -9,7 +9,7 @@
 //   }
 // }
 
-// import { Reducer } from 'redux';
+import { Reducer } from 'redux';
 
 declare module 'redux' {
   export type TypedReducer<S, A = any> = (state: S, action: A) => S;