react-native-reanimated 3.0.0-rc.4 → 3.0.0-rc.6

package/ios/LayoutReanimation/REAAnimationsManager.m

@@ -5,28 +5,38 @@
 #import <React/UIView+Private.h>
 #import <React/UIView+React.h>
 
-@interface REAAnimationsManager ()
-
 typedef NS_ENUM(NSInteger, FrameConfigType) { EnteringFrame, ExitingFrame };
 
-@property (atomic, nullable) void (^startAnimationForTag)(NSNumber *, NSString *, NSDictionary *, NSNumber *);
-@property (atomic, nullable) void (^removeConfigForTag)(NSNumber *);
+static BOOL REANodeFind(id<RCTComponent> view, int (^block)(id<RCTComponent>))
+{
+  if (!view.reactTag) {
+    return NO;
+  }
 
-- (void)removeLeftovers;
-- (void)scheduleCleaning;
-- (double)getDoubleOrZero:(NSNumber *)number;
+  if (block(view)) {
+    return YES;
+  }
 
-@end
+  for (id<RCTComponent> subview in view.reactSubviews) {
+    if (REANodeFind(subview, block)) {
+      return YES;
+    }
+  }
+
+  return NO;
+}
 
 @implementation REAAnimationsManager {
   RCTUIManager *_uiManager;
   REAUIManager *_reaUiManager;
-  NSMutableDictionary<NSNumber *, NSNumber *> *_states;
-  NSMutableDictionary<NSNumber *, UIView *> *_viewForTag;
-  NSMutableSet<NSNumber *> *_toRemove;
+  NSMutableDictionary<NSNumber *, UIView *> *_exitingViews;
+  NSMutableDictionary<NSNumber *, NSNumber *> *_exitingSubviewsCountMap;
+  NSMutableSet<NSNumber *> *_ancestorsToRemove;
   NSMutableArray<NSString *> *_targetKeys;
   NSMutableArray<NSString *> *_currentKeys;
-  BOOL _cleaningScheduled;
+  REAAnimationStartingBlock _startAnimationForTag;
+  REAHasAnimationBlock _hasAnimationForTag;
+  REAAnimationRemovingBlock _clearAnimationConfigForTag;
 }
 
 + (NSArray *)layoutKeys
