search

warrenday / graphql-network-inspector

A better network inspector for viewing and debugging GraphQL requests.
MIT License
466 stars 46 forks source link

Improve user experience #77

Closed dhavall08 closed 3 months ago

dhavall08 commented 1 year ago

This is a really helpful extension to see the names of queries. I've been using this for some time. However, if we have the following things then it can improve the overall dev experience.

  1. When the query/mutation is selected, It would be nicer to have setting to keep the close icon (x) on the left side. Similar to what we have in the Network tab which makes it easier to close or navigate to the list page.
  2. Can we have the query variables in "Request payload" at the top? More often the queries are constructed with fragments and it is longer, if we want to only check the requested variables in query then we need to scroll all the way to the bottom. However, if it seems depend on personal preference, good to have a setting to modify it.
  3. Can't easily distinguish Query and Mutation without looking at icon symbol, It would be great if the swapping of foreground and background colors are possible for icon.
  4. The more we have similar look of Chrome's network tab, the more it feels easier. (like bg color, formatting, indentation etc.)
warrenday commented 1 year ago

Hey @dhavall08 thanks for commenting on the extension. I'm happy to hear you're getting value from it.

There are some great comments here and some quick wins I think we can add. Totally agree on the look and feel. I've tried to get close to the look of the standard network inspector without making it a complete clone.

I'll start by moving the cross and adding an option to re-order query/variables.

dhavall08 commented 1 year ago

Okay. Thanks for considering it @warrenday.