diff --git a/src/views/PostDetail.vue b/src/views/PostDetail.vue index c3de96a..2e71cc7 100644 --- a/src/views/PostDetail.vue +++ b/src/views/PostDetail.vue @@ -15,6 +15,7 @@ @comment-created="onCommentCreated(index, $event)" @post-deleted="onPostDeleted(index)" > + @@ -25,6 +26,7 @@ import { $, $ref } from "vue/macros" import { useRoute } from "vue-router" import { Post as PostObject, getPostContext } from "@/api/posts" +import Loader from "@/components/Loader.vue" import Post from "@/components/Post.vue" import SidebarLayout from "@/components/SidebarLayout.vue" import { useCurrentUser } from "@/store/user" @@ -36,11 +38,11 @@ let selectedId = $ref(route.params.postId as string) let highlightedId = $ref(null) let thread = $ref([]) let isLoading = $ref(true) -const loader = $ref(getPostContext(authToken, selectedId)) +const loaded = $ref(getPostContext(authToken, selectedId)) onMounted(async () => { try { - thread = await loader + thread = await loaded } catch (error: any) { if (error.message === "post not found") { // Show "not found" text @@ -118,4 +120,8 @@ function onPostDeleted(postIndex: number) { .post { margin: 0 0 $block-outer-padding; } + +.loader { + margin: $block-outer-padding auto; +} diff --git a/src/views/PublicTimeline.vue b/src/views/PublicTimeline.vue index d2a69ce..6571b64 100644 --- a/src/views/PublicTimeline.vue +++ b/src/views/PublicTimeline.vue @@ -2,6 +2,7 @@ @@ -11,16 +12,20 @@ import { onMounted } from "vue" import { $ref } from "vue/macros" import { Post, getPublicTimeline } from "@/api/posts" +import Loader from "@/components/Loader.vue" import PostList from "@/components/PostList.vue" import SidebarLayout from "@/components/SidebarLayout.vue" import { useCurrentUser } from "@/store/user" const { ensureAuthToken } = useCurrentUser() let posts = $ref([]) +let isLoading = $ref(false) onMounted(async () => { const authToken = ensureAuthToken() + isLoading = true posts = await getPublicTimeline(authToken) + isLoading = false }) async function loadNextPage(maxId: string) { @@ -29,3 +34,11 @@ async function loadNextPage(maxId: string) { posts.push(...nextPage) } + +