diff --git a/apps/nextjs/src/app/[locale]/boards/(content)/_edit-board.tsx b/apps/nextjs/src/app/[locale]/boards/(content)/_edit-board.tsx
index 157f1c174..5ce139c79 100644
--- a/apps/nextjs/src/app/[locale]/boards/(content)/_edit-board.tsx
+++ b/apps/nextjs/src/app/[locale]/boards/(content)/_edit-board.tsx
@@ -13,7 +13,7 @@ const EditModeBoard = () => {
 
   const fullWidthSortedSections = board.sections
     .filter((section) => section.kind === "empty" || section.kind === "category")
-    .sort((sectionA, sectionB) => sectionA.yOffset - sectionB.yOffset);
+    .toSorted((sectionA, sectionB) => sectionA.yOffset - sectionB.yOffset);
 
   return (
     <Stack h="100%">
diff --git a/apps/nextjs/src/components/board/sections/static-grid-layout.ts b/apps/nextjs/src/components/board/sections/static-grid-layout.ts
index db6b17d2b..87c893eb4 100644
--- a/apps/nextjs/src/components/board/sections/static-grid-layout.ts
+++ b/apps/nextjs/src/components/board/sections/static-grid-layout.ts
@@ -8,7 +8,7 @@ const DEFAULT_SMALL_VIEWPORT_WIDTH = 360;
 const DEFAULT_LARGE_VIEWPORT_WIDTH = 1280;
 
 export const getStaticGridLayouts = (layouts: Board["layouts"]) =>
-  [...layouts].sort((layoutA, layoutB) => layoutA.breakpoint - layoutB.breakpoint);
+  [...layouts].toSorted((layoutA, layoutB) => layoutA.breakpoint - layoutB.breakpoint);
 
 const escapeCssString = (value: string) => value.replaceAll("\\", "\\\\").replaceAll('"', '\\"');
 
@@ -70,7 +70,7 @@ export const getStaticGridElements = (board: Board, sectionId: string, layoutId:
   return [
     ...getSectionItemsForLayout(board, sectionId, layoutId),
     ...getDynamicSectionsForLayout(board, sectionId, layoutId),
-  ].sort((itemA, itemB) => {
+  ].toSorted((itemA, itemB) => {
     if (itemA.yOffset === itemB.yOffset) return itemA.xOffset - itemB.xOffset;
     return itemA.yOffset - itemB.yOffset;
   });