feat(view): Implement pagination in FakeIDEAdapter for infinite scroll

- Add pagination logic to FakeIDEAdapter to simulate real data fetching for infinite scrolling.

- Implement page tracking using currentPage and PAGE_SIZE to slice and return partial data.

- Ensure FakeIDEAdapter is a singleton to maintain pagination state across requests.

- Update message handling to support 'load more' functionality based on lastCommitId.

Related to #1007

Author: 박재현(Singco)

packages/view/src/ide/FakeIDEAdapter.ts

@@ -10,6 +10,14 @@ import type IDEPort from "./IDEPort";
 
 @injectable()
 export default class FakeIDEAdapter implements IDEPort {
+  private currentPage = 0;
+
+  private readonly PAGE_SIZE = 20;
+
+  private readonly TOTAL_PAGES = 5;
+
+  private lastProcessedCommitId: string | undefined = undefined;
+
   public addIDESentEventListener(events: IDESentEvents) {
     const onReceiveMessage = (e: IDEMessageEvent): void => {
       const responseMessage = e.data;
@@ -80,21 +88,55 @@ export default class FakeIDEAdapter implements IDEPort {
   }
 
   private convertMessage(message: IDEMessage) {
-    const { command } = message;
+    const { command, payload } = message;
 
     switch (command) {
       case "fetchAnalyzedData":
-      case "refresh":
+      case "refresh": {
+        // Parse request params to check if this is a load more request
+        const requestParams = payload ? JSON.parse(payload) : undefined;
+        const currentCommitId = requestParams?.lastCommitId;
+
+        // Reset page on refresh command
+        if (command === "refresh") {
+          this.currentPage = 0;
+          this.lastProcessedCommitId = undefined;
+        }
+        // Reset page on first load (no lastCommitId)
+        else if (!currentCommitId) {
+          this.currentPage = 0;
+          this.lastProcessedCommitId = undefined;
+        }
+        // Increment page only when we get a NEW lastCommitId (load more)
+        else if (currentCommitId !== this.lastProcessedCommitId) {
+          this.currentPage += 1;
+          this.lastProcessedCommitId = currentCommitId;
+        }
+
+        // Calculate pagination
+        const startIdx = this.currentPage * this.PAGE_SIZE;
+        const endIdx = Math.min(startIdx + this.PAGE_SIZE, fakeData.length);
+        const pageData = fakeData.slice(startIdx, endIdx);
+        const isLastPage = this.currentPage >= this.TOTAL_PAGES - 1;
+
+        // Get the last commit ID from the current page for nextCommitId
+        const lastCommitInPage =
+          pageData.length > 0 ? pageData[pageData.length - 1].commitNodeList[0]?.commit : undefined;
+        const nextCommitId = !isLastPage && lastCommitInPage ? lastCommitInPage.id : undefined;
+
+        const isLoadMore = currentCommitId !== undefined;
+
         return {
           command,
           payload: JSON.stringify({
-            clusterNodes: fakeData,
-            isLastPage: true,
-            nextCommitId: undefined,
-            isLoadMore: false,
+            clusterNodes: pageData,
+            isLastPage,
+            nextCommitId,
+            isLoadMore,
             isPRSuccess: true,
           }),
         };
+      }
       case "fetchBranchList":
         return {
           command,

packages/view/src/index.tsx

@@ -7,6 +7,6 @@ import { DI_IDENTIFIERS } from "container/identifiers";
 
 import { initRender } from "./index.common";
 
-diContainer.bind<IDEPort>(DI_IDENTIFIERS.IDEAdapter).to(FakeIDEAdapter);
+diContainer.bind<IDEPort>(DI_IDENTIFIERS.IDEAdapter).to(FakeIDEAdapter).inSingletonScope();
 
 initRender();