Add a settings dialog that takes an input and allows users to try the app with their HASHNODE blog URL

[esteecodes]

Describe the solution you'd like

Minor setup - settings dialog

• in the main header component add another control with the gear icon
• to be placed between the theme control and search
• to have a class of settings
• on click to open up a new modal created in the partials folder named settings-dialog
• the settings dialog should have a brief text explaining that users can try the live demo with their own Hashnode Blog URL
• it should have conditional rendering to show an input and a change button if the blog url has not been changed
• if the url is the default another view should show with a reset button
• the input should be connected to a [(ngModel)] to collect the value

Now the actual task

• update every query in the graphql.operations.ts to take a host parameter which is going to be the blog URL
• remove the ${BLOG_HOST} variable from that file
• update every method within the blogService to take the host parameter
• add an initial value for blogURL
• add a set url and get url methods in the blogService that set userBlogURL in local storage
• update every component where the blogService is used to add the host parameter
• add an on click event for the change button to call a method in the blogService and set the user input in local storage
• add an on click event for the reset button to call a method in the blogService that clears the item from local storage
• test the functionality by changing the blog url and troubleshoot if needed, make sure everything works fine
• have a look for things that do not display right and add new issues

This functionality is intended only for existing Hashnode Blogs