Animation not keeping open state when freezeOnBlur is active

[shanoysinc]

whenever i leave the current screen and come back the accordion is close. Would love if someone could help me here
"@react-navigation/native": "^6.1.6",
"@react-navigation/native-stack": "^6.9.12",
"react-native-reanimated": "~3.16.1",

`

   <Tab.Navigator
    screenOptions={{
      tabBarStyle,
      tabBarLabel: () => null,
      header: () => null,
      **freezeOnBlur: true,**
    }}
    sceneContainerStyle={sceneContainerStyle}
    tabBar={(props) => <CustomBottomTabItems {...props} />}
  >

 


import React, { useCallback, useLayoutEffect, useState } from "react";
import { StyleSheet, View, Pressable } from "react-native";
import Animated, {
  Easing,
  useAnimatedStyle,
  useDerivedValue,
  withSpring,
  useSharedValue,
} from "react-native-reanimated";
import { Octicons } from "@expo/vector-icons";
import { LeanText, LeanView } from "./LeanReactNative";
import { fontSize, mainFont } from "../../lib/font";
import { useSettingsStore } from "../../zustand/settings";
import useColorMode from "../../hooks/useColorMode";
import colors from "../../styles/colors";
import { mmkvStorage } from "../../lib/storage/mmkv";

function AccordionItem({ isExpanded, children, viewKey, style = {} }) {
    const height = useSharedValue(0);
    const animatedHeight = useDerivedValue(() =>
      isExpanded.value ? height.value : 0
    );
  
    const bodyStyle = useAnimatedStyle(() => ({
      height: withSpring(animatedHeight.value, {
        damping: 20,
        stiffness: 130,
      }),
    }));
  
    return (
      <Animated.View
        key={`accordionItem_${viewKey}`}
        style={[styles.animatedView, bodyStyle, style]}
      >
        <View
          onLayout={(e) => {
            height.value = e.nativeEvent.layout.height;
          }}
          style={styles.wrapper}
        >
          <LeanView className="w-full">{children}</LeanView>
        </View>
      </Animated.View>
    );
  }

`