import * as React from 'react'; import * as styles from './StickerPackPreview.scss'; import { useI18n } from '../util/i18n'; export type Props = { images: Array<string>; title: string; author: string; }; export const StickerPackPreview = React.memo( ({ images, title, author }: Props) => { const i18n = useI18n(); return ( <div className={styles.container}> <div className={styles.titleBar}> {i18n('StickerCreator--Preview--title')} </div> <div className={styles.scroller}> <div className={styles.grid}> {images.map((src, id) => ( <img key={id} className={styles.sticker} src={src} alt={src} /> ))} </div> </div> <div className={styles.meta}> <div className={styles.metaTitle}>{title}</div> <div className={styles.metaAuthor}>{author}</div> </div> </div> ); } );