Resolves #11 improve performance around search logic

[bwanamaina]

This PR aims to improve performance and separate search logic from the main application entry point(components) into custom hook(s). Currently search is triggered on every keystroke and the current results (UI) is replaced by skeleton and timeout is used to control the UI, this can be improved.

Proposal

• Extract Search input into a separate component.
• Debounce the search input onChange logic using a custom timed hook to ensure search is performed for a term instead of triggering it on every keystroke.
• Extract search logic into a custom hook and remove the setTimeout when filtering banks.
• Instead of showing skeleton when searching, highlight the matched search in the bank name/branch (this is optional but serves the purpose of showing user that filtering is happening as the type).

[bwanamaina]

That's totally fine with me, you can pull it down and interact with it abit, In case you need me to make any changes I'll gladly do.

[KWangechi]

I am having an issue with the resolution of the path on local env...

So not sure what's going on

[bwanamaina]

Could be an issue with webpack, after pulling latest changes, did you restart your dev server ? if not try kill the session and run npm start