Revert "fix: add additional check before running animate in `compon…

…entDidUpdate` (#10871)"

This reverts commit b9fb2d1.

packages/stack/src/views/Stack/Card.tsx

@@ -67,10 +67,6 @@ type Props = ViewProps & {
   contentStyle?: StyleProp<ViewStyle>;
 };
 
-type State = {
-  pointerEvents: ViewProps['pointerEvents'];
-};
-
 const GESTURE_VELOCITY_IMPACT = 0.3;
 
 const TRUE = 1;
@@ -93,7 +89,7 @@ const hasOpacityStyle = (style: any) => {
   return false;
 };
 
-export default class Card extends React.Component<Props, State> {
+export default class Card extends React.Component<Props> {
   static defaultProps = {
     shadowEnabled: false,
     gestureEnabled: true,
@@ -108,10 +104,6 @@ export default class Card extends React.Component<Props, State> {
       ) : null,
   };
 
-  state: State = {
-    pointerEvents: 'auto',
-  };
-
   componentDidMount() {
     this.animate({ closing: this.props.closing });
     this.isCurrentlyMounted = true;
@@ -136,12 +128,11 @@ export default class Card extends React.Component<Props, State> {
     const toValue = this.getAnimateToValue(this.props);
 
     if (
-      closing !== prevProps.closing &&
-      (this.getAnimateToValue(prevProps) !== toValue ||
-        this.lastToValue !== toValue)
+      this.getAnimateToValue(prevProps) !== toValue ||
+      this.lastToValue !== toValue
     ) {
       // We need to trigger the animation when route was closed
-      // The route might have been closed by a `POP` action or by a gesture
+      // Thr route might have been closed by a `POP` action or by a gesture
       // When route was closed due to a gesture, the animation would've happened already
       // It's still important to trigger the animation so that `onClose` is called
       // If `onClose` is not called, cleanup step won't be performed for gestures
@@ -251,7 +242,7 @@ export default class Card extends React.Component<Props, State> {
   private setPointerEventsEnabled = (enabled: boolean) => {
     const pointerEvents = enabled ? 'box-none' : 'none';
 
-    this.setState({ pointerEvents });
+    this.contentRef.current?.setNativeProps({ pointerEvents });
   };
 
   private handleStartInteraction = () => {
@@ -434,6 +425,8 @@ export default class Card extends React.Component<Props, State> {
     }
   }
 
+  private contentRef = React.createRef<View>();
+
   render() {
     const {
       styleInterpolator,
@@ -562,7 +555,7 @@ export default class Card extends React.Component<Props, State> {
                   />
                 ) : null}
                 <CardSheet
-                  pointerEvents={this.state.pointerEvents}
+                  ref={this.contentRef}
                   enabled={pageOverflowEnabled}
                   layout={layout}
                   style={contentStyle}