Add reply to and edited at headers

This commit is contained in:
Sol Fisher Romanoff 2022-10-25 16:27:59 +03:00 committed by Sam Therapy
parent 037baa6e58
commit 0faf544ebb
Signed by: sam
GPG Key ID: 4D8B07C18F31ACBD
3 changed files with 82 additions and 34 deletions

View File

@ -161,7 +161,10 @@ defp represent(%Activity{object: %Object{data: data}} = activity, selected) do
selected: selected,
counts: get_counts(activity),
id: activity.id,
visibility: Visibility.get_visibility(activity.object)
visibility: Visibility.get_visibility(activity.object),
reply_to: data["inReplyTo"],
reply_to_user: data["inReplyTo"] && CommonAPI.get_user(hd(data["to"])),
edited_at: data["updated"]
}
end

View File

@ -12,35 +12,57 @@
</div>
<div class="right-side">
<div class="status-heading">
<div class="heading-left">
<h4 class="username">
<%= raw Formatter.emojify(@user.name, @user.emoji) %>
</h4>
<a href="<%= (@user.uri || @user.ap_id) %>" class="account-name">
<%= @user.nickname %>
</a>
<div class="heading-name-row">
<div class="heading-left">
<h4 class="username">
<%= raw Formatter.emojify(@user.name, @user.emoji) %>
</h4>
<a href="<%= (@user.uri || @user.ap_id) %>" class="account-name">
<%= @user.nickname %>
</a>
</div>
<div class="heading-right">
<a class="timeago" href="<%= @link %>">
<time
class="dt-published" datetime="<%= @published %>"
title="<%= format_date(@published) %>"
>
<%= time_ago(@published) %>
</time>
</a>
<%= if @visibility == "public" do %>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M352 256c0 22.2-1.2 43.6-3.3 64H163.3c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64H348.7c2.2 20.4 3.3 41.8 3.3 64zm28.8-64H503.9c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64H380.8c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32H376.7c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0H167.7c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 21 58.2 27 94.7zm-209 0H18.6C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192H131.2c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64H8.1C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6H344.3c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352H135.3zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6H493.4z"/>
</svg>
<% else %>
<%= if @visibility == "unlisted" do %>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
<path d="M352 144c0-44.2 35.8-80 80-80s80 35.8 80 80v48c0 17.7 14.3 32 32 32s32-14.3 32-32V144C576 64.5 511.5 0 432 0S288 64.5 288 144v48H64c-35.3 0-64 28.7-64 64V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V256c0-35.3-28.7-64-64-64H352V144z"/>
</svg>
<% end %>
<% end %>
</div>
</div>
<div class="heading-right">
<a class="timeago" href="<%= @link %>">
<time
class="dt-published" datetime="<%= @published %>"
title="<%= format_date(@published) %>"
>
<%= time_ago(@published) %>
</time>
</a>
<%= if @visibility == "public" do %>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M352 256c0 22.2-1.2 43.6-3.3 64H163.3c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64H348.7c2.2 20.4 3.3 41.8 3.3 64zm28.8-64H503.9c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64H380.8c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32H376.7c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0H167.7c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 21 58.2 27 94.7zm-209 0H18.6C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192H131.2c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64H8.1C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6H344.3c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352H135.3zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6H493.4z"/>
</svg>
<% else %>
<%= if @visibility == "unlisted" do %>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
<path d="M352 144c0-44.2 35.8-80 80-80s80 35.8 80 80v48c0 17.7 14.3 32 32 32s32-14.3 32-32V144C576 64.5 511.5 0 432 0S288 64.5 288 144v48H64c-35.3 0-64 28.7-64 64V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V256c0-35.3-28.7-64-64-64H352V144z"/>
</svg>
<% end %>
<% end %>
<%= if @reply_to do %>
<div class="heading-reply-row">
<a class="reply-to-link" href="<%= @reply_to %>">
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M205 34.8c11.5 5.1 19 16.6 19 29.2v64H336c97.2 0 176 78.8 176 176c0 113.3-81.5 163.9-100.2 174.1c-2.5 1.4-5.3 1.9-8.1 1.9c-10.9 0-19.7-8.9-19.7-19.7c0-7.5 4.3-14.4 9.8-19.5c9.4-8.8 22.2-26.4 22.2-56.7c0-53-43-96-96-96H224v64c0 12.6-7.4 24.1-19 29.2s-25 3-34.4-5.4l-160-144C3.9 225.7 0 217.1 0 208s3.9-17.7 10.6-23.8l160-144c9.4-8.5 22.9-10.6 34.4-5.4z"/>
</svg>
Reply to
</a>
<span class="h-card">
<a href="<%= (@reply_to_user.uri || @reply_to_user.ap_id) %>" class="u-url mention">
@<%= @reply_to_user.nickname %>
</a>
</span>
</div>
<% end %>
<%= if @edited_at do %>
<div class="heading-edited-row">
Edited <%= time_ago(@edited_at) %>
</div>
<% end %>
</div>
<div class="status-content">
<%= if @title != "" do %>

View File

@ -157,12 +157,21 @@ .right-side {
}
.status-heading {
display: flex;
margin-bottom: 0.5em;
justify-content: space-between;
line-height: 1.3;
}
.heading-name-row {
display: flex;
justify-content: space-between;
}
.heading-edited-row,
.heading-reply-row {
font-size: 0.85em;
margin-top: 0.2em;
}
.status-heading a {
display: inline-block;
word-break: break-all;
@ -177,7 +186,7 @@ .heading-right {
align-items: center;
}
.status-container .account-name {
.heading-name-row .account-name {
min-width: 1.6em;
margin-right: 0.4em;
white-space: nowrap;
@ -186,7 +195,7 @@ .status-container .account-name {
flex: 1 1 0;
}
.status-container .username {
.heading-name-row .username {
white-space: nowrap;
overflow: hidden;
max-width: 85%;
@ -457,8 +466,7 @@ .attachment:not(:last-child) {
.fa-icon {
height: 0.875em;
margin-left: 0.5em;
margin-right: 0.3em;
margin: 0 0.3em;
fill: var(--icon);
}
@ -466,6 +474,14 @@ .status-actions .fa-icon {
height: 1.1em;
}
.user-summary .fa-icon {
margin-left: 0.5em;
}
.reply-to-link .fa-icon {
transform: scale(-1, 1);
}
.nsfw-banner {
position: absolute;
height: 100%;
@ -483,3 +499,10 @@ .nsfw-banner:not(:hover) {
.nsfw-banner:hover div {
display: none;
}
.reply-to-link {
color: var(--faint);
}
.reply-to-link:hover {
text-decoration: underline;
}