Skip to content

Commit ec34051

Browse files
committed
Challenge and Code: Card Component
1 parent 33a8f5f commit ec34051

File tree

2 files changed

+22
-0
lines changed

2 files changed

+22
-0
lines changed

evens-or-odds/src/components/App.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { fetchNewDeck } from '../actions/deck';
55
import fetchStates from '../reducers/fetchStates';
66
import Instructions from './Instructions';
77
import DrawCard from './DrawCard';
8+
import Card from './Card';
89

910
class App extends Component {
1011
startGame = () => {
@@ -34,6 +35,8 @@ class App extends Component {
3435
<br />
3536
<DrawCard />
3637
<hr />
38+
<Card />
39+
<hr />
3740
<button onClick={this.props.cancelGame}>Cancel Game</button>
3841
</div>
3942
) : (

evens-or-odds/src/components/Card.js

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from 'react';
2+
import { connect } from 'react-redux';
3+
4+
const Card = ({ cards }) => {
5+
if (!cards[0]) return null;
6+
7+
const { value, suit, image } = cards[0];
8+
9+
return (
10+
<div>
11+
<h3>{value} of {suit}</h3>
12+
<img src={image} alt='card-image' />
13+
</div>
14+
);
15+
}
16+
17+
export default connect(
18+
({ deck: { cards }}) => ({ cards })
19+
)(Card);

0 commit comments

Comments
 (0)