Sync url and params tab

[CH1NRU5T]

Describe the bug/problem
Syncing of url and params tab

Steps to Reproduce the bug/problem

1. After opening the app, paste https://api.foss42.com/country/data?code=US in the url field
   

Expected behavior

1. If we paste a url which has parameters in it, it should be synced with params tab
   
2. If we add params in the params tab, they should get added in the url.

Device Info (The device where you encountered this issue):

• OS: MacOS
• Version: Sonoma 14.3.1

[animator]

Yes this syncup should be added to API Dash

[YoussefMoRabie]

@animator I would like to work on this.
Can you assign it to me?

[mohnishdeshpande]

@animator I reckon I have figured out a way to fix this. Will finish the implementation and submit a PR after testing.

[ashitaprasad]

@Yousef-Rabia We do not assign issues. You are free to work on it and send across a PR.

[ashitaprasad]

Sure @mohnishdeshpande.

[mohnishdeshpande]

@ashitaprasad Please see the 'Note' in the PR description regarding 'kNameValueEmptyModel'. Cheers!

[ashitaprasad]

We had a thorough discussion regarding the approach. And we want to focus on user experience and keep it easy to use for the end user who should be able to view/edit the API endpoint without any difficulty. Adding URL parameters in the URL field hampers the readability and makes editing difficult.
Proposed solution:

• Have a separate URL preview section under the URL card (simple text with small font size with copy button) which shows the final url including all the query parameters. Users should be able to turn it off via Settings. Any query params entered in the row will automatically update the URL preview.
• Now, coming to the point - what happens when a user pastes a url with query params or adds a query param in the url field. It should automatically get removed and should get added as a row(s) in the URL parameter section. Note, the URL previewer will show the the full URL including the query params.

cc: @mohnishdeshpande @amankumarmahavar @Tanish2002