How to send params with navigation correctly?

I'm using navigation.navigate to move between screens but I face the following problem.

I call the method to navigate:

const FileCard = ({ fileDetails }: Props) => {  const navigation = useNavigation();  const loadDetails = () => {    console.log(JSON.stringify(fileDetails));    navigation.navigate("FileDetailScreen" as never, {file:     fileDetails} as never)  }

And I would like to connect with this screen:

interface Props {    file: FileInfo  }const FileDetailScreen = ({ file }: Props) => {  return (<View style={globalStyles.post_login_container}><Text>          {              (file) ?<Text>Exists</Text>              :<Text>Does not exists</Text>          }</Text></View>  )}

But I get "Does not exists" in my screen, so I can't show the information.

How can I fix this problem? Thanks!

EDIT

I call the loadDetails function here:

<TouchableOpacity      activeOpacity={0.8}      onPress={() => {loadDetails(fileInfo)}}>    // Elements and styles</TouchableOpacity>

And this is my stack navigation:

<Stack.Navigator    screenOptions={{        headerShown: false,        cardStyleInterpolator: CardStyleInterpolators.forFadeFromBottomAndroid    }}><Stack.Screen name="LoginScreen" component={LoginScreen} /><Stack.Screen name="RegisterScreen" component={RegisterScreen} /><Stack.Screen name="ControlScreen" component={ControlScreen} /><Stack.Screen name="ProfileScreen" component={ProfileScreen} /><Stack.Screen name="FilesScreen" component={FilesScreen} /><Stack.Screen name="UploadFileScreen" component={UploadFileScreen} /><Stack.Screen name="SearchScreen" component={SearchScreen} /><Stack.Screen name="ResultsScreen" component={ResultsScreen} />// THE SCREEN<Stack.Screen name="FileDetailScreen" component={FileDetailScreen} /></Stack.Navigator>