content Cards refactor
This commit is contained in:
@ -1,10 +1,10 @@
|
||||
import UnknownCard from './Cards/UnknownCard';
|
||||
import MediaCard from './Cards/MediaCard';
|
||||
import ImageCard from './Cards/ImageCard';
|
||||
import AlltypeCard from './Cards/AlltypeCard';
|
||||
|
||||
const Cards = {
|
||||
_unknown: UnknownCard,
|
||||
media: MediaCard,
|
||||
image: ImageCard,
|
||||
alltype: AlltypeCard
|
||||
};
|
||||
|
||||
|
22
src/components/Cards/ImageCard.js
Normal file
22
src/components/Cards/ImageCard.js
Normal file
@ -0,0 +1,22 @@
|
||||
import React, { PropTypes } from 'react';
|
||||
import { Card } from '../UI';
|
||||
|
||||
export default function ImageCard({ onClick, image, text }) {
|
||||
return (
|
||||
<Card onClick={onClick}>
|
||||
<img src={image} />
|
||||
<h1>{text}</h1>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
ImageCard.propTypes = {
|
||||
image: PropTypes.string.isRequired,
|
||||
|
||||
onClick: PropTypes.func,
|
||||
text: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
ImageCard.defaultProps = {
|
||||
onClick: function() {},
|
||||
};
|
@ -1,16 +0,0 @@
|
||||
import React, { PropTypes } from 'react';
|
||||
import { Card } from '../UI';
|
||||
|
||||
export default function MediaCard({ onClick, media, text }) {
|
||||
return (
|
||||
<Card onClick={onClick}>
|
||||
<img src={media} />
|
||||
<h1>{text}</h1>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
MediaCard.propTypes = {
|
||||
media: PropTypes.string.isRequired,
|
||||
text: PropTypes.string.isRequired
|
||||
};
|
@ -58,7 +58,7 @@ export default class EntryListing extends React.Component {
|
||||
collection: collection,
|
||||
onClick: browserHistory.push.bind(this, link),
|
||||
text: entry.getIn(['data', collection.getIn(['card', 'text'])]),
|
||||
media: entry.getIn(['data', collection.getIn(['card', 'media'])]),
|
||||
image: entry.getIn(['data', collection.getIn(['card', 'image'])]),
|
||||
});
|
||||
}
|
||||
|
||||
@ -67,7 +67,7 @@ export default class EntryListing extends React.Component {
|
||||
const name = collection.get('name');
|
||||
|
||||
return <div>
|
||||
<h2>Listing entries!</h2>
|
||||
<h2>Listing {name}</h2>
|
||||
<div ref={(c) => this._entries = c}>
|
||||
{entries.map((entry) => {
|
||||
const path = `/collections/${name}/entries/${entry.get('slug')}`;
|
||||
|
Reference in New Issue
Block a user