diff --git a/packages/frontend/core/src/components/comment/sidebar/style.css.ts b/packages/frontend/core/src/components/comment/sidebar/style.css.ts
index 58d205454..564f5f20e 100644
--- a/packages/frontend/core/src/components/comment/sidebar/style.css.ts
+++ b/packages/frontend/core/src/components/comment/sidebar/style.css.ts
@@ -172,6 +172,7 @@ export const commentInputContainer = style({
   justifyContent: 'flex-start',
   gap: '4px',
   paddingLeft: '8px',
+  maxWidth: '800px',
 });
 
 export const userName = style({
diff --git a/packages/frontend/core/src/modules/comment/entities/doc-comment-store.ts b/packages/frontend/core/src/modules/comment/entities/doc-comment-store.ts
index 2e020870e..29bd24735 100644
--- a/packages/frontend/core/src/modules/comment/entities/doc-comment-store.ts
+++ b/packages/frontend/core/src/modules/comment/entities/doc-comment-store.ts
@@ -149,15 +149,25 @@ export class DocCommentStore extends Entity<{
 
     const commentChanges = response.workspace?.commentChanges;
     if (!commentChanges) {
-      return [];
+      return {
+        changes: [],
+        startCursor: '',
+        endCursor: after ?? '',
+        hasNextPage: false,
+      };
     }
 
-    return commentChanges.edges.map(edge => ({
-      id: edge.node.id,
-      action: edge.node.action,
-      comment: normalizeComment(edge.node.item),
-      commentId: edge.node.commentId || undefined,
-    }));
+    return {
+      changes: commentChanges.edges.map(edge => ({
+        id: edge.node.id,
+        action: edge.node.action,
+        comment: normalizeComment(edge.node.item),
+        commentId: edge.node.commentId || undefined,
+      })),
+      startCursor: commentChanges.pageInfo.startCursor || '',
+      endCursor: commentChanges.pageInfo.endCursor || '',
+      hasNextPage: commentChanges.pageInfo.hasNextPage,
+    };
   }
 
   async createComment(commentInput: {
diff --git a/packages/frontend/core/src/modules/comment/entities/doc-comment.ts b/packages/frontend/core/src/modules/comment/entities/doc-comment.ts
index c60440696..73d084f4c 100644
--- a/packages/frontend/core/src/modules/comment/entities/doc-comment.ts
+++ b/packages/frontend/core/src/modules/comment/entities/doc-comment.ts
@@ -359,13 +359,15 @@ export class DocCommentEntity extends Entity<{
         // If we have comments, fetch changes; otherwise fetch all
         if (this.comments$.value.length > 0) {
           return fromPromise(async () => {
-            return await this.store.listCommentChanges({
+            const res = await this.store.listCommentChanges({
               after: this.startCursor,
             });
+            return res;
           }).pipe(
-            tap(changes => {
-              if (changes) {
-                this.handleCommentChanges(changes);
+            tap(result => {
+              if (result) {
+                this.handleCommentChanges(result);
+                this.startCursor = result.endCursor;
               }
             }),
             catchError(error => {
@@ -418,7 +420,8 @@ export class DocCommentEntity extends Entity<{
     }
   }
 
-  private handleCommentChanges(changes: DocCommentChangeListResult): void {
+  private handleCommentChanges(result: DocCommentChangeListResult): void {
+    const { changes } = result;
     if (!changes || changes.length === 0) {
       return;
     }
diff --git a/packages/frontend/core/src/modules/comment/types.ts b/packages/frontend/core/src/modules/comment/types.ts
index c53a88b04..7d6b407a0 100644
--- a/packages/frontend/core/src/modules/comment/types.ts
+++ b/packages/frontend/core/src/modules/comment/types.ts
@@ -51,4 +51,9 @@ export interface DocCommentChange {
   commentId?: CommentId; // a change with comment id is a reply
 }
 
-export type DocCommentChangeListResult = DocCommentChange[];
+export type DocCommentChangeListResult = {
+  changes: DocCommentChange[];
+  startCursor: string;
+  endCursor: string;
+  hasNextPage: boolean;
+};