JavaScript

Let’s work on the AddingListOrWord container. This screen will have one input field, and the entered value will need to be stored somewhere. Use useState for this. The AddingListOrWord container itself must return a SafeAreaView with styles:...

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....

Let’s work on the redux methods. But first, let’s add the required constants to the src/external/redux/constants file. API, FETCH_WORD_ENDPOINT, ADD_WORD, SET_ERROR, SET_LOADING - the value of all constants is equal to their name....

The data needs to be stored somewhere. To do this, let’s use the @react-native-async-storage/async-storage library. Let’s write two functions to save and read data in the functions.js file at the root of the project....

Now let’s add some starter code for the redux store. Install the redux, react-redux and redux-thunk libraries. In the src/external/redux/constants.js file create three constants ADD_LIST, LISTS, WORDS. The meaning of each constant must be the same as its name....

Let’s add the required constants to the file src/external/redux/constants. DELETE_LIST, DELETE_WORD - the value of all constants is equal to their name. Export two more functions from src/external/redux/actions: deleteWord, deleteList....

Add the constant SET_STORAGE_DATA to src/external/redux/constants, equal to its name. Add the readAsyncStorage function to the src/external/redux/actions file and export it. This method should return an asynchronous function with one dispatch argument....

Functions deletelistresult, deletewordresult, addlistresult, addwordresult should be exported from the src/external/redux/helpers file. deleteListResult must get a state and list to delete as arguments. This method must return the updated state, filtering the lists LISTS and WORDS....

Improve the reducer. By default, it must return the initial state. The case ADD_LIST should call the addListResult method, the case ADD_WORD: addWordResult. Cases DELETE_LIST and DELETE_WORD - deleteListResult and deleteWordResult, respectively....

You need to create folders: src/containers/Words/Word, src/containers/Words/Word/Details, src/containers/Words/Word/Option. In each bottom, you need index.js file to create the appropriate components. Let’s start with the Option component. It must return the Text element....