chore: tweak default page size

web/src/components/CreateMemoRelationDialog.tsx

@@ -3,7 +3,7 @@ import React, { useState } from "react";
 import { toast } from "react-hot-toast";
 import useDebounce from "react-use/lib/useDebounce";
 import { memoServiceClient } from "@/grpcweb";
-import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
+import { DEFAULT_LIST_MEMOS_PAGE_SIZE } from "@/helpers/consts";
 import { getDateTimeString } from "@/helpers/datetime";
 import useCurrentUser from "@/hooks/useCurrentUser";
 import { Memo } from "@/types/proto/api/v2/memo_service";
@@ -35,7 +35,7 @@ const CreateMemoRelationDialog: React.FC<Props> = (props: Props) => {
           filters.push(`content_search == [${JSON.stringify(searchText)}]`);
         }
         const { memos } = await memoServiceClient.listMemos({
-          pageSize: DEFAULT_MEMO_LIMIT,
+          pageSize: DEFAULT_LIST_MEMOS_PAGE_SIZE,
           filter: filters.length > 0 ? filters.join(" && ") : undefined,
         });
         setFetchedMemos(memos);

web/src/helpers/consts.ts

@@ -1,16 +1,14 @@
-// UNKNOWN_ID is the symbol for unknown id
+// UNKNOWN_ID is the symbol for unknown id.
 export const UNKNOWN_ID = -1;
 
-// default animation duration
+// ANIMATION_DURATION is the duration of animation in milliseconds.
 export const ANIMATION_DURATION = 200;
 
-// millisecond in a day
+// DAILY_TIMESTAMP is the timestamp for a day.
 export const DAILY_TIMESTAMP = 3600 * 24 * 1000;
 
-// space width for tab action in editor
+// TAB_SPACE_WIDTH is the default tab space width.
 export const TAB_SPACE_WIDTH = 2;
 
-// default fetch memo amount
-export const DEFAULT_MEMO_LIMIT = 10;
-
-export const DEFAULT_LIST_MEMOS_PAGE_SIZE = 10;
+// DEFAULT_LIST_MEMOS_PAGE_SIZE is the default page size for list memos request.
+export const DEFAULT_LIST_MEMOS_PAGE_SIZE = 16;

web/src/pages/Archived.tsx

@@ -9,7 +9,7 @@ import MemoContent from "@/components/MemoContent";
 import MemoFilter from "@/components/MemoFilter";
 import MobileHeader from "@/components/MobileHeader";
 import SearchBar from "@/components/SearchBar";
-import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
+import { DEFAULT_LIST_MEMOS_PAGE_SIZE } from "@/helpers/consts";
 import { getTimeStampByDate } from "@/helpers/datetime";
 import { getDateTimeString } from "@/helpers/datetime";
 import useCurrentUser from "@/hooks/useCurrentUser";
@@ -51,7 +51,7 @@ const Archived = () => {
     }
     setIsRequesting(true);
     const data = await memoStore.fetchMemos({
-      pageSize: DEFAULT_MEMO_LIMIT,
+      pageSize: DEFAULT_LIST_MEMOS_PAGE_SIZE,
       filter: filters.join(" && "),
       pageToken: nextPageTokenRef.current,
     });

web/src/pages/Explore.tsx

@@ -5,7 +5,7 @@ import Icon from "@/components/Icon";
 import MemoFilter from "@/components/MemoFilter";
 import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
-import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
+import { DEFAULT_LIST_MEMOS_PAGE_SIZE } from "@/helpers/consts";
 import { getTimeStampByDate } from "@/helpers/datetime";
 import useCurrentUser from "@/hooks/useCurrentUser";
 import useFilterWithUrlParams from "@/hooks/useFilterWithUrlParams";
@@ -42,7 +42,7 @@ const Explore = () => {
     }
     setIsRequesting(true);
     const data = await memoStore.fetchMemos({
-      pageSize: DEFAULT_MEMO_LIMIT,
+      pageSize: DEFAULT_LIST_MEMOS_PAGE_SIZE,
       filter: filters.join(" && "),
       pageToken: nextPageTokenRef.current,
     });

web/src/pages/Home.tsx

@@ -9,7 +9,7 @@ import MemoEditor from "@/components/MemoEditor";
 import MemoFilter from "@/components/MemoFilter";
 import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
-import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
+import { DEFAULT_LIST_MEMOS_PAGE_SIZE } from "@/helpers/consts";
 import { getTimeStampByDate } from "@/helpers/datetime";
 import useCurrentUser from "@/hooks/useCurrentUser";
 import useFilterWithUrlParams from "@/hooks/useFilterWithUrlParams";
@@ -52,7 +52,7 @@ const Home = () => {
     }
     setIsRequesting(true);
     const data = await memoStore.fetchMemos({
-      pageSize: DEFAULT_MEMO_LIMIT,
+      pageSize: DEFAULT_LIST_MEMOS_PAGE_SIZE,
       filter: filters.join(" && "),
       pageToken: nextPageTokenRef.current,
     });

web/src/pages/Timeline.tsx

@@ -11,7 +11,7 @@ import MobileHeader from "@/components/MobileHeader";
 import TimelineSidebar from "@/components/TimelineSidebar";
 import TimelineSidebarDrawer from "@/components/TimelineSidebarDrawer";
 import { memoServiceClient } from "@/grpcweb";
-import { DAILY_TIMESTAMP, DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
+import { DAILY_TIMESTAMP, DEFAULT_LIST_MEMOS_PAGE_SIZE } from "@/helpers/consts";
 import { getNormalizedTimeString, getTimeStampByDate } from "@/helpers/datetime";
 import useCurrentUser from "@/hooks/useCurrentUser";
 import useFilterWithUrlParams from "@/hooks/useFilterWithUrlParams";
@@ -107,7 +107,7 @@ const Timeline = () => {
     }
     setIsRequesting(true);
     const data = await memoStore.fetchMemos({
-      pageSize: DEFAULT_MEMO_LIMIT,
+      pageSize: DEFAULT_LIST_MEMOS_PAGE_SIZE,
       filter: filters.join(" && "),
       pageToken: nextPageTokenRef.current,
     });

web/src/pages/UserProfile.tsx

@@ -8,7 +8,7 @@ import MemoFilter from "@/components/MemoFilter";
 import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
 import UserAvatar from "@/components/UserAvatar";
-import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
+import { DEFAULT_LIST_MEMOS_PAGE_SIZE } from "@/helpers/consts";
 import { getTimeStampByDate } from "@/helpers/datetime";
 import useFilterWithUrlParams from "@/hooks/useFilterWithUrlParams";
 import useLoading from "@/hooks/useLoading";
@@ -77,7 +77,7 @@ const UserProfile = () => {
     }
     setIsRequesting(true);
     const data = await memoStore.fetchMemos({
-      pageSize: DEFAULT_MEMO_LIMIT,
+      pageSize: DEFAULT_LIST_MEMOS_PAGE_SIZE,
       filter: filters.join(" && "),
       pageToken: nextPageTokenRef.current,
     });