From 46b574283f3ae00d78680098bb41cb1e4da41339 Mon Sep 17 00:00:00 2001
From: Pete Hunt <petehunt@users.noreply.github.com>
Date: Tue, 26 May 2020 13:56:22 -0700
Subject: [PATCH] Fix zindex in groups (#1660)

---
 src/actions/actionGroup.ts | 24 ++++++++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/actions/actionGroup.ts b/src/actions/actionGroup.ts
index 4f580c636..3538cf2d2 100644
--- a/src/actions/actionGroup.ts
+++ b/src/actions/actionGroup.ts
@@ -10,6 +10,7 @@ import {
   getElementsInGroup,
   addToGroup,
   removeFromSelectedGroups,
+  isElementInGroup,
 } from "../groups";
 import { getNonDeletedElements } from "../element";
 
@@ -58,13 +59,32 @@ export const actionGroup = register({
         ),
       });
     });
+    // keep the z order within the group the same, but move them
+    // to the z order of the highest element in the layer stack
+    const elementsInGroup = getElementsInGroup(updatedElements, newGroupId);
+    const lastElementInGroup = elementsInGroup[elementsInGroup.length - 1];
+    const lastGroupElementIndex = updatedElements.lastIndexOf(
+      lastElementInGroup,
+    );
+    const elementsAfterGroup = updatedElements.slice(lastGroupElementIndex + 1);
+    const elementsBeforeGroup = updatedElements
+      .slice(0, lastGroupElementIndex)
+      .filter(
+        (updatedElement) => !isElementInGroup(updatedElement, newGroupId),
+      );
+    const updatedElementsInOrder = [
+      ...elementsBeforeGroup,
+      ...elementsInGroup,
+      ...elementsAfterGroup,
+    ];
+
     return {
       appState: selectGroup(
         newGroupId,
         { ...appState, selectedGroupIds: {} },
-        getNonDeletedElements(updatedElements),
+        getNonDeletedElements(updatedElementsInOrder),
       ),
-      elements: updatedElements,
+      elements: updatedElementsInOrder,
       commitToHistory: true,
     };
   },