Should prevent unnecessary re-renders

Currently, I see so many unnecessary re-render of un-touched components. This should be improved.
IMO, I think the main reason is the wrong way usage of the custom hooks as well as react-query. Need to investigate more on this. 