ReactJS

1
import React from 'react';
2
import styles from './cardlist.css';
3
import {Card, ICardProps} from "./Card";
4
import {postsContext} from "../context/PostsContext";
5
import moment from "moment";
6

7
export function CardList() {
8
  const posts = React.useContext(postsContext);
9
  const shortPosts = posts.map(x => {
10
    let shortPostInfo: ICardProps = {
11
      id: x.id,
12
      post: {
13
        url: "#Post_URL",
14
        author: {
15
          name: x.author,
16
          avatarUrl: "https://www.redditinc.com/assets/images/site/reddit-logo.png",
17
          profileLink: "#USER_LINK"
18
        },
19
        crDate: moment(x.created).format("DD-mm-YYYY HH:mm"),
20
        title: x.title
21
      },
22
      previewImageUrl: !x.thumbnail.includes("http") ? "https://kluban.net/wp-content/uploads/2015/05/blank-thumbnail.jpg" : x.thumbnail
23
    };
24
    return shortPostInfo;
25
  })
26

27

28
  return (
29
    <ul className={styles.cardList}>
30
      {shortPosts.map(x => <Card id={x.id} key={x.id} post={x.post} previewImageUrl={x.previewImageUrl}/>)}
31
    </ul>
32
  );
33
}
34