Trying to get redux to work with existing code.

src/App.test.js

@@ -1,8 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import App from './App';
-
-it('renders without crashing', () => {
-  const div = document.createElement('div');
-  ReactDOM.render(<App />, div);
-});

src/Main.js

@@ -43,7 +43,7 @@ import PhoneList from './lists/components/PhoneList'
 const FILTER_OFF = 'Alle'
 
 /** Main application */
-class App extends React.Component {
+class Main extends React.Component {
   /**
    * Constructor
    * Defines the state and binds all 'this' in all functions to the object.
@@ -51,17 +51,6 @@ class App extends React.Component {
   constructor () {
     super()
 
-    // Define the state
-    this.state = {
-      player: Player.state,
-      match: Match.state,
-      worksheets: {
-        'PlayerList': null,
-        'Calendar': null
-      },
-      activeTab: 1
-    }
-
     // Bind 'this' to functions
     this.handlePlayerList = this.handlePlayerList.bind(this)
     this.handleCalendar = this.handleCalendar.bind(this)
@@ -370,10 +359,10 @@ class App extends React.Component {
   }
 
   render () {
-    const places = this.state.match.places
-    const dates = this.state.match.dates
-    const matchCategories = this.state.match.categories
-    const playerCategories = this.state.player.categories
+    const places = this.props.matchList.places || []
+    const dates = this.props.matchList.dates || {}
+    const matchCategories = this.props.matchList.categories || []
+    const playerCategories = this.props.playerList.categories || []
 
     return (
       <div className='container'>
@@ -414,17 +403,17 @@ class App extends React.Component {
               <option key={key}>{category}</option>
             ))}
           </select>
-          <button onClick={this.generateSchedule} disabled={!this.state.match.filtered.length}>Spielliste generieren</button>
-          <button onClick={this.generatePayTable} disabled={(!this.state.match.filtered.length | !this.state.player.filtered.length)}>Zahlliste generieren</button>
-          <button onClick={this.generatePhoneList} disabled={!this.state.player.players.length}>Telefonliste generieren</button>
+          <button onClick={this.generateSchedule} disabled={!this.props.matchList.filteredMatches.length}>Spielliste generieren</button>
+          <button onClick={this.generatePayTable} disabled={(!this.props.matchList.filteredMatches.length | !this.props.playerList.filteredPlayers.length)}>Zahlliste generieren</button>
+          <button onClick={this.generatePhoneList} disabled={!this.props.playerList.allPlayers.length}>Telefonliste generieren</button>
         </form>
-        <MatchList match={this.state.match} />
-        <PhoneList filtered={this.state.match.filtered} players={this.state.player.players} />
-        <EmailList filtered={this.state.match.filtered} players={this.state.player.players} />
-        <PlayerList player={this.state.player} />
+        <MatchList match={this.props.matchList} />
+        <PhoneList filtered={this.props.matchList.filteredMatches} players={this.props.playerList.allPlayers} />
+        <EmailList filtered={this.props.matchList.filteredMatches} players={this.props.playerList.allPlayers} />
+        <PlayerList player={this.props.playerList} />
       </div>
     )
   }
 }
 
-export default App
+export default Main

src/Main.test.js

@@ -0,0 +1,8 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import App from './Main'
+
+it('renders without crashing', () => {
+  const div = document.createElement('div')
+  ReactDOM.render(<App />, div)
+})