diff --git a/web/src/components/MemoDisplaySettingMenu.tsx b/web/src/components/MemoDisplaySettingMenu.tsx index e906913fc..317afc4a9 100644 --- a/web/src/components/MemoDisplaySettingMenu.tsx +++ b/web/src/components/MemoDisplaySettingMenu.tsx @@ -1,5 +1,6 @@ import { Settings2Icon } from "lucide-react"; import { observer } from "mobx-react-lite"; +import { Checkbox } from "@/components/ui/checkbox"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { cn } from "@/lib/utils"; import { viewStore } from "@/store"; @@ -59,6 +60,18 @@ const MemoDisplaySettingMenu = observer(({ className }: Props) => { +
+ {t("common.show-comments")} + + viewStore.state.setPartial({ + showComments: Boolean(value), + }) + } + /> +
diff --git a/web/src/components/PagedMemoList/PagedMemoList.tsx b/web/src/components/PagedMemoList/PagedMemoList.tsx index c99023a66..17b7518ed 100644 --- a/web/src/components/PagedMemoList/PagedMemoList.tsx +++ b/web/src/components/PagedMemoList/PagedMemoList.tsx @@ -20,6 +20,7 @@ interface Props { listSort?: (list: Memo[]) => Memo[]; state?: State; orderBy?: string; + showComments?: boolean; filter?: string; pageSize?: number; } @@ -49,6 +50,7 @@ const PagedMemoList = observer((props: Props) => { const response = await memoStore.fetchMemos({ state: props.state || State.NORMAL, orderBy: props.orderBy || "display_time desc", + showComments: props.showComments, filter: props.filter, pageSize: props.pageSize || DEFAULT_LIST_MEMOS_PAGE_SIZE, pageToken, @@ -99,7 +101,7 @@ const PagedMemoList = observer((props: Props) => { // Initial load and reload when props change useEffect(() => { refreshList(); - }, [props.state, props.orderBy, props.filter, props.pageSize]); + }, [props.state, props.orderBy, props.filter, props.pageSize, props.showComments]); // Auto-fetch more content when list changes and page isn't full useEffect(() => { diff --git a/web/src/locales/en.json b/web/src/locales/en.json index d3833b9a6..dc1ed1c24 100644 --- a/web/src/locales/en.json +++ b/web/src/locales/en.json @@ -52,6 +52,7 @@ "language": "Language", "last-updated-at": "Last updated at", "layout": "Layout", + "show-comments": "Show comments", "learn-more": "Learn more", "link": "Link", "mark": "Mark", diff --git a/web/src/pages/Archived.tsx b/web/src/pages/Archived.tsx index 20c1d4ef0..43e7e1d74 100644 --- a/web/src/pages/Archived.tsx +++ b/web/src/pages/Archived.tsx @@ -39,6 +39,8 @@ const Archived = observer(() => { } state={State.ARCHIVED} orderBy={viewStore.state.orderByTimeAsc ? "display_time asc" : "display_time desc"} + // It does not support show comments now + // showComments={viewStore.state.showComments} filter={memoFitler} /> ); diff --git a/web/src/pages/Explore.tsx b/web/src/pages/Explore.tsx index f5cc4eeed..dddc690e4 100644 --- a/web/src/pages/Explore.tsx +++ b/web/src/pages/Explore.tsx @@ -27,6 +27,7 @@ const Explore = observer(() => { ) } orderBy={viewStore.state.orderByTimeAsc ? "display_time asc" : "display_time desc"} + showComments={viewStore.state.showComments} /> diff --git a/web/src/pages/Home.tsx b/web/src/pages/Home.tsx index 49d0b792f..6369f7838 100644 --- a/web/src/pages/Home.tsx +++ b/web/src/pages/Home.tsx @@ -67,6 +67,7 @@ const Home = observer(() => { ) } orderBy={viewStore.state.orderByTimeAsc ? "display_time asc" : "display_time desc"} + showComments={viewStore.state.showComments} filter={memoFilter} /> diff --git a/web/src/pages/UserProfile.tsx b/web/src/pages/UserProfile.tsx index 8e0528fe1..713edd455 100644 --- a/web/src/pages/UserProfile.tsx +++ b/web/src/pages/UserProfile.tsx @@ -102,6 +102,7 @@ const UserProfile = observer(() => { ) } orderBy={viewStore.state.orderByTimeAsc ? "display_time asc" : "display_time desc"} + showComments={viewStore.state.showComments} filter={memoFilter} /> diff --git a/web/src/store/view.ts b/web/src/store/view.ts index a8535ad1e..cb7a44cc0 100644 --- a/web/src/store/view.ts +++ b/web/src/store/view.ts @@ -5,6 +5,7 @@ const LOCAL_STORAGE_KEY = "memos-view-setting"; class LocalState { orderByTimeAsc: boolean = false; layout: "LIST" | "MASONRY" = "LIST"; + showComments: boolean = false; constructor() { makeAutoObservable(this); @@ -41,6 +42,9 @@ const viewStore = (() => { viewStore.state.setPartial({ layout: cache.layout }); } } + if (Object.hasOwn(cache, "showComments")) { + viewStore.state.setPartial({ showComments: Boolean(cache.showComments) }); + } } catch { // Do nothing } diff --git a/web/src/types/proto/api/v1/memo_service.ts b/web/src/types/proto/api/v1/memo_service.ts index 1f6406f81..848eb3f96 100644 --- a/web/src/types/proto/api/v1/memo_service.ts +++ b/web/src/types/proto/api/v1/memo_service.ts @@ -206,6 +206,8 @@ export interface ListMemosRequest { filter: string; /** Optional. If true, show deleted memos in the response. */ showDeleted: boolean; + /** Optional. If true, include comment memos in the response. */ + showComments: boolean; } export interface ListMemosResponse { @@ -1084,7 +1086,15 @@ export const CreateMemoRequest: MessageFns = { }; function createBaseListMemosRequest(): ListMemosRequest { - return { pageSize: 0, pageToken: "", state: State.STATE_UNSPECIFIED, orderBy: "", filter: "", showDeleted: false }; + return { + pageSize: 0, + pageToken: "", + state: State.STATE_UNSPECIFIED, + orderBy: "", + filter: "", + showDeleted: false, + showComments: false, + }; } export const ListMemosRequest: MessageFns = { @@ -1107,6 +1117,9 @@ export const ListMemosRequest: MessageFns = { if (message.showDeleted !== false) { writer.uint32(48).bool(message.showDeleted); } + if (message.showComments !== false) { + writer.uint32(56).bool(message.showComments); + } return writer; }, @@ -1165,6 +1178,14 @@ export const ListMemosRequest: MessageFns = { message.showDeleted = reader.bool(); continue; } + case 7: { + if (tag !== 56) { + break; + } + + message.showComments = reader.bool(); + continue; + } } if ((tag & 7) === 4 || tag === 0) { break; @@ -1185,6 +1206,7 @@ export const ListMemosRequest: MessageFns = { message.orderBy = object.orderBy ?? ""; message.filter = object.filter ?? ""; message.showDeleted = object.showDeleted ?? false; + message.showComments = object.showComments ?? false; return message; }, };