@@ -44,10 +54,9 @@ typedef NS_ENUM(NSInteger, FrameConfigType) { EnteringFrame, ExitingFrame };
   if (self = [super init]) {
     _uiManager = uiManager;
     _reaUiManager = (REAUIManager *)uiManager;
-    _states = [NSMutableDictionary new];
-    _viewForTag = [NSMutableDictionary new];
-    _toRemove = [NSMutableSet new];
-    _cleaningScheduled = false;
+    _exitingViews = [NSMutableDictionary new];
+    _exitingSubviewsCountMap = [NSMutableDictionary new];
+    _ancestorsToRemove = [NSMutableSet new];
 
     _targetKeys = [NSMutableArray new];
     _currentKeys = [NSMutableArray new];
@@ -61,138 +70,77 @@ typedef NS_ENUM(NSInteger, FrameConfigType) { EnteringFrame, ExitingFrame };
 
 - (void)invalidate
 {
+  for (NSNumber *tag in [[_exitingViews allKeys] copy]) {
+    [self endLayoutAnimationForTag:tag cancelled:true removeView:true];
+  }
   _startAnimationForTag = nil;
-  _removeConfigForTag = nil;
+  _hasAnimationForTag = nil;
   _uiManager = nil;
-  _states = nil;
-  _viewForTag = nil;
-  _toRemove = nil;
-  _cleaningScheduled = false;
+  _exitingViews = nil;
   _targetKeys = nil;
   _currentKeys = nil;
 }
 
-- (void)setAnimationStartingBlock:
-    (void (^)(NSNumber *tag, NSString *type, NSDictionary *yogaValues, NSNumber *depth))startAnimation
+- (void)setAnimationStartingBlock:(REAAnimationStartingBlock)startAnimation
 {
   _startAnimationForTag = startAnimation;
 }
 
-- (void)setRemovingConfigBlock:(void (^)(NSNumber *tag))block
+- (void)setHasAnimationBlock:(REAHasAnimationBlock)hasAnimation
 {
-  _removeConfigForTag = block;
+  _hasAnimationForTag = hasAnimation;
 }
 
-- (void)scheduleCleaning
+- (void)setAnimationRemovingBlock:(REAAnimationRemovingBlock)clearAnimation
 {
-  if (_cleaningScheduled) {
-    return;
-  }
-  _cleaningScheduled = true;
-
-  __weak REAAnimationsManager *weakSelf = self;
-  dispatch_async(dispatch_get_main_queue(), ^{
-    self->_cleaningScheduled = false;
-    if (weakSelf == nil) {
-      return;
-    }
-    [self removeLeftovers];
-  });
+  _clearAnimationConfigForTag = clearAnimation;
 }
 
-- (void)findRoot:(UIView *)view roots:(NSMutableSet<NSNumber *> *)roots
+- (UIView *)viewForTag:(NSNumber *)tag
 {
-  UIView *currentView = view;
-  NSNumber *lastToRemoveTag = nil;
-  while (currentView != nil) {
-    ViewState state = [_states[currentView.reactTag] intValue];
-    if (state == Disappearing) {
-      return;
-    }
-    if (state == ToRemove) {
-      lastToRemoveTag = currentView.reactTag;
-    }
-    currentView = currentView.superview;
-  }
-  if (lastToRemoveTag != nil) {
-    [roots addObject:lastToRemoveTag];
+  UIView *view = [_reaUiManager viewForReactTag:tag];
+  if (view == nil) {
+    return [_exitingViews objectForKey:tag];
   }
+  return view;
 }
 
-- (BOOL)dfs:(UIView *)root view:(UIView *)view cands:(NSMutableSet<NSNumber *> *)cands
+- (void)endLayoutAnimationForTag:(NSNumber *)tag cancelled:(BOOL)cancelled removeView:(BOOL)removeView
 {
-  NSNumber *tag = view.reactTag;
-  if (tag == nil) {
-    return true;
+  UIView *view = [_exitingViews objectForKey:tag];
+  if (removeView && view != nil) {
+    [self endAnimationsRecursive:view];
+    [view removeFromSuperview];
   }
-  if (![cands containsObject:tag] && _states[tag] != nil) {
-    return true;
-  }
-  BOOL cannotStripe = false;
-  NSArray<UIView *> *toRemoveCopy = [view.reactSubviews copy];
-  for (UIView *child in toRemoveCopy) {
-    if (![view isKindOfClass:[RCTTextView class]]) {
-      cannotStripe |= [self dfs:root view:child cands:cands];
-    }
-  }
-  if (!cannotStripe) {
-    if (view.reactSuperview != nil) {
-      [_reaUiManager unregisterView:view];
-    }
-    [_states removeObjectForKey:tag];
-    [_viewForTag removeObjectForKey:tag];
-    [_toRemove removeObject:tag];
-  }
-  return cannotStripe;
 }
 
-- (void)removeLeftovers
+- (void)endAnimationsRecursive:(UIView *)view
 {
-  NSMutableSet<NSNumber *> *roots = [NSMutableSet new];
-  for (NSNumber *viewTag in _toRemove) {
-    UIView *view = _viewForTag[viewTag];
-    if (view == nil) {
-      view = [_reaUiManager viewForReactTag:viewTag];
-      _viewForTag[viewTag] = view;
-    }
-    [self findRoot:view roots:roots];
+  NSNumber *tag = [view reactTag];
+
+  if (tag == nil) {
+    return;
   }
-  for (NSNumber *viewTag in roots) {
-    UIView *view = _viewForTag[viewTag];
-    [self dfs:view view:view cands:_toRemove];
+
+  // we'll remove this view anyway when exiting from recursion,
+  // no need to remove it in `maybeDropAncestors`
+  [_ancestorsToRemove removeObject:tag];
+
+  for (UIView *child in [[view subviews] copy]) {
+    [self endAnimationsRecursive:child];
   }
-}
 
-- (void)notifyAboutEnd:(NSNumber *)tag cancelled:(BOOL)cancelled
-{
-  if (!cancelled) {
-    ViewState state = [_states[tag] intValue];
-    if (state == Appearing) {
-      _states[tag] = [NSNumber numberWithInt:Layout];
-    }
-    if (state == Disappearing) {
-      _states[tag] = [NSNumber numberWithInt:ToRemove];
-      if (tag != nil) {
-        [_toRemove addObject:tag];
-      }
-      [self scheduleCleaning];
-    }
+  if ([_exitingViews objectForKey:tag]) {
+    [_exitingViews removeObjectForKey:tag];
+    [self maybeDropAncestors:view];
   }
 }
 
-- (void)notifyAboutProgress:(NSDictionary *)newStyle tag:(NSNumber *)tag
+- (void)progressLayoutAnimationWithStyle:(NSDictionary *)newStyle forTag:(NSNumber *)tag
 {
-  if (_states[tag] == nil) {
-    return;
-  }
-  ViewState state = [_states[tag] intValue];
-  if (state == Inactive) {
-    _states[tag] = [NSNumber numberWithInt:Appearing];
-  }
-
   NSMutableDictionary *dataComponenetsByName = [_uiManager valueForKey:@"_componentDataByName"];
   RCTComponentData *componentData = dataComponenetsByName[@"RCTView"];
-  [self setNewProps:[newStyle mutableCopy] forView:_viewForTag[tag] withComponentData:componentData];
+  [self setNewProps:[newStyle mutableCopy] forView:[self viewForTag:tag] withComponentData:componentData];
 }
 
 - (double)getDoubleOrZero:(NSNumber *)number
@@ -288,73 +236,160 @@ typedef NS_ENUM(NSInteger, FrameConfigType) { EnteringFrame, ExitingFrame };
   return preparedData;
 }
 
-- (void)onViewRemoval:(UIView *)view before:(REASnapshot *)before
+- (BOOL)wantsHandleRemovalOfView:(UIView *)view
 {
-  NSNumber *tag = view.reactTag;
-  ViewState state = [_states[tag] intValue];
-  if (state == Disappearing || state == ToRemove || tag == nil) {
-    return;
+  return REANodeFind(view, ^(id<RCTComponent> view) {
+    return [self->_exitingSubviewsCountMap objectForKey:view.reactTag] != nil ||
+        self->_hasAnimationForTag(view.reactTag, @"exiting");
+  });
+}
+
+- (void)registerExitingAncestors:(UIView *)child
+{
+  UIView *parent = child.superview;
+  while (parent != nil && ![parent isKindOfClass:[RCTRootView class]]) {
+    if (parent.reactTag != nil) {
+      _exitingSubviewsCountMap[parent.reactTag] = @([_exitingSubviewsCountMap[parent.reactTag] intValue] + 1);
+    }
+    parent = parent.superview;
   }
-  NSMutableDictionary<NSString *, NSObject *> *startValues = before.values;
-  if (state == Inactive) {
-    if (startValues != nil) {
-      _states[tag] = [NSNumber numberWithInt:ToRemove];
-      [_toRemove addObject:tag];
-      [self scheduleCleaning];
+}
+
+- (void)maybeDropAncestors:(UIView *)child
+{
+  UIView *parent = child.superview;
+  while (parent != nil && ![parent isKindOfClass:[RCTRootView class]]) {
+    UIView *view = parent;
+    parent = view.superview;
+    if (view.reactTag == nil) {
+      continue;
+    }
+    int trackingCount = [_exitingSubviewsCountMap[view.reactTag] intValue] - 1;
+    if (trackingCount <= 0) {
+      if ([_ancestorsToRemove containsObject:view.reactTag]) {
+        [_ancestorsToRemove removeObject:view.reactTag];
+        if (![_exitingViews objectForKey:view.reactTag]) {
+          [view removeFromSuperview];
+        }
+      }
+      [_exitingSubviewsCountMap removeObjectForKey:view.reactTag];
+    } else {
+      _exitingSubviewsCountMap[view.reactTag] = @(trackingCount);
     }
-    return;
   }
-  _states[tag] = [NSNumber numberWithInt:Disappearing];
-  NSDictionary *preparedValues = [self prepareDataForAnimatingWorklet:startValues frameConfig:ExitingFrame];
-  _startAnimationForTag(tag, @"exiting", preparedValues, @(0));
 }
 
-- (void)onViewCreate:(UIView *)view after:(REASnapshot *)after
+- (BOOL)removeRecursive:(UIView *)view fromContainer:(UIView *)container withoutAnimation:(BOOL)removeImmediately;
 {
-  _reaUiManager.flushUiOperations();
-  NSNumber *tag = view.reactTag;
-  if (_states[tag] == nil) {
-    _states[tag] = [NSNumber numberWithInt:Inactive];
-    _viewForTag[tag] = view;
+  if (!view.reactTag) {
+    return NO;
   }
-  NSMutableDictionary *targetValues = after.values;
-  ViewState state = [_states[tag] intValue];
-  if (state == Inactive) {
-    if (targetValues != nil) {
-      NSDictionary *preparedValues = [self prepareDataForAnimatingWorklet:targetValues frameConfig:EnteringFrame];
-      _startAnimationForTag(tag, @"entering", preparedValues, @(0));
+  BOOL hasExitAnimation = _hasAnimationForTag(view.reactTag, @"exiting") || [_exitingViews objectForKey:view.reactTag];
+  BOOL hasAnimatedChildren = NO;
+  removeImmediately = removeImmediately && !hasExitAnimation;
+  NSMutableArray *toBeRemoved = [[NSMutableArray alloc] init];
+
+  for (UIView *subview in [view.reactSubviews copy]) {
+    if ([self removeRecursive:subview fromContainer:view withoutAnimation:removeImmediately]) {
+      hasAnimatedChildren = YES;
+    } else if (removeImmediately) {
+      [toBeRemoved addObject:subview];
+    }
+  }
+
+  BOOL wantAnimateExit = hasExitAnimation || hasAnimatedChildren;
+
+  if (!wantAnimateExit) {
+    return NO;
+  }
+
+  REASnapshot *before;
+  if (hasExitAnimation) {
+    before = [[REASnapshot alloc] init:view];
+  }
+  // start exit animation
+  UIView *originalSuperview = view.superview;
+  NSUInteger originalIndex = [originalSuperview.subviews indexOfObjectIdenticalTo:view];
+  [container removeReactSubview:view];
+  // we don't want user interaction on exiting views
+  view.userInteractionEnabled = NO;
+  [originalSuperview insertSubview:view atIndex:originalIndex];
+
+  if (hasExitAnimation && ![_exitingViews objectForKey:view.reactTag]) {
+    NSDictionary *preparedValues = [self prepareDataForAnimatingWorklet:before.values frameConfig:ExitingFrame];
+    [_exitingViews setObject:view forKey:view.reactTag];
+    [self registerExitingAncestors:view];
+    _startAnimationForTag(view.reactTag, @"exiting", preparedValues, @(0));
+  }
+
+  if (hasAnimatedChildren) {
+    [_ancestorsToRemove addObject:view.reactTag];
+  }
+
+  for (UIView *child in toBeRemoved) {
+    [view removeReactSubview:child];
+  }
+
+  // NOTE: even though this view is still visible,
+  // since it's removed from the React tree, we won't
+  // start new animations for it, and might as well remove
+  // the layout animation config now
+  _clearAnimationConfigForTag(view.reactTag);
+  return YES;
+}
+
+- (void)removeChildren:(NSArray<UIView *> *)children fromContainer:(UIView *)container
+{
+  for (UIView *removedChild in children) {
+    if (![self removeRecursive:removedChild fromContainer:container withoutAnimation:true]) {
+      [removedChild removeFromSuperview];
     }
-    return;
   }
 }
 
+- (void)onViewCreate:(UIView *)view after:(REASnapshot *)after
+{
+  NSMutableDictionary *targetValues = after.values;
+  NSDictionary *preparedValues = [self prepareDataForAnimatingWorklet:targetValues frameConfig:EnteringFrame];
+  _startAnimationForTag(view.reactTag, @"entering", preparedValues, @(0));
+}
+
 - (void)onViewUpdate:(UIView *)view before:(REASnapshot *)before after:(REASnapshot *)after
 {
-  NSNumber *tag = view.reactTag;
   NSMutableDictionary *targetValues = after.values;
   NSMutableDictionary *currentValues = before.values;
-  if (_states[tag] == nil) {
-    return;
-  }
-  ViewState state = [_states[tag] intValue];
-  if (state == Disappearing || state == ToRemove || state == Inactive) {
-    return;
+
+  NSDictionary *preparedValues = [self prepareDataForLayoutAnimatingWorklet:currentValues targetValues:targetValues];
+  _startAnimationForTag(view.reactTag, @"layout", preparedValues, @(0));
+}
+
+- (REASnapshot *)prepareSnapshotBeforeMountForView:(UIView *)view
+{
+  if (_hasAnimationForTag(view.reactTag, @"layout")) {
+    return [[REASnapshot alloc] init:view];
   }
-  if (state == Appearing) {
-    BOOL doNotStartLayout = true;
-    for (int i = 0; i < [[self class] layoutKeys].count; ++i) {
-      if ([((NSNumber *)currentValues[_currentKeys[i]]) doubleValue] !=
-          [((NSNumber *)targetValues[_targetKeys[i]]) doubleValue]) {
-        doNotStartLayout = false;
-      }
-    }
-    if (doNotStartLayout) {
-      return;
+  return nil;
+}
+
+- (void)viewDidMount:(UIView *)view withBeforeSnapshot:(nonnull REASnapshot *)before
+{
+  NSString *type = before == nil ? @"entering" : @"layout";
+  if (_hasAnimationForTag(view.reactTag, type)) {
+    REASnapshot *after = [[REASnapshot alloc] init:view];
+    if (before == nil) {
+      [self onViewCreate:view after:after];
+    } else {
+      [self onViewUpdate:view before:before after:after];
     }
   }
-  _states[view.reactTag] = [NSNumber numberWithInt:Layout];
-  NSDictionary *preparedValues = [self prepareDataForLayoutAnimatingWorklet:currentValues targetValues:targetValues];
-  _startAnimationForTag(view.reactTag, @"layout", preparedValues, @(0));
+}
+
+- (void)removeAnimationsFromSubtree:(UIView *)view
+{
+  REANodeFind(view, ^int(id<RCTComponent> view) {
+    self->_clearAnimationConfigForTag(view.reactTag);
+    return false;
+  });
 }
 
 @end

package/ios/LayoutReanimation/REAUIManager.mm

@@ -24,17 +24,25 @@
         removeAtIndices:(NSArray<NSNumber *> *)removeAtIndices
                registry:(NSMutableDictionary<NSNumber *, id<RCTComponent>> *)registry;
 
+- (void)_removeChildren:(NSArray<UIView *> *)children fromContainer:(UIView *)container;
+
+- (void)_removeChildren:(NSArray<UIView *> *)children
+          fromContainer:(UIView *)container
+          withAnimation:(RCTLayoutAnimationGroup *)animation;
+
+- (RCTViewManagerUIBlock)uiBlockWithLayoutUpdateForRootView:(RCTRootShadowView *)rootShadowView;
+
 - (NSArray<id<RCTComponent>> *)_childrenToRemoveFromContainer:(id<RCTComponent>)container
                                                     atIndices:(NSArray<NSNumber *> *)atIndices;
 @end
 
-@implementation REAUIManager
-
-BOOL blockSetter = false;
-NSMutableDictionary<NSNumber *, NSMutableSet<id<RCTComponent>> *> *_toBeRemovedRegister;
-NSMutableDictionary<NSNumber *, NSNumber *> *_parentMapper;
-REAAnimationsManager *_animationsManager;
-std::weak_ptr<reanimated::Scheduler> _scheduler;
+@implementation REAUIManager {
+  RCTLayoutAnimationGroup *_reactLayoutAnimationGroup;
+  NSMutableDictionary<NSNumber *, NSMutableSet<id<RCTComponent>> *> *_toBeRemovedRegister;
+  NSMutableDictionary<NSNumber *, NSNumber *> *_parentMapper;
+  REAAnimationsManager *_animationsManager;
+  std::weak_ptr<reanimated::Scheduler> _scheduler;
+}
 
 + (NSString *)moduleName
 {
@@ -43,6 +51,13 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
 
 - (void)setBridge:(RCTBridge *)bridge
 {
+  // setting a layout animation group with a deleting animation in order to
+  // allows us to call a different method in RCTUIManager for cleaning up exiting views
+  RCTLayoutAnimation *deletingAnimation = [[RCTLayoutAnimation alloc] initWithDuration:0 config:@{}];
+  _reactLayoutAnimationGroup = [[RCTLayoutAnimationGroup alloc] initWithCreatingLayoutAnimation:nil
+                                                                        updatingLayoutAnimation:nil
+                                                                        deletingLayoutAnimation:deletingAnimation
+                                                                                       callback:nil];
   if (!_blockSetter) {
     _blockSetter = true;
 
@@ -64,6 +79,21 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
   }
 }
 
+- (void)_removeChildren:(NSArray<UIView *> *)children
+          fromContainer:(UIView *)container
+          withAnimation:(RCTLayoutAnimationGroup *)animation
+{
+  if (animation == _reactLayoutAnimationGroup) {
+    // if a removed view in this batch has an `exiting` animation,
+    // let REAAnimationsManager handle the removal
+    [_animationsManager removeChildren:children fromContainer:container];
+  } else {
+    // otherwise, if there's a layout animation group set,
+    // delegate to the React Native implementation for layout animations
+    [super _removeChildren:children fromContainer:container withAnimation:animation];
+  }
+}
+
 - (void)_manageChildren:(NSNumber *)containerTag
         moveFromIndices:(NSArray<NSNumber *> *)moveFromIndices
           moveToIndices:(NSArray<NSNumber *> *)moveToIndices
@@ -85,22 +115,23 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
 
   // Reanimated changes /start
   BOOL isUIViewRegistry = ((id)registry == (id)[self valueForKey:@"_viewRegistry"]);
-  id<RCTComponent> container;
-  NSMutableArray<id<RCTComponent>> *permanentlyRemovedChildren;
   if (isUIViewRegistry) {
-    container = registry[containerTag];
-    for (id<RCTComponent> toRemoveChild in _toBeRemovedRegister[containerTag]) {
-      [container removeReactSubview:toRemoveChild];
-    }
-
-    permanentlyRemovedChildren = (NSMutableArray *)[super _childrenToRemoveFromContainer:container
-                                                                               atIndices:removeAtIndices];
-    if (permanentlyRemovedChildren != nil) {
-      for (id<RCTComponent> permanentlyRemovedChild in permanentlyRemovedChildren) {
-        if (_toBeRemovedRegister[containerTag] == nil) {
-          _toBeRemovedRegister[containerTag] = [[NSMutableSet<id<RCTComponent>> alloc] init];
+    BOOL wasProxyRemovalSet = [self valueForKey:@"_layoutAnimationGroup"] == _reactLayoutAnimationGroup;
+    BOOL wantProxyRemoval = NO;
+    if (!wasProxyRemovalSet) {
+      id<RCTComponent> container = registry[containerTag];
+      NSArray<id<RCTComponent>> *permanentlyRemovedChildren = [self _childrenToRemoveFromContainer:container
+                                                                                         atIndices:removeAtIndices];
+      for (UIView *removedChild in permanentlyRemovedChildren) {
+        if ([_animationsManager wantsHandleRemovalOfView:removedChild]) {
+          wantProxyRemoval = YES;
+          break;
         }
-        [_toBeRemovedRegister[containerTag] addObject:permanentlyRemovedChild];
+        [_animationsManager removeAnimationsFromSubtree:removedChild];
+      }
+      if (wantProxyRemoval) {
+        // set layout animation group
+        [super setNextLayoutAnimationGroup:_reactLayoutAnimationGroup];
       }
     }
   }
@@ -113,43 +144,11 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
             addAtIndices:addAtIndices
          removeAtIndices:removeAtIndices
                 registry:registry];
-
-  // Reanimated changes /start
-  if (isUIViewRegistry) {
-    NSMutableDictionary<NSNumber *, id<RCTComponent>> *viewRegistry = [self valueForKey:@"_viewRegistry"];
-    for (id<RCTComponent> toRemoveChild in _toBeRemovedRegister[containerTag]) {
-      NSInteger lastIndex = [container reactSubviews].count - 1;
-      if (lastIndex < 0) {
-        lastIndex = 0;
-      }
-      if ([toRemoveChild isKindOfClass:[RCTModalHostView class]]
-#if __has_include(<RNScreens/RNSScreen.h>)
-          || ([toRemoveChild isKindOfClass:[RNSScreenView class]])
-#endif
-      ) {
-        // we don't want layout animations when removing modals or Screens of native-stack since it brings buggy
-        // behavior
-        [_toBeRemovedRegister[container.reactTag] removeObject:toRemoveChild];
-        [permanentlyRemovedChildren removeObject:toRemoveChild];
-
-      } else {
-        [container insertReactSubview:toRemoveChild atIndex:lastIndex];
-        viewRegistry[toRemoveChild.reactTag] = toRemoveChild;
-      }
-    }
-
-    for (UIView *removedChild in permanentlyRemovedChildren) {
-      [self callAnimationForTree:removedChild parentTag:containerTag];
-    }
-  }
-  // Reanimated changes /end
 }
 
 - (void)callAnimationForTree:(UIView *)view parentTag:(NSNumber *)parentTag
 {
-  REASnapshot *snapshot = [[REASnapshot alloc] init:view];
   _parentMapper[view.reactTag] = parentTag;
-  [_animationsManager onViewRemoval:view before:snapshot];
 
   for (UIView *subView in view.reactSubviews) {
     [self callAnimationForTree:subView parentTag:view.reactTag];
@@ -159,6 +158,10 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
 // Overrided https://github.com/facebook/react-native/blob/v0.65.0/React/Modules/RCTUIManager.m#L530
 - (RCTViewManagerUIBlock)uiBlockWithLayoutUpdateForRootView:(RCTRootShadowView *)rootShadowView
 {
+  if (!reanimated::FeaturesConfig::isLayoutAnimationEnabled()) {
+    return [super uiBlockWithLayoutUpdateForRootView:rootShadowView];
+  }
+
   NSHashTable<RCTShadowView *> *affectedShadowViews = [NSHashTable weakObjectsHashTable];
   [rootShadowView layoutWithAffectedShadowViews:affectedShadowViews];
 
@@ -270,10 +273,7 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
       }
 
       // Reanimated changes /start
-      REASnapshot *snapshotBefore;
-      if (reanimated::FeaturesConfig::isLayoutAnimationEnabled()) {
-        snapshotBefore = [[REASnapshot alloc] init:view];
-      }
+      REASnapshot *snapshotBefore = isNew ? nil : [self->_animationsManager prepareSnapshotBeforeMountForView:view];
       // Reanimated changes /end
 
       if (creatingLayoutAnimation) {
@@ -322,22 +322,15 @@ std::weak_ptr<reanimated::Scheduler> _scheduler;
       }
 
       // Reanimated changes /start
-      if (reanimated::FeaturesConfig::isLayoutAnimationEnabled()) {
-        if (isNew) {
-          REASnapshot *snapshot = [[REASnapshot alloc] init:view];
-          [_animationsManager onViewCreate:view after:snapshot];
-        } else {
-          REASnapshot *snapshotAfter = [[REASnapshot alloc] init:view];
-          [_animationsManager onViewUpdate:view before:snapshotBefore after:snapshotAfter];
-        }
+      if (isNew || snapshotBefore != nil) {
+        [self->_animationsManager viewDidMount:view withBeforeSnapshot:snapshotBefore];
       }
+      // Reanimated changes /end
     }
-
-    [_animationsManager removeLeftovers];
     // Clean up
-    // uiManager->_layoutAnimationGroup = nil;
-    [uiManager setValue:nil forKey:@"_layoutAnimationGroup"];
-    // Reanimated changes /end
+    // below line serves as this one uiManager->_layoutAnimationGroup = nil;, because we don't have access to the
+    // private field
+    [uiManager setNextLayoutAnimationGroup:nil];
   };
 }