Task #3801, Stage #17 - Vocabulary Builder app

Let’s work on the Words container, which should return two SafeAreaView items.
The first with styles: flex - 1,backgroundColor - colors.blue1, and the second: flex - 0, backgroundColor - colors.blue1.
Further, all items will be added to the first SafeAreaView.
First, add a NavigationHeader. After that, the header - the View with two child buttons, TouchableOpacity, back and delete.
Header styles are: backgroundColor - colors.blue1, height - 50, flexDirection - row, justifyContent - space-between,
alignItems - center, paddingHorizontal - 26.
Back button styles are: flex - 8, flexDirection - row, alignItems - center. Clicking on it should trigger the navigation.goBack method.
Delete button styles are : flex - 2, justifyContent - center, alignItems: flex-end.
Inside the back button add an Icon component with properties color - colors.black, size - 20 and name - left-open-big.
After the icon there should be a route.params text with styles: fontSize - 18,
color - colors.black, fontFamily: RobotoRegular, marginLeft: 14.
Inside the delete button add the Icon component with the properties color - colors.black, size - 20 and name - trash.
After the header add a FlatList element whose keyExtractor will return the element’s wordset_id property.
After the list add the component RadialButton, when you click on it, you will go to the screen ADD_WORD_SCREEN.
When passing, you must add the listKey parameter equal to route.params.

This task is part of the Full-Stack JavaScript Course.
If you have any issues with it, you can ask for community help below the post.
Feel free to help others if you’ve already solved the task.