How do I get the id from a post in a function in react-navigation v5 like this?

I'm trying to get the id for the post that I used to get using react-navigation v4 like this:

This is my index Screen

1import React, { useContext } from 'react';
2import { View, Text, StyleSheet, FlatList, Button, TouchableOpacity } from 'react-native';
3import { Context } from '../../context/BlogContext'; 
4import { Feather } from '@expo/vector-icons';
5
6const IndexScreen = ({ navigation }) => {
7  const { state, addBlogPost, deleteBlogPost } = useContext(Context);
8  return (
9    <View style={styles.container}>
10    <Button title="Add Post" onPress={addBlogPost} />
11      <FlatList
12        data={state}
13        keyExtractor={blogPost => blogPost.title}
14        renderItem={({ item }) => {
15          return (
16            <TouchableOpacity onPress={() => navigation.navigate('Show', { id: item.id })}>
17              <View style={styles.row}>
18                <Text style={styles.title}>{item.title} - {item.id}</Text>
19                <TouchableOpacity>
20                  <Feather style={styles.icon}
21                    name="trash"
22                    onPress={() => deleteBlogPost(item.id)}
23                  />
24                </TouchableOpacity>
25              </View>
26            </TouchableOpacity>
27          );
28        }}
29      />
30    </View>
31  );
32 }
33
34IndexScreen.navigationOpitions = () => {
35  return {
36    headerRight: () => (
37      <TouchableOpacity onPress={() => navigation.navigate('Create')}>
38        <Feather name="plus" size={30} />
39      </TouchableOpacity>
40    ),
41  };
42}
43
44const styles = StyleSheet.create({
45  row: {
46    flexDirection: 'row',
47    justifyContent: 'space-between',
48    paddingVertical: 15,
49    paddingHorizontal: 10,
50    borderTopWidth: 1,
51    borderBottomWidth: 1,
52    borderColor: 'grey'
53  },
54  title: {
55    fontSize: 18,
56  },
57  icon: {
58    fontSize: 24,
59    color: '#ff2222'
60  }
61});
62
63export default IndexScreen;
64

and now, my Show Screen where I used to get the blog post using state.find (blogPost => blogPost.id === navigation.getParam('id')) as shown in line 10.

1import { useNavigation } from '@react-navigation/native';
2import React, { useContext } from 'react';
3import { View, Text, StyleSheet } from 'react-native';
4import { Context } from '../../context/BlogContext';
5
6const ShowScreen = ({  navigation }) => {
7  const navigation = useNavigation();
8  const { state } = useContext(Context);
9
10    const blogPost = state.find (blogPost => blogPost.id === navigation.getParam('id'));
11
12      return (
13        <View>
14           <Text>{blogPost}</Text> 
15        </View>
16      );
17};
18
19const styles = StyleSheet.create({});
20
21export default ShowScreen;
22

Now I'm not using the react-navigation v4 anymore, I'm using v5 instead, but I'd like to get the blogPost inside of the text line on line 14. What I should I do to get it?

const ShowScreen = ({ route, navigation }) => {
const { state } = useContext(Context);
const {id} = route.params;

      return (
        <View>
           <Text>{id}</Text> 
        </View>
      );
};

For more information check react navigation docs