diff --git a/src/components/ImageGallery/ImageGallery.js b/src/components/ImageGallery/ImageGallery.js new file mode 100644 index 000000000..bbff79e37 --- /dev/null +++ b/src/components/ImageGallery/ImageGallery.js @@ -0,0 +1,72 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { css } from '@emotion/react'; + +// TODO: replace with import of image, rather than grabbing one off the web +const noImagePlaceholder = + 'https://socialistmodernism.com/wp-content/uploads/2017/07/placeholder-image.png'; + +const CreateImageBlock = (image) => { + return ( + + placeholder-text + + ); +}; + +/** + * @param {Object} props + * @param {String[]} props.images - Array of images urls. + * @param {String} props.className + */ +const ImageGallery = ({ images, className }) => { + return ( +
+ {images && images.length > 0 + ? images.map((image) => { + return CreateImageBlock(image); + }) + : CreateImageBlock(noImagePlaceholder)} +
+ ); +}; + +ImageGallery.propTypes = { + images: PropTypes.arrayOf(PropTypes.string), + className: PropTypes.string, +}; + +export default ImageGallery; diff --git a/src/components/ImageGallery/index.js b/src/components/ImageGallery/index.js new file mode 100644 index 000000000..db657797b --- /dev/null +++ b/src/components/ImageGallery/index.js @@ -0,0 +1 @@ +export { default } from './ImageGallery';