Add loader to home timeline

src/views/HomeTimeline.vue

@@ -3,6 +3,7 @@
     <template #content>
       <post-editor :in-reply-to="null" @post-created="insertPost"></post-editor>
       <post-list :posts="posts" @load-next-page="loadNextPage"></post-list>
+      <loader v-if="isLoading"></loader>
     </template>
   </sidebar-layout>
 </template>
@@ -12,6 +13,7 @@ import { onMounted } from "vue"
 import { $ref } from "vue/macros"
 
 import { Post, getHomeTimeline } from "@/api/posts"
+import Loader from "@/components/Loader.vue"
 import PostEditor from "@/components/PostEditor.vue"
 import PostList from "@/components/PostList.vue"
 import SidebarLayout from "@/components/SidebarLayout.vue"
@@ -20,10 +22,13 @@ import { useCurrentUser } from "@/store/user"
 const { ensureAuthToken } = useCurrentUser()
 
 let posts = $ref<Post[]>([])
+let isLoading = $ref(false)
 
 onMounted(async () => {
+  isLoading = true
   const authToken = ensureAuthToken()
   posts = await getHomeTimeline(authToken)
+  isLoading = false
 })
 
 function insertPost(post: Post) {
@@ -43,4 +48,8 @@ async function loadNextPage(maxId: string) {
 .post-form {
   margin-bottom: $block-outer-padding * 2;
 }
+
+.loader {
+  margin: $block-outer-padding auto;
+}
 </style>