quick-feed
quick-feed copied to clipboard
Create context for global app state
Suggestion :
As the app is starting to grow and we are welcoming new features, I suggest to add React's Context to handle global data to avoid using props on multiple hierarchy levels. We could also by the same occasion export the getFeed method to another file so all component have access to it. This way, we would avoid passing getFeed as props to every component.
In order to achieve this, we need to :
- Create the context
- Use an initial state with these data : the user's currently displayed feed , the user's previous feeds, the user's favorite feeds, the fetching state of the feed, and the error indicator. We suggest this format for the initial state :
const initialState = {
currentFeed: {
episodes: [],
program_title: '',
program_image: '',
program_description: '',
program_link: ''
},
onFetching: false,
previousFeeds: [],
error: false,
favoriteFeeds: [],
};
- Create the corresponding reducers to update the state (add, remove)
- Export the getFeed method to another file to avoid sharing the method via props on too many hierarchy levels
Instead of using Context introducing a state management library will help in the future .