posts: refactor post previews to use ViewComponent.

Refactor the post preview html to use the ViewComponent framework. This
lets us encapsulate all the HTML, CSS, and helper methods for a UI
component in a single place.

See https://viewcomponent.org.
This commit is contained in:
evazion
2021-01-12 02:04:38 -06:00
parent 097220fd88
commit 1b30b71a07
40 changed files with 449 additions and 364 deletions

View File

@@ -1,6 +1,10 @@
<div id="posts" class="user-disable-cropped-<%= CurrentUser.user.disable_cropped_thumbnails? %>">
<div id="posts-container">
<%= post_set.post_previews_html(self) %>
<% if post_set.shown_posts.empty? %>
<%= render "post_sets/blank" %>
<% else %>
<%= post_previews_html(post_set.posts, show_deleted: post_set.show_deleted?, show_cropped: true, tags: post_set.tag_string) %>
<% end %>
</div>
<% if post_set.hidden_posts.present? %>

View File

@@ -1,47 +0,0 @@
<%= content_tag(:article, article_attrs) do -%>
<%= link_to polymorphic_path(link_target, link_params) do -%>
<%= content_tag(:picture) do -%>
<%= tag.source media: "(max-width: 660px)", srcset: cropped_url -%>
<%= tag.source media: "(min-width: 660px)", srcset: preview_url -%>
<%= tag.img class: "has-cropped-#{has_cropped}", src: preview_url, style: "min-width: #{preview_width}px; min-height: #{preview_height}px;", title: tooltip, alt: alt_text -%>
<% end -%>
<% end -%>
<% if pool -%>
<p class="desc">
<%= link_to pool.pretty_name.truncate(80), pool %>
</p>
<% end -%>
<% if similarity -%>
<p class="desc">
<% if post.source =~ %r!\Ahttps?://!i %>
<%= external_link_to post.normalized_source, post.source_domain %>
(<%= time_ago_in_words_tagged(post.created_at, compact: true) %>)
<% else %>
<%= time_ago_in_words_tagged(post.created_at, compact: true) %>
<% end %>
</p>
<% end %>
<% if size -%>
<p class="desc">
<%= link_to number_to_human_size(size), post.file_url %>
(<%= width %>x<%= height %>)
</p>
<% end -%>
<% if similarity -%>
<p class="desc">
<%= link_to "#{similarity}%", iqdb_queries_path(post_id: post.id) %> similarity
</p>
<% end -%>
<% if recommended -%>
<p class="desc recommended">
<%= link_to recommended_posts_path(search: { post_id: post.id }), class: "more-recommended-posts", "data-post-id": post.id do %>
<%= post.fav_count %>
<i class="far fa-heart fa-xs"></i>
<br>more »
<% end %>
</p>
<% end -%>
<% end -%>

View File

@@ -39,7 +39,7 @@
<div class="post-tooltip-body <%= "has-preview" if params[:preview].truthy? %>">
<div class="post-tooltip-body-left">
<% if params[:preview].truthy? %>
<%= PostPresenter.preview(@post, show_deleted: true, compact: true) %>
<%= post_preview(@post, show_deleted: true, compact: true) %>
<% end %>
</div>

View File

@@ -44,7 +44,7 @@
<%= render "posts/partials/show/notices", :post => @post %>
<%= content_tag(:section, class: "image-container note-container", **PostPresenter.data_attributes(@post)) do -%>
<%= content_tag(:section, class: "image-container note-container", **PostPreviewComponent.new(post: @post).data_attributes) do -%>
<%= render "posts/partials/show/embedded", post: @post %>
<div id="note-preview"></div>
<% end -%>

View File

@@ -1,6 +1,6 @@
<% if @post.valid? %>
var $post = $("#post_<%= @post.id %>");
var $new_post = $("<%= j PostPresenter.preview(@post, show_deleted: true) %>");
var $new_post = $("<%= j post_preview(@post, show_deleted: true) %>");
Danbooru.Blacklist.apply_post($new_post.get(0));
$("#post_<%= @post.id %>").replaceWith($new_post);
<% if params[:mode] == "quick-edit" %>