Feat: Highlight Query Not Saved Changes

[WaseemMansour]

Fixes

#2425

Checks

• [ ] Ran yarn test-build
• [ ] Updated relevant documentations
• [ ] Updated matching config options in altair-static

Changes proposed in this pull request:

• Added logic to check if query editor content does not match the query saved in the collection.
• If not matching, highlight the Save Button in a different color.

[imolorhe]

@WaseemMansour thanks for picking this up! I like the direction you're going with this. However I was thinking about this and I think we will want to move the logic for calculating the "unsaved" state into a selector in the store (here are some tips on creating parameterized selectors). The reason for this is that we will want to use the logic in the window tabs (which is outside the window component) as well to show an indicator that it is unsaved.

Additionally, the save button contains multiple actions in a dropdown so changing it may not reflect what we want. Preferably we would want to disable the dropdown menu item that performs the save action instead. I can think of splitting out the dropdown menu into individual buttons to make it better.

[WaseemMansour]

Thanks for this good feedback @imolorhe, Actually this makes sense. I will work on this. and hopefully, get it done :).