From bde201f77ab2dbdd3209268c4b43a6c98d293c8a Mon Sep 17 00:00:00 2001
From: David Katz <15Dkatz@shcp.edu>
Date: Sun, 23 Oct 2022 14:13:52 -0700
Subject: [PATCH] CORS and Same Origin Policy

---
 evens-or-odds/src/actions/deck.js   |  7 +++++++
 evens-or-odds/src/actions/types.js  |  1 +
 evens-or-odds/src/components/App.js | 12 +++++++++++-
 evens-or-odds/src/reducers/index.js | 10 +++++++++-
 4 files changed, 28 insertions(+), 2 deletions(-)
 create mode 100644 evens-or-odds/src/actions/deck.js

diff --git a/evens-or-odds/src/actions/deck.js b/evens-or-odds/src/actions/deck.js
new file mode 100644
index 0000000..514338e
--- /dev/null
+++ b/evens-or-odds/src/actions/deck.js
@@ -0,0 +1,7 @@
+import { FETCH_DECK_RESULT } from './types';
+
+export const fetchDeckResult = deckJson => {
+  const { remaining, deck_id } = deckJson;
+
+  return { type: FETCH_DECK_RESULT, remaining, deck_id };
+}
\ No newline at end of file
diff --git a/evens-or-odds/src/actions/types.js b/evens-or-odds/src/actions/types.js
index 22bcca9..c943718 100644
--- a/evens-or-odds/src/actions/types.js
+++ b/evens-or-odds/src/actions/types.js
@@ -1,2 +1,3 @@
 export const SET_GAME_STARTED = 'SET_GAME_STARTED';
 export const SET_INSTRUCTIONS_EXPANDED = 'SET_INSTRUCTIONS_EXPANDED';
+export const FETCH_DECK_RESULT = 'FETCH_DECK_RESULT';
diff --git a/evens-or-odds/src/components/App.js b/evens-or-odds/src/components/App.js
index fe27e6d..6349805 100644
--- a/evens-or-odds/src/components/App.js
+++ b/evens-or-odds/src/components/App.js
@@ -1,9 +1,18 @@
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { startGame, cancelGame } from '../actions/settings';
+import { fetchDeckResult } from '../actions/deck';
 import Instructions from './Instructions';
 
 class App extends Component {
+  startGame = () => {
+    this.props.startGame();
+
+    fetch('https://deck-of-cards-api-wrapper.appspot.com/deck/new/shuffle')
+      .then(response => response.json())
+      .then(json => this.props.fetchDeckResult(json));
+  }
+
   render() {
     console.log('this', this);
 
@@ -21,7 +30,7 @@ class App extends Component {
             <div>
               <h3>A new game awaits</h3>
               <br />
-              <button onClick={this.props.startGame}>Start Game</button>
+              <button onClick={this.startGame}>Start Game</button>
               <hr />
               <Instructions />
             </div>
@@ -42,6 +51,7 @@ const mapDispatchToProps = dispatch => {
   return {
     startGame: () => dispatch(startGame()),
     cancelGame: () => dispatch(cancelGame()),
+    fetchDeckResult: deckJson => dispatch(fetchDeckResult(deckJson))
   };
 }
 
diff --git a/evens-or-odds/src/reducers/index.js b/evens-or-odds/src/reducers/index.js
index f537aab..61e201a 100644
--- a/evens-or-odds/src/reducers/index.js
+++ b/evens-or-odds/src/reducers/index.js
@@ -1,4 +1,8 @@
-import { SET_GAME_STARTED, SET_INSTRUCTIONS_EXPANDED } from '../actions/types';
+import {
+  SET_GAME_STARTED,
+  SET_INSTRUCTIONS_EXPANDED,
+  FETCH_DECK_RESULT
+} from '../actions/types';
 
 const DEFAULT_SETTINGS = {
   gameStarted: false,
@@ -19,6 +23,10 @@ const rootReducer = (state = DEFAULT_SETTINGS, action) => {
         ...state,
         instructionsExpanded: action.instructionsExpanded
       };
+    case FETCH_DECK_RESULT:
+      const { remaining, deck_id } = action;
+
+      return { ...state, remaining, deck_id };
     default:
       return state;
   }