add: profiles ui, communities ui, posts ui

This commit is contained in:
trisua 2025-03-29 00:26:56 -04:00
parent 00abbc8fa2
commit eecf357325
36 changed files with 1460 additions and 147 deletions

View file

@ -0,0 +1,86 @@
{% import "macros.html" as macros %} {% import "components.html" as components
%} {% extends "root.html" %} {% block head %}
<title>Post - {{ config.name }}</title>
{% endblock %} {% block body %} {{ macros::nav() }}
<main class="flex flex-col gap-2">
{% if post.replying_to %}
<a href="/post/{{ post.replying_to }}" class="button">
{{ icon "arrow-up" }}
<span>{{ text "communities:action.continue_thread" }}</span>
</a>
{% endif %} {{ components::post(post=post, owner=owner, community=community,
show_community=true) }} {% if user %}
<div class="card-nest">
<div class="card small">
<b>{{ text "communities:label.create_reply" }}</b>
</div>
<form
class="card flex flex-col gap-2"
onsubmit="create_reply_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>
{% endif %}
<div class="card-nest w-full">
<div class="card small flex items-center gap-2">
{{ icon "newspaper" }}
<span>{{ text "communities:label.replies" }}</span>
</div>
<div class="card flex flex-col gap-4">
{% for post in replies %} {{ components::post(post=post[0],
owner=post[1], secondary=true, show_community=false) }} {% endfor %}
</div>
</div>
</main>
<script>
function create_reply_from_form(e) {
e.preventDefault();
fetch("/api/v1/posts", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
content: e.target.content.value,
community: "{{ community.id }}",
replying_to: "{{ post.id }}",
}),
})
.then((res) => res.json())
.then((res) => {
trigger("atto::toast", [
res.ok ? "success" : "error",
res.message,
]);
if (res.ok) {
setTimeout(() => {
window.location.href = `/post/${res.payload}`;
}, 100);
}
});
}
</script>
{% endblock %}