So the number on which we texted last time should appear on the top.
As of now, the oldest number is getting displayed on top and the latest one at the very end.
We need to reverse it and display

There should be a confirmation alert before deleting all contacts.

Feature: Add time and date in number history

I can do it

that will save us about 80 lines of code in App.js
Happy to do it

When name is different then the same number can be saved multiple times like this:

Refactor: moving form to its own component

So if I save a contact already with a name like ABC, then the program should not allow me to save the contact with the same name.

input tag for phone number should only allow numbers as input

There should be an alert for confirmation before deleting the full history.

Feature: Displaying contact name in the history. if not in contacts adding "save contact" button

Refactor: moving history to its own component

Not everyone will know you just need to click outside to abort deletion.

Kinda already done it on my end. let me know if I should submit PR

There should be a copy button in contact so we can click on it to copy the number in the clipboard.

History only displays the contact number. It would be a great idea if we can display the contact name if that number is already saved in contacts.

It would be better if the default react tab icon is replaced with a different icon.

There should be a confirmation prompt before all contact gets deleted.

displaying the contacts in alphabetical order will make it easier for users to find the contact

There should be an option to delete a specific history.

Even if we click on the chat of saved contact that should get added to history.

Showing the entire history is not required. Just showing up the last 10 contact histories should be enough. A load more button could be added to get the entire history.

Hi @Vishesh-Pandey ,

I would love to move from all those useState's to one neat useReducer.
Is it ok if I do it?

Thanks!

So there are two error statements
1 - Number already exist and
2 - Name already exist

We can handle both of these errors using a single useState.
So showing one of the errors at a time will be enough.

Multiple errors getting displayed even when the name is unique.