From 41ac0599364c1b23034b995643a2ef320a613472 Mon Sep 17 00:00:00 2001
From: silverpill <silverpill@firemail.cc>
Date: Sun, 12 Dec 2021 17:35:32 +0000
Subject: [PATCH] Set page size when making timeline requests

---
 src/api/common.ts      | 14 ++++++++++++--
 src/api/posts.ts       |  7 ++-----
 src/views/PostList.vue |  3 +--
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/api/common.ts b/src/api/common.ts
index 034626f..35471fe 100644
--- a/src/api/common.ts
+++ b/src/api/common.ts
@@ -1,5 +1,7 @@
 import { ENV } from "@/constants"
 
+export const PAGE_SIZE = 20
+
 // Wrapped in object for easy stubbing in tests
 export const fetcher = {
   async fetch(url: string, params: RequestInit): Promise<Response> {
@@ -10,7 +12,7 @@ export const fetcher = {
 interface RequestInfo extends RequestInit {
   authToken?: string | null;
   json?: any;
-  queryParams?: { [name: string]: string };
+  queryParams?: { [name: string]: string | number | undefined };
 }
 
 export async function http(
@@ -48,7 +50,15 @@ export async function http(
         // Convert URL string to URL object
         url = new URL(url, window.location.origin)
       }
-      url.search = new URLSearchParams(queryParams).toString()
+      // Serialize query params
+      const serialized = Object.keys(queryParams).reduce((res: { [name: string]: string }, key) => {
+        const value = queryParams[key]
+        if (value !== undefined) {
+          res[key] = value.toString()
+        }
+        return res
+      }, {})
+      url.search = new URLSearchParams(serialized).toString()
     }
     params = { ...defaults, ...requestParams }
   }
diff --git a/src/api/posts.ts b/src/api/posts.ts
index 87df18d..eb39626 100644
--- a/src/api/posts.ts
+++ b/src/api/posts.ts
@@ -1,5 +1,5 @@
 import { BACKEND_URL } from "@/constants"
-import { http } from "./common"
+import { PAGE_SIZE, http } from "./common"
 import { Profile } from "./users"
 
 export interface Attachment {
@@ -49,10 +49,7 @@ export async function getHomeTimeline(
   maxId?: string,
 ): Promise<Post[]> {
   const url = `${BACKEND_URL}/api/v1/timelines/home`
-  let queryParams
-  if (maxId) {
-    queryParams = { max_id: maxId }
-  }
+  const queryParams = { max_id: maxId, limit: PAGE_SIZE }
   const response = await http(url, {
     method: "GET",
     queryParams,
diff --git a/src/views/PostList.vue b/src/views/PostList.vue
index 15a8276..3507165 100644
--- a/src/views/PostList.vue
+++ b/src/views/PostList.vue
@@ -23,6 +23,7 @@
 <script lang="ts">
 import { Options, Vue, setup } from "vue-class-component"
 
+import { PAGE_SIZE } from "@/api/common"
 import { Post, getHomeTimeline } from "@/api/posts"
 import Avatar from "@/components/Avatar.vue"
 import PostOrRepost from "@/components/PostOrRepost.vue"
@@ -30,8 +31,6 @@ import PostEditor from "@/components/PostEditor.vue"
 import Sidebar from "@/components/Sidebar.vue"
 import { useCurrentUser } from "@/store/user"
 
-const PAGE_SIZE = 20
-
 @Options({
   components: {
     Avatar,