How to use the react-native-reanimated.useCode function in react-native-reanimated

setLayoutWihEffects(name.nothing)
      }, 0)
      setTimeout(() => {
        setLayoutWihEffects(name.addButtonVisible)
      }, 100)
    } else {
    }
  }, [layout])

  const onClose = useRef(() => {
    console.tron.debug('close')
  })
  const bottomSheetRef = useRef(null)
  const callbackNode = useRef(new Animated.Value(1))
  const callbackNode1 = useRef(new Animated.Value(1))
  Animated.useCode(
    Animated.onChange(
      callbackNode.current,
      Animated.block([
        Animated.cond(
          Animated.greaterOrEq(callbackNode.current, 1),
          Animated.set(
            callbackNode1.current,
            Animated.add(Animated.multiply(-10, callbackNode.current)),
          ),
          /* Animated.call([], () => {
           *   onClose.current && onClose.current();
           * }), */
        ),
      ]),
    ),
    [onClose],

function useStickyHeaderPositioning({
  headerHeight,
  scrollOffsetY,
  headerOffsetY,
  contentHeight,
  layoutHeight,
}: {
  headerHeight: Animated.Node
  scrollOffsetY: Animated.Node
  headerOffsetY: Animated.Value
  contentHeight: Animated.Node
  layoutHeight: Animated.Node
}) {
  const lockHeaderPosition = useAnimatedValue(1)

  Animated.useCode(() => {
    // scrollDiff is the amount the header has scrolled since last time this code ran
    const scrollDiff = Animated.diff(scrollOffsetY)

    const headerIsNotFullyUp = Animated.neq(headerOffsetY, negative(headerHeight))

    const nearTheTop = Animated.lessOrEq(scrollOffsetY, headerHeight)

    const amountScrolledUpward = new Animated.Value(0)
    const upwardScrollThresholdBreached = Animated.greaterOrEq(amountScrolledUpward, 400)

    // this is the code which actually performs the update to headerOffsetY, according to which direction
    // the scrolling is going
    const updateHeaderOffset = Animated.cond(
      Animated.greaterThan(scrollDiff, 0),
      [
        // y offset got bigger so scrolling down (content travels up the screen)

const delta = type === 'vertical' ? dragY : dragX;

  // `totalDimension` on the container view is required for android layouts to work properly
  // otherwise translations move the panHandler off of the screen
  // set the total width of the container view to the sum width of all the screens
  const totalDimension = multiply(dimension, numberOfScreens);

  function handleLayout({ nativeEvent: { layout } }: LayoutChangeEvent) {
    layout.width !== width && setWidth(layout.width);
    layout.height !== height && setHeight(layout.height);
  }

  const TYPE = type === 'vertical' ? VERTICAL : HORIZONTAL;

  // it's important to use dimension as an animated value because the computations are memoized
  Animated.useCode(
    cond(
      // dimension already set to last layout
      or(eq(dimension, width), eq(dimension, height)),
      [],
      [cond(eq(TYPE, VERTICAL), set(dimension, height), set(dimension, width))]
    ),
    [width, height]
  );

  // props that might change over time should be reactive:
  const animatedThreshold = useAnimatedValue(threshold);
  const clampDragPrev = useAnimatedValue(clampDrag.prev, REALLY_BIG_NUMBER);
  const clampDragNext = useAnimatedValue(clampDrag.next, REALLY_BIG_NUMBER);
  const animatedMaxIndex = useAnimatedValue(maxIndex);
  const animatedMinIndex = useAnimatedValue(minIndex);

deps: any[] = [],
): AnimationBag {
  // TODO: Find better way to stop/reset animation
  const [count, stop] = useReset();

  const depsToUse = [...deps, count];

  const { play, values, animation, transition } = useMemo<
    Animation
  >(() => {
    const animation = config();

    return generateTweenAnimation(animation);
  }, depsToUse);

  A.useCode(animation, depsToUse);

  return {
    play,
    stop,
    values,
    transition,
  };
}

function useStickyHeaderPositioning({
  headerHeight,
  scrollOffsetY,
  headerOffsetY,
  contentHeight,
  layoutHeight,
}: {
  headerHeight: number
  scrollOffsetY: Animated.Node
  headerOffsetY: Animated.Value
  contentHeight: Animated.Node
  layoutHeight: Animated.Node
}) {
  const lockHeaderPosition = useAnimatedValue(1)
  Animated.useCode(
    () => {
      // scrollDiff is the amount the header has scrolled since last time this code ran
      const scrollDiff = Animated.diff(scrollOffsetY)

      const upwardVelocityBreached = Animated.lessOrEq(scrollDiff, -SHOW_HEADER_VELOCITY)
      const headerIsNotFullyUp = Animated.neq(headerOffsetY, -headerHeight)

      const nearTheTop = Animated.lessOrEq(scrollOffsetY, headerHeight)

      // this is the code which actually performs the update to headerOffsetY, according to which direction
      // the scrolling is going
      const updateHeaderOffset = Animated.cond(
        Animated.greaterThan(scrollDiff, 0),
        [
          // y offset got bigger so scrolling down (content travels up the screen)
          // move the header up (hide it) unconditionally

const keys = useMemo(
    () => {
      return Object.keys(props)
    },
    [props]
  )

  const vals = useMemo(
    () => {
      return keys.map(k => props[k])
    },
    [keys]
  )

  Animated.useCode(
    () =>
      Animated.cond(Animated.neq(epoch, lastEpoch), [
        Animated.set(lastEpoch, epoch),
        Animated.call([...vals], vs => {
          const cb = readCallback.current
          readCallback.current = null
          result.current = null
          cb(
            keys.reduce(
              (acc, k, i) => {
                acc[k] = vs[i]
                return acc
              },
              {} as any
            )
          )

const reset = useMemo(
    () =>
      block([
        set(scale, 1),
        set(focusImageX, 0),
        set(focusImageY, 0),
        set(pinchX, 0),
        set(pinchY, 0),
        set(panX, 0),
        set(panY, 0),
      ]),
    [],
  )

  Animated.useCode(
    () =>
      block([set(maxX, Animated.max(sub(multiply(width / 2, scale), boxWidth / 2), 0)), set(minX, multiply(-1, maxX))]),
    [width, boxWidth],
  )

  Animated.useCode(
    () =>
      block([
        set(maxY, Animated.max(sub(multiply(height / 2, scale), boxHeight / 2), 0)),
        set(minY, multiply(-1, maxY)),
      ]),
    [height, boxHeight],
  )

  const x = useMemo(() => add(pinchX, panX), [])
  const y = useMemo(() => add(pinchY, panY), [])

const keys = useMemo(
    () => {
      return Object.keys(props)
    },
    [props]
  )

  const vals = useMemo(
    () => {
      return keys.map(k => props[k])
    },
    [keys]
  )

  Animated.useCode(
    () =>
      Animated.cond(Animated.neq(epoch, lastEpoch), [
        Animated.set(lastEpoch, epoch),
        Animated.call([...vals], vs => {
          const cb = readCallback.current
          readCallback.current = null
          result.current = null
          cb(
            keys.reduce(
              (acc, k, i) => {
                acc[k] = vs[i]
                return acc
              },
              {} as any
            )
          )

export function useNativeValue(node: Animated.Node, init: number): number {
  const [state, setState] = useState(init)
  Animated.useCode(() => Animated.call([node], ([val]) => setState(val)), [])
  return state
}