1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00

fixed comment attachments click

This commit is contained in:
Fedor Katurov 2022-12-14 09:39:12 +06:00
parent 6957813cd0
commit dd8b4e9dcf
2 changed files with 10 additions and 6 deletions

View file

@ -69,6 +69,12 @@ const CommentContent: FC<IProps> = memo(
onDelete(comment.id, !comment.deleted_at); onDelete(comment.id, !comment.deleted_at);
}, [comment, onDelete]); }, [comment, onDelete]);
const onImageClick = useCallback(
(file: IFile) =>
onShowImageModal(groupped.image, groupped.image.indexOf(file)),
[onShowImageModal, groupped],
);
const menu = useMemo( const menu = useMemo(
() => ( () => (
<div> <div>
@ -130,7 +136,7 @@ const CommentContent: FC<IProps> = memo(
<div className={classnames(styles.block, styles.block_image)}> <div className={classnames(styles.block, styles.block_image)}>
{menu} {menu}
<CommentImageGrid files={groupped.image} /> <CommentImageGrid files={groupped.image} onClick={onImageClick} />
<div className={styles.date}> <div className={styles.date}>
{getPrettyDate(comment.created_at)} {getPrettyDate(comment.created_at)}

View file

@ -11,12 +11,13 @@ import styles from './styles.module.scss';
interface CommentImageGridProps { interface CommentImageGridProps {
files: IFile[]; files: IFile[];
onClick: (file: IFile) => void;
} }
const singleSrcSet = '(max-width: 1024px) 40vw, 20vw'; const singleSrcSet = '(max-width: 1024px) 40vw, 20vw';
const multipleSrcSet = '(max-width: 1024px) 50vw, 20vw'; const multipleSrcSet = '(max-width: 1024px) 50vw, 20vw';
const CommentImageGrid: FC<CommentImageGridProps> = ({ files }) => { const CommentImageGrid: FC<CommentImageGridProps> = ({ files, onClick }) => {
return ( return (
<div <div
className={classNames(styles.images, { className={classNames(styles.images, {
@ -24,10 +25,7 @@ const CommentImageGrid: FC<CommentImageGridProps> = ({ files }) => {
})} })}
> >
{files.map((file, index) => ( {files.map((file, index) => (
<div <div key={file.id} onClick={() => onClick(file)}>
key={file.id}
// onClick={() => onShowImageModal(groupped.image, index)}
>
<img <img
srcSet={getFileSrcSet(file)} srcSet={getFileSrcSet(file)}
src={getURL(file, imagePresets['300'])} src={getURL(file, imagePresets['300'])}