diff --git a/src/components/App/App.js b/src/components/App/App.js index 3b0ce6c..c00e92c 100644 --- a/src/components/App/App.js +++ b/src/components/App/App.js @@ -3,10 +3,12 @@ import { Provider } from 'react-redux' import store from '../../store' import Layout from '../Layout' +import StatusDisplay from '../StatusDisplay' const App = () => ( -

Under Construction

}> + +

This is where my board will go eventually

diff --git a/src/components/StatusDisplay/index.js b/src/components/StatusDisplay/index.js new file mode 100644 index 0000000..8c3d2a5 --- /dev/null +++ b/src/components/StatusDisplay/index.js @@ -0,0 +1,4 @@ +import { connect } from 'react-redux' +import StatusDisplay from './status-display' + +export default connect(({ status }) => ({ status }))(StatusDisplay) diff --git a/src/components/StatusDisplay/status-display.js b/src/components/StatusDisplay/status-display.js new file mode 100644 index 0000000..a90547c --- /dev/null +++ b/src/components/StatusDisplay/status-display.js @@ -0,0 +1,18 @@ +import React from 'react' +import PropTypes from 'prop-types' + +import { root } from './status-display.module.css' + +const StatusDisplay = ({ status }) => { + if (status) { + return
{status}
+ } + + return null +} + +StatusDisplay.propTypes = { + status: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]).isRequired +} + +export default StatusDisplay diff --git a/src/components/StatusDisplay/status-display.module.css b/src/components/StatusDisplay/status-display.module.css new file mode 100644 index 0000000..b0d3fda --- /dev/null +++ b/src/components/StatusDisplay/status-display.module.css @@ -0,0 +1,6 @@ +.root { + font-size: 1.2em; + line-height: 2em; + background-color: green; + text-align: center; +} \ No newline at end of file diff --git a/src/reducers/game-reducer.js b/src/reducers/game-reducer.js index 97096af..fb51015 100644 --- a/src/reducers/game-reducer.js +++ b/src/reducers/game-reducer.js @@ -1,7 +1,6 @@ const { GAME_WON } = require('../actions/types') export const defaultState = { - status: false, board: Array(7).fill(Array(6).fill(0)) } diff --git a/src/reducers/index.js b/src/reducers/index.js index 32007de..e92d3bf 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -1,7 +1,9 @@ import { combineReducers } from 'redux' import gameReducer from './game-reducer' +import statusReducer from './status-reducer' export default combineReducers({ + status: statusReducer, game: gameReducer }) diff --git a/src/reducers/status-reducer.js b/src/reducers/status-reducer.js new file mode 100644 index 0000000..bb1e3fe --- /dev/null +++ b/src/reducers/status-reducer.js @@ -0,0 +1,7 @@ +export default function statusReducer(state = false, action) { + switch (action.type) { + default: { + return state + } + } +}