add: better quote post ui

This commit is contained in:
trisua 2025-05-21 00:04:18 -04:00
parent fb2a9285d2
commit 2b91422d18
8 changed files with 138 additions and 102 deletions

View file

@ -54,6 +54,23 @@
</button>
</div>
</div>
{%- endif %} {% if quoting -%}
<div
class="card secondary w-full flex items-center justify-between gap-2 small"
>
<a
class="flex items-center gap-2 flush"
href="/post/{{ quoting[1].id }}"
>
{{ icon "quote" }}
<span>{{ quoting[0].username }}'s post</span>
</a>
<a href="?" class="button quaternary small">
{{ icon "x" }}
<span>{{ text "dialog:action.cancel" }}</span>
</a>
</div>
{%- endif %}
<div class="card-nest">
@ -91,7 +108,7 @@
<form
class="card flex flex-col gap-2"
id="create_form"
onsubmit="create_post_from_form_town_square(event)"
onsubmit="create_post_from_form(event)"
>
<div class="flex flex-col gap-1">
<label for="content"
@ -115,7 +132,7 @@
{{ components::create_post_options() }}
<div class="flex gap-2">
{% if draft -%}
{% if not quoting -%} {% if draft -%}
<button
class="secondary small square"
title="Save as Draft"
@ -133,7 +150,7 @@
>
{{ icon "notepad-text-dashed" }}
</button>
{%- endif %}
{%- endif %} {%- endif %}
<button class="primary">
{{ text "communities:action.create" }}
@ -143,8 +160,9 @@
</form>
</div>
{% if not quoting -%}
<script>
async function create_post_from_form_town_square(e) {
async function create_post_from_form(e) {
e.preventDefault();
await trigger("atto::debounce", ["posts::create"]);
@ -289,6 +307,27 @@
});
}
</script>
{% else %}
<script>
async function create_post_from_form(e) {
const id = await trigger("me::repost", [
"{{ quoting[1].id }}",
e.target.content.value,
document.getElementById("community_to_post_to")
.selectedOptions[0].value,
false,
]);
// update settings
await update_settings_maybe(id);
// redirect
setTimeout(() => {
window.location.href = `/post/${id}`;
}, 100);
}
</script>
{%- endif %}
</div>
</div>

View file

@ -349,14 +349,15 @@ config.town_square or question %}
<span>{{ text "communities:label.repost" }}</span>
</button>
<button
onclick="window.REPOST_ID = '{{ post.id }}'; document.getElementById('quote_dialog').showModal()"
<a
class="button"
href="/communities/intents/post?quote={{ post.id }}"
>
{{ icon "quote" }}
<span
>{{ text "communities:label.quote_post" }}</span
>
</button>
</a>
{%- endif %} {% if user.id != post.owner -%}
<b class="title">{{ text "general:label.safety" }}</b>
<button
@ -640,48 +641,6 @@ user %} {% if user.settings.theme_hue -%}
--{{ css }}: {{ color|color }} !important;
}
</style>
{%- endif %} {%- endmacro %} {% macro quote_form() -%} {% if config.town_square
and user %}
<div class="card-nest">
<div class="card small flex flex-col">
<div class="flex items-center gap-2">
{{ icon "quote" }}
<span>{{ text "communities:label.quote_post" }}</span>
</div>
</div>
<form
class="card flex flex-col gap-2"
onsubmit="create_repost_from_form(event)"
>
<div class="flex flex-col gap-1">
<label for="content">{{ text "communities:label.content" }}</label>
<textarea
type="text"
name="content"
id="content"
placeholder="content"
required
minlength="2"
maxlength="4096"
></textarea>
</div>
<button class="primary">{{ text "communities:action.create" }}</button>
</form>
</div>
<script>
async function create_repost_from_form(e) {
e.preventDefault();
await trigger("atto::debounce", ["posts::create"]);
await trigger("me::repost", [
window.REPOST_ID,
e.target.content.value,
"{{ config.town_square }}",
]);
}
</script>
{%- endif %} {%- endmacro %} {% macro question(question, owner,
show_community=true, secondary=false) -%}
<div class="card{% if secondary -%} secondary{%- endif %} flex gap-2">
@ -1398,10 +1357,13 @@ is_supporter %}
</div>
</div>
{%- endif %} {%- endmacro %} {% macro create_post_options() -%}
<!-- prettier-ignore -->
<div class="flex gap-2">
{{ components::emoji_picker(element_id="content", render_dialog=true) }} {%
if is_supporter -%} {{ components::file_picker(files_list_id="files_list")
}} {%- endif %}
{{ components::emoji_picker(element_id="content", render_dialog=true) }}
{% if not quoting -%} {% if is_supporter -%}
{{ components::file_picker(files_list_id="files_list") }}
{%- endif %} {%- endif %}
<button
class="small square quaternary"

View file

@ -67,6 +67,12 @@
{{ icon "shield-user" }}
</span>
{%- endif %}
{% if profile.permissions|has_banned -%}
<span title="Banned" style="color: var(--color-primary);" class="flex items-center">
{{ icon "shield-ban" }}
</span>
{%- endif %}
</h3>
<span class="fade">{{ profile.username }}</span>

View file

@ -325,26 +325,6 @@ macros -%}
</form>
</div>
</dialog>
<dialog id="quote_dialog">
<div class="inner flex flex-col gap-2">
{{ components::quote_form() }}
<div class="flex justify-between">
<div></div>
<div class="flex gap-2">
<button
class="bold red quaternary"
onclick="document.getElementById('quote_dialog').close()"
type="button"
>
{{ icon "x" }} {{ text "dialog:action.close" }}
</button>
</div>
</div>
</div>
</dialog>
{%- endif %} {% if user and use_user_theme -%} {{
components::theme(user=user,
theme_preference=user.settings.theme_preference) }}