Paste grid cell as sibling (#6516)

**Problem:**

Copy-pasting a grid cell ends up pasting it inside the selected element
instead of next to it.

**Fix:**

If the copied element is a grid cell and the target is another grid
cell, paste next to it.


| Before | After |
|------------|-------------|
| ![Kapture 2024-10-10 at 16 18
06](https://github.com/user-attachments/assets/ff77dac5-c62b-4a60-b4a2-2e98d2fde8b4)
| ![Kapture 2024-10-10 at 16 16
49](https://github.com/user-attachments/assets/326e63f1-3796-4592-b7de-e9b8a5a4a471)
|

Fixes #6515

Author: ruggi

editor/src/components/canvas/canvas-strategies/strategies/reparent-utils.ts

@@ -538,6 +538,36 @@ function pasteNextToSameSizedElement(
   return null
 }
 
+function pasteIntoNextGridCell(
+  copyData: ParsedCopyData,
+  selectedViews: NonEmptyArray<ElementPath>,
+  metadata: ElementInstanceMetadataMap,
+): ReparentTargetForPaste | null {
+  if (selectedViews.length === 0) {
+    return null
+  }
+  const selectedView = lastOfNonEmptyArray(selectedViews)
+
+  // if the copied elements are grid cells and the target is a grid cell, paste next to it
+
+  const copyDataElementsAreGridCells = copyData.elementPaste.every(({ originalElementPath }) =>
+    MetadataUtils.isGridCell(copyData.originalContextMetadata, originalElementPath),
+  )
+  if (!copyDataElementsAreGridCells) {
+    return null
+  }
+
+  const targetIsGridChild = MetadataUtils.isGridCell(metadata, selectedView)
+  if (!targetIsGridChild) {
+    return null
+  }
+
+  return {
+    type: 'parent',
+    parentPath: childInsertionPath(EP.parentPath(selectedView)),
+  }
+}
+
 function canInsertIntoTarget(
   projectContents: ProjectContentTreeRoot,
   metadata: ElementInstanceMetadataMap,
@@ -762,6 +792,11 @@ export function getTargetParentForPaste(
     return right(pasteNextToSameSizedElementResult)
   }
 
+  const paseIntoNextGridCellResult = pasteIntoNextGridCell(copyData, selectedViews, metadata)
+  if (paseIntoNextGridCellResult != null) {
+    return right(paseIntoNextGridCellResult)
+  }
+
   const pasteIntoParentOrGrandparentResult = pasteIntoParentOrGrandparent(
     copyData.elementPaste.map((e) => e.element),
     projectContents,