Skip to content

Conversation

rynobax
Copy link
Contributor

@rynobax rynobax commented Oct 2, 2018

I keep trying to do this and it doesn't work, so I thought I would implement it 🙂

gql-playground-sortable

Two questions about the implementation details:

  • In chrome the new tab button disappears when you are dragging tabs, so that's how I implemented it here. However the playground tab is a little more visible, so I was thinking about maybe leaving it visible and making it the right border of the draggable area. Anyone have thoughts on what looks best?
  • In chrome dragging a tab also makes it the active tab. I was having trouble getting the dragged tab to look "active". I think I know how I could do it, but I'm not sure how much people expect this behavior, so I thought I would ask first if it should be implemented.

Also, the snapshot tests are failing. Should I go ahead and update them in the PR?

@CLAassistant
Copy link

CLAassistant commented Oct 2, 2018

CLA assistant check
All committers have signed the CLA.

@huv1k
Copy link
Collaborator

huv1k commented Oct 3, 2018

Wow! Nice work, I really like it. I tested and its working nicely. The whole topbar needs little bit change, because currently there is a problem with tabs when they overflow on the right side. It would require to rethink it more. In my opinion, it should change to active tab because you want to "do" something with that tab.

@rynobax
Copy link
Contributor Author

rynobax commented Oct 3, 2018

Added two fixes:

  • Dragging a tab will cause it to be active
  • If you have enough tabs to make the tab bar scrollable, it will scroll if you drag a tab towards the edge

I think this is good to go, but let me know if you think of anything else that should be changed.

@huv1k huv1k merged commit 8619d6f into graphql:master Oct 15, 2018
@huv1k
Copy link
Collaborator

huv1k commented Oct 15, 2018

Thanks for your first contribution! It will be in next release 🚀

RenovZ pushed a commit to RenovZ/graphql-playground that referenced this pull request Mar 25, 2022
* Make tabs sortable

* Change tab selection from onClick to onMouseDown

* Allow scrolling of tabbar while sorting tabs
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants