Props are not updated on custom animated component

[jakex7]

Description

I built an animated view using Animated.createAnimatedComponent and passed an angle prop animation via useAnimatedProps. However, the view wasn't updating the prop through the shadow tree. To make it work, I needed to include zIndex: 1. Here's a sample code snippet:

import { ConicGradientView } from "expo-conic-gradient";
import { useEffect } from "react";
import { View } from "react-native";
import Animated, {
  Easing,
  useAnimatedProps,
  useSharedValue,
  withRepeat,
  withTiming,
} from "react-native-reanimated";

const AnimatedConicGradient =
  Animated.createAnimatedComponent(ConicGradientView);
export default () => {
  const value = useSharedValue(0);

  useEffect(() => {
    value.value = withRepeat(
      withTiming(360, { duration: 5000, easing: Easing.linear }),
      -1,
      false
    );
  }, [value]);

  const conic = useAnimatedProps(() => {
    return {
      angle: value.value,
      // working workaround with zIndex
      // zIndex: 1,
    };
  });

  return (
    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
      <AnimatedConicGradient
        colors={["red", "orange", "yellow", "green", "blue", "purple", "red"]}
        animatedProps={conic}
        style={{ width: 200, height: 200 }}
      />
    </View>
  );
};

Steps to reproduce

1. Clone expo-conic-gradient and checkout to branch reanimated-bug-repro
2. Run npm install in the root folder and run example app on iOS
3. Conic gradient angle is not updated
4. Uncomment zIndex: 1 in example/App.tsx to see workaround

Snack or a link to a repository

https://github.com/jakex7/expo-conic-gradient/tree/reanimated-bug-repro

Reanimated version

3.16.7

React Native version

0.76.6

Platforms

iOS

JavaScript runtime

Hermes

Workflow

Expo Dev Client

Architecture

Fabric (New Architecture)

Build type

Debug app & dev bundle

Device

iOS simulator

Device model

No response

Acknowledgements

Yes

[ariva85]

I have a similar issue but on android, the issue appears on v 3.16.0, works fine in 3.15.5 and below