{"size": 2598, "ext": "js", "max_stars_repo_path": "src/Components/wallpaper_item.js", "max_stars_repo_name": "VijayNandakumarkumar/RedditPostPicker---React-Redux", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/Components/wallpaper_item.js", "max_issues_repo_name": "VijayNandakumarkumar/RedditPostPicker---React-Redux", "max_issues_repo_issues_event_min_datetime": "2020-09-06T20:20:41.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-12T18:38:05.000Z", "max_forks_repo_path": "src/Components/wallpaper_item.js", "max_forks_repo_name": "VijayNandakumarkumar/RedditPostPicker---React-Redux", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 5, "max_forks_count": null, "avg_line_length": 34.1842105263, "max_line_length": 80, "alphanum_fraction": 0.4130100077}
import React from "react";

const WallpaperItem = ({ file }) => {
  if (file.data.preview) {
    if (file.data.preview.enabled) {
      let previewImage =
        file.data.preview.images[0].resolutions[
          file.data.preview.images[0].resolutions.length - 1
        ].url;
      previewImage = previewImage.replace(/&amp;/g, "&");
      let subreddit = "https://reddit.com/r/" + file.data.subreddit;
      let post_link = "https://reddit.com" + file.data.permalink;
      return (
        <div className="col-sm-12 col-md-6 col-lg-4">
          <div className=" card-link">
            <div className="card shadow">
              <div className="card-img-top">
                <a href={post_link} target="_blank" rel="noopener noreferrer">
                  <button className="btn btn-secondary btn-sm top-right-float">
                    View Post
                  </button>
                </a>
                <a
                  href={file.data.url}
                  target="_blank"
                  rel="noopener noreferrer"
                >
                  <div className="inner">
                    <img
                      src={previewImage}
                      className="card-img-top"
                      width="100%"
                      alt={file.data.title}
                    />
                  </div>
                </a>
              </div>
              <div className="card-body">
                <a className="activator mr-4">
                  <i className="fa fa-share-alt" style={{ float: "left" }} />
                </a>
                <div className="card-title">
                  <a
                    href={file.data.url}
                    target="_blank"
                    rel="noopener noreferrer"
                  >
                    {file.data.title}
                  </a>
                </div>
                <p className="card-text">
                  <i className="fa fa-arrow-up" aria-hidden="true" />{" "}
                  {file.data.ups}
                  <i
                    className="fa fa-comments"
                    aria-hidden="true"
                    style={{ marginLeft: "10px" }}
                  />{" "}
                  {file.data.num_comments}
                  <br /> Posted on:
                  <a href={subreddit} target="_blank" rel="noopener noreferrer">
                    r / {file.data.subreddit}
                  </a>
                </p>
              </div>
            </div>
          </div>
        </div>
      );
    }
  }
  return <div> </div>;
};

export default WallpaperItem;
