diff --git a/frontend/src/models/misc.ts b/frontend/src/models/misc.ts
index 9affd0ab..5478722c 100644
--- a/frontend/src/models/misc.ts
+++ b/frontend/src/models/misc.ts
@@ -14,6 +14,12 @@ export type Doc = {
   syncFrequency?: string;
 };
 
+export type GetDocsResponse = {
+  docs: Doc[];
+  totalDocuments: number;
+  totalPages: number;
+};
+
 export type PromptProps = {
   prompts: { name: string; id: string; type: string }[];
   selectedPrompt: { name: string; id: string; type: string };
diff --git a/frontend/src/preferences/preferenceApi.ts b/frontend/src/preferences/preferenceApi.ts
index 226af119..e77c9e3b 100644
--- a/frontend/src/preferences/preferenceApi.ts
+++ b/frontend/src/preferences/preferenceApi.ts
@@ -1,14 +1,23 @@
 import conversationService from '../api/services/conversationService';
 import userService from '../api/services/userService';
-import { Doc } from '../models/misc';
+import { Doc, GetDocsResponse } from '../models/misc';
 
 //Fetches all JSON objects from the source. We only use the objects with the "model" property in SelectDocsModal.tsx. Hopefully can clean up the source file later.
+export async function getDocs(
+  sort?: string,
+  order?: string,
+  pageNumber?: number,
+  rowsPerPage?: number,
+  withPagination?: true,
+): Promise<GetDocsResponse | null>;
+
 export async function getDocs(
   sort = 'date',
   order = 'desc',
   pageNumber = 1,
   rowsPerPage = 5,
-): Promise<Doc[] | null> {
+  withPagination = false,
+): Promise<Doc[] | GetDocsResponse | null> {
   try {
     const response = await userService.getDocs(
       sort,
@@ -17,14 +26,27 @@ export async function getDocs(
       rowsPerPage,
     );
     const data = await response.json();
+    console.log(data);
+    if (withPagination) {
+      const docs: Doc[] = [];
+      Array.isArray(data.paginated_docs) &&
+        data.paginated_docs.forEach((doc: object) => {
+          docs.push(doc as Doc);
+        });
 
-    const docs: Doc[] = [];
-
-    data.forEach((doc: object) => {
-      docs.push(doc as Doc);
-    });
-
-    return docs;
+      const totalDocuments = data.totalDocuments || 0;
+      const totalPages = data.totalPages || 0;
+      console.log(`totalDocuments: ${totalDocuments}`);
+      console.log(`totalPages: ${totalPages}`);
+      return { docs, totalDocuments, totalPages };
+    } else {
+      const docs: Doc[] = [];
+      Array.isArray(data.documents) &&
+        data.documents.forEach((doc: object) => {
+          docs.push(doc as Doc);
+        });
+      return docs;
+    }
   } catch (error) {
     console.log(error);
     return null;