From ad8a6b50a7efacd0af1b3a8e7b7ca2399a19eb05 Mon Sep 17 00:00:00 2001
From: owen-duncan-snobel
 <43126781+owen-duncan-snobel@users.noreply.github.com>
Date: Mon, 20 Feb 2023 13:53:38 -0500
Subject: [PATCH] Allow SortableElements to move out of the parent element
 (#1771)

Fix #1685 the Sortable component for "Ranking assistant replies bug - a
reply is too big"
---
 website/src/components/Sortable/Sortable.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/website/src/components/Sortable/Sortable.tsx b/website/src/components/Sortable/Sortable.tsx
index 05b63bc9e0..eae73cdc1c 100644
--- a/website/src/components/Sortable/Sortable.tsx
+++ b/website/src/components/Sortable/Sortable.tsx
@@ -18,7 +18,7 @@ import {
   useSensors,
 } from "@dnd-kit/core";
 import type { DragEndEvent } from "@dnd-kit/core/dist/types/events";
-import { restrictToParentElement, restrictToVerticalAxis } from "@dnd-kit/modifiers";
+import { restrictToVerticalAxis, restrictToWindowEdges } from "@dnd-kit/modifiers";
 import {
   arrayMove,
   SortableContext,
@@ -77,7 +77,7 @@ export const Sortable = (props: SortableProps) => {
         sensors={sensors}
         collisionDetection={closestCenter}
         onDragEnd={handleDragEnd}
-        modifiers={[restrictToParentElement, restrictToVerticalAxis]}
+        modifiers={[restrictToWindowEdges, restrictToVerticalAxis]}
       >
         <SortableContext items={itemsWithIds} strategy={verticalListSortingStrategy}>
           <Flex direction="column" gap={2} className={extraClasses}>