Updated deps and refactored code to fix breaking changes

Author: piotrwitek

playground/package-lock.json

@@ -21,34 +21,34 @@
     "build-storybook": "build-storybook -s public"
   },
   "dependencies": {
-    "@types/jest": "24.0.11",
-    "@types/node": "11.13.8",
-    "@types/prop-types": "15.7.1",
-    "@types/react": "16.8.14",
-    "@types/react-dom": "16.8.4",
-    "@types/react-redux": "7.0.8",
-    "@types/react-router-dom": "4.3.2",
+    "@testing-library/react": "9.3.1",
+    "@types/jest": "24.0.21",
+    "@types/node": "12.12.5",
+    "@types/prop-types": "15.7.3",
+    "@types/react": "16.9.11",
+    "@types/react-dom": "16.9.3",
+    "@types/react-redux": "7.1.5",
+    "@types/react-router-dom": "5.1.2",
     "axios": "^0.19.0",
-    "connected-react-router": "6.5.0",
+    "connected-react-router": "6.5.2",
     "cuid": "2.1.6",
     "prop-types": "15.7.2",
-    "react": "16.8.6",
-    "react-dom": "16.8.6",
-    "react-redux": "7.1.0",
-    "react-redux-typescript-scripts": "1.5.0",
-    "react-router-dom": "4.3.1",
-    "react-scripts": "3.0.1",
-    "react-testing-library": "7.0.0",
-    "redux": "4.0.1",
-    "redux-observable": "1.1.0",
+    "react": "16.11.0",
+    "react-dom": "16.11.0",
+    "react-redux": "7.1.1",
+    "react-redux-typescript-scripts": "1.6.2",
+    "react-router-dom": "5.1.2",
+    "react-scripts": "3.2.0",
+    "redux": "4.0.4",
+    "redux-observable": "1.2.0",
     "redux-thunk": "2.3.0",
     "reselect": "4.0.0",
-    "rxjs": "6.5.1",
-    "tslib": "1.9.3",
-    "tslint": "5.16.0",
-    "typesafe-actions": "4.2.0",
-    "typescript": "3.4.5",
-    "utility-types": "3.5.0"
+    "rxjs": "6.5.3",
+    "tslib": "1.10.0",
+    "tslint": "5.20.0",
+    "typesafe-actions": "5.1.0",
+    "typescript": "3.7.1-rc",
+    "utility-types": "3.9.0"
   },
   "browserslist": [
     ">0.2%",
@@ -57,14 +57,14 @@
     "not op_mini all"
   ],
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.9",
-    "@storybook/addon-links": "5.1.9",
-    "@storybook/addon-storyshots": "5.1.9",
-    "@storybook/addons": "5.1.9",
-    "@storybook/react": "5.1.9",
-    "@types/storybook__addon-storyshots": "4.0.1",
+    "@storybook/addon-actions": "5.2.5",
+    "@storybook/addon-links": "5.2.5",
+    "@storybook/addon-storyshots": "5.2.5",
+    "@storybook/addons": "5.2.5",
+    "@storybook/react": "5.2.5",
+    "@types/storybook__addon-storyshots": "5.1.1",
     "@types/storybook__react": "4.0.2",
-    "react-test-renderer": "16.8.6",
-    "require-context.macro": "1.0.4"
+    "react-test-renderer": "16.11.0",
+    "require-context.macro": "1.2.2"
   }
 }

playground/package.json

@@ -21,12 +21,6 @@ export class ClassCounterWithDefaultProps extends React.Component<
     count: this.props.initialCount,
   };
 
-  componentWillReceiveProps({ initialCount }: Props) {
-    if (initialCount != null && initialCount !== this.props.initialCount) {
-      this.setState({ count: initialCount });
-    }
-  }
-
   handleIncrement = () => {
     this.setState({ count: this.state.count + 1 });
   };

playground/src/components/class-counter-with-default-props.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { createStore, combineReducers } from 'redux';
 import { Provider } from 'react-redux';
-import { render, fireEvent, cleanup } from 'react-testing-library';
+import { render, fireEvent, cleanup } from '@testing-library/react';
 
 import { FCCounterConnectedOwnProps as ConnectedCounter } from './fc-counter-connected-own-props';
 

playground/src/connected/fc-counter-connected-own-props.spec.tsx

@@ -1,22 +1,17 @@
 import cuid from 'cuid';
-import { createStandardAction } from 'typesafe-actions';
+import { createAction } from 'typesafe-actions';
 
 import { TodosFilter, Todo } from './models';
 
 const ADD = 'todos/ADD';
 const TOGGLE = 'todos/TOGGLE';
 const CHANGE_FILTER = 'todos/CHANGE_FILTER';
 
-export const add = createStandardAction(ADD).map(
-  (payload: { title: string }) => ({
-    payload: {
-      ...payload,
-      id: cuid(),
-      completed: false,
-    } as Todo,
-  })
-);
+export const add = createAction(ADD, (title: string) => ({
+  id: cuid(),
+  title,
+}))<Todo>();
 
-export const toggle = createStandardAction(TOGGLE)<{ id: string }>();
+export const toggle = createAction(TOGGLE)<{ id: string }>();
 
-export const changeFilter = createStandardAction(CHANGE_FILTER)<TodosFilter>();
+export const changeFilter = createAction(CHANGE_FILTER)<TodosFilter>();

playground/src/features/todos-typesafe/actions.ts

@@ -14,16 +14,16 @@ const initialState: TodosState = {
 };
 
 const todos = createReducer(initialState.todos)
-  .handleAction(ADD, (state, action) => [...state, action.payload])
-  .handleAction(TOGGLE, (state, action) =>
+  .handleType(ADD, (state, action) => [...state, action.payload])
+  .handleType(TOGGLE, (state, action) =>
     state.map(item =>
       item.id === action.payload
         ? { ...item, completed: !item.completed }
         : item
     )
   );
 
-const todosFilter = createReducer(initialState.todosFilter).handleAction(
+const todosFilter = createReducer(initialState.todosFilter).handleType(
   CHANGE_FILTER,
   (state, action) => action.payload
 );

playground/src/features/todos/reducer-ta.ts

@@ -10,10 +10,8 @@ const createName = (name: string): Name => {
   return name as any;
 };
 
-// Method 2: using "enum"
-export enum SurnameBrand {}
-type Surname = SurnameBrand & string;
-// interface Surname extends String { _brand: 'Surname'; }
+// Method 2: using "type"
+type Surname = string & { _brand: 'Surname' };
 const createSurname = (surname: string): Surname => {
   // validation of business rules
   return surname as any;
@@ -39,5 +37,5 @@ person.surname = createSurname('Mate'); // OK!
 
 // easy casting to supertype
 export let str: string;
-str = person.name.toString();
-str = person.surname;
+str = person.name.toString(); // Method 1 & Method 2
+str = person.surname; // Method 2 only