From fa5bcc64bb09583de9f749d68aaed718b8458019 Mon Sep 17 00:00:00 2001
From: Guillaume Esquevin <esquevin@users.noreply.github.com>
Date: Tue, 8 Jan 2019 09:42:34 +0100
Subject: [PATCH] Move all children in <Transition /> (#683)

Fixes #682
---
 packages/react-pose/src/_tests/index.test.tsx | 38 +++++++++++++++++++
 .../src/components/Transition/children.ts     |  8 +---
 2 files changed, 40 insertions(+), 6 deletions(-)

diff --git a/packages/react-pose/src/_tests/index.test.tsx b/packages/react-pose/src/_tests/index.test.tsx
index aec4b8635..c8f00f09e 100644
--- a/packages/react-pose/src/_tests/index.test.tsx
+++ b/packages/react-pose/src/_tests/index.test.tsx
@@ -321,6 +321,44 @@ test('PoseGroup: Animate conditionally', () => {
   });
 });
 
+test('PoseGroup: All remaining children have a flip transition when one is removed', () => {
+  const items = [1, 2, 3, 4, 5, 6];
+  let nbEnterPoseCompleted = 0;
+  let flipTransitions = [];
+  return new Promise(resolve => {
+    const Group = ({ items }) => (
+      <PoseGroup>
+        {items.map((item, i) => (
+          <Parent
+            key={item}
+            onPoseComplete={poses => {
+              if (poses.includes('enter')) {
+                flipTransitions[i] = poses.includes('flip');
+                nbEnterPoseCompleted += 1;
+                if (nbEnterPoseCompleted === items.length) {
+                  expect(flipTransitions).toEqual([
+                    true,
+                    true,
+                    true,
+                    true,
+                    true
+                  ]);
+                  resolve();
+                }
+              }
+            }}
+          />
+        ))}
+      </PoseGroup>
+    );
+
+    const { rerender } = render(<Group items={items} />);
+    expect(flipTransitions).toEqual([]);
+
+    rerender(<Group items={[...items.slice(0, 2), ...items.slice(3)]} />);
+  });
+});
+
 test('PoseGroup: Forward props from PoseGroup to direct child', () => {
   let x = 0;
   let y = 0;
diff --git a/packages/react-pose/src/components/Transition/children.ts b/packages/react-pose/src/components/Transition/children.ts
index 830773b35..6674d1721 100644
--- a/packages/react-pose/src/components/Transition/children.ts
+++ b/packages/react-pose/src/components/Transition/children.ts
@@ -95,12 +95,8 @@ const handleTransition = (
 
   const moving = new Set(
     prevKeys.filter((key, i) => {
-      if (entering.has(key)) {
-        return false;
-      }
-
-      const nextIndex = nextKeys.indexOf(key);
-      return nextIndex !== -1 && i !== nextIndex;
+      // if it's not entering or leaving
+      return !entering.has(key) || leaving.indexOf(key) === -1;
     })
   );