diff --git a/frontend/src/components/Modals/MangeWorkspace/Settings/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Settings/index.jsx
index 1e61df4282112c3c6f01ba3575e065e8b50297ff..e12e88d12fe77465aca7aa5a9a89abcb122c1489 100644
--- a/frontend/src/components/Modals/MangeWorkspace/Settings/index.jsx
+++ b/frontend/src/components/Modals/MangeWorkspace/Settings/index.jsx
@@ -31,7 +31,6 @@ export default function WorkspaceSettings({ workspace }) {
   const [totalVectors, setTotalVectors] = useState(null);
   const [canDelete, setCanDelete] = useState(false);
 
-
   useEffect(() => {
     async function fetchKeys() {
       const canDelete = await System.getCanDeleteWorkspaces();
diff --git a/frontend/src/index.css b/frontend/src/index.css
index b0b8d613ad5b3998c97d21546f6538ad6af31f19..2553629d30498482150cd178a5773ac9f7539c13 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -355,6 +355,6 @@ dialog::backdrop {
   top: 100%;
 }
 
-.user-reply>div:first-of-type {
+.user-reply > div:first-of-type {
   border: 2px solid white;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/pages/Admin/Chats/index.jsx b/frontend/src/pages/Admin/Chats/index.jsx
index ffd2ed1b3aa94f3e088bb2a2ca55f656b23c14e0..673e391084febbdee7924412661410547c3c1c92 100644
--- a/frontend/src/pages/Admin/Chats/index.jsx
+++ b/frontend/src/pages/Admin/Chats/index.jsx
@@ -9,6 +9,7 @@ import Admin from "../../../models/admin";
 import useQuery from "../../../hooks/useQuery";
 import ChatRow from "./ChatRow";
 
+const PAGE_SIZE = 20;
 export default function AdminChats() {
   return (
     <div className="w-screen h-screen overflow-hidden bg-sidebar flex">
@@ -45,21 +46,10 @@ function ChatsContainer() {
   const [canNext, setCanNext] = useState(false);
 
   const handlePrevious = () => {
-    if (chats.length === 0) {
-      setOffset(0);
-      return;
-    }
-
-    const chat = chats.at(-1);
-    if (chat.id - 20 <= 0) {
-      setOffset(0);
-      return;
-    }
-
-    setOffset(chat.id - 1);
+    setOffset(Math.max(offset - 1, 0));
   };
   const handleNext = () => {
-    setOffset(chats[0].id + 1);
+    setOffset(offset + 1);
   };
 
   useEffect(() => {
diff --git a/server/endpoints/admin.js b/server/endpoints/admin.js
index 1d21d92bc8d1705aa60efcfe720b3ff424372efc..a3852bd5ac66ea031eeac139dab632d82375ef11 100644
--- a/server/endpoints/admin.js
+++ b/server/endpoints/admin.js
@@ -264,15 +264,15 @@ function adminEndpoints(app) {
 
         const { offset = 0, limit = 20 } = reqBody(request);
         const chats = await WorkspaceChats.whereWithData(
-          { id: { gte: offset } },
-          limit
+          {},
+          limit,
+          offset * limit,
+          { id: "desc" }
         );
         const totalChats = await WorkspaceChats.count();
-        const hasPages = totalChats > offset + limit;
+        const hasPages = totalChats > (offset + 1) * limit;
 
-        response
-          .status(200)
-          .json({ chats: chats.reverse(), hasPages, totalChats });
+        response.status(200).json({ chats: chats, hasPages, totalChats });
       } catch (e) {
         console.error(e);
         response.sendStatus(500).end();
diff --git a/server/endpoints/api/admin/index.js b/server/endpoints/api/admin/index.js
index 1eeef995352556ac1a0da841f4e622c6987dd8f0..ee147c304a2d3f3f5f049328fcb515af5ae23eb8 100644
--- a/server/endpoints/api/admin/index.js
+++ b/server/endpoints/api/admin/index.js
@@ -513,14 +513,17 @@ function apiAdminEndpoints(app) {
           response.sendStatus(401).end();
           return;
         }
-
+        const pgSize = 20;
         const { offset = 0 } = reqBody(request);
         const chats = await WorkspaceChats.whereWithData(
-          { id: { gte: offset } },
-          20
+          {},
+          pgSize,
+          offset * pgSize,
+          { id: "desc" }
         );
-        const hasPages = (await WorkspaceChats.count()) > 20;
-        response.status(200).json({ chats: chats.reverse(), hasPages });
+
+        const hasPages = (await WorkspaceChats.count()) > (offset + 1) * pgSize;
+        response.status(200).json({ chats: chats, hasPages });
       } catch (e) {
         console.error(e);
         response.sendStatus(500).end();
diff --git a/server/models/workspaceChats.js b/server/models/workspaceChats.js
index 2e3a98a5ded0861ea0175045b8b4444b08cb18b1..36703efa40f5814182e1a33356c5a6fefd5f9c7f 100644
--- a/server/models/workspaceChats.js
+++ b/server/models/workspaceChats.js
@@ -108,11 +108,17 @@ const WorkspaceChats = {
     }
   },
 
-  where: async function (clause = {}, limit = null, orderBy = null) {
+  where: async function (
+    clause = {},
+    limit = null,
+    orderBy = null,
+    offset = null
+  ) {
     try {
       const chats = await prisma.workspace_chats.findMany({
         where: clause,
         ...(limit !== null ? { take: limit } : {}),
+        ...(offset !== null ? { skip: offset } : {}),
         ...(orderBy !== null ? { orderBy } : {}),
       });
       return chats;
@@ -134,12 +140,17 @@ const WorkspaceChats = {
     }
   },
 
-  whereWithData: async function (clause = {}, limit = null, orderBy = null) {
+  whereWithData: async function (
+    clause = {},
+    limit = null,
+    offset = null,
+    orderBy = null
+  ) {
     const { Workspace } = require("./workspace");
     const { User } = require("./user");
 
     try {
-      const results = await this.where(clause, limit, orderBy);
+      const results = await this.where(clause, limit, orderBy, offset);
 
       for (const res of results) {
         const workspace = await Workspace.get({ id: res.workspaceId });