<template>
  <div
    class="card-block contain group cursor-pointer relative overflow-hidden"
  >
    <feed-header-misc
      :count="entity.collection_medias.length"
      type="videos"
    />
    <feed-footer-misc
      :is_like="entity.liked"
      :likes="entity.likes"
      :comments="entity.comments"
      @like-feed="likeFeed"
    />

    <div class="relative overflow-hidden">
        <feed-preview class="w-full h-36 md:h-72 object-cover" :source='entity.preview' />
    </div>
  </div>
</template>


<script>
import FeedFooterMisc from "@/Shared/Feed/FooterMisc";
import FeedHeaderMisc from "@/Shared/Feed/HeaderMisc";
import FeedPreview from "@/Shared/Feed/FeedPreview";
export default {
  components: { FeedFooterMisc, FeedHeaderMisc, FeedPreview },
  emits: ["likeFeed"],
  props: {
    entity: Object,
    user: Object,
    feed_id: Number,
  },
  methods: {
    likeFeed() {
      this.$emit("likeFeed");
    },
  },
};
</script>
