array (list) input - Githubissues

lkleuver commented 4 years ago

my schema has the following input: coordinates: [Float!]! but it seems the explorer only looks at the leaf argument type. (unwrapInputType)

Am I missing something, or is there perhaps work in progress before I start implementing it?

FluorescentHallucinogen commented 4 years ago

@lkleuver PTAL at https://github.com/OneGraph/graphiql-explorer/issues/10#issuecomment-567901798. :wink:

sgrove commented 4 years ago

@lkleuver We indeed haven't implemented array support yet - definitely a fundamental omission! if you're looking to take a crack at this, it'd be a great help!

baohouse commented 4 years ago

I'm taking a look at this. How do we want to annotate array inputs? Was thinking of using square brackets after the field name.

FluorescentHallucinogen commented 4 years ago

@baohouse Are you working on a pull request?

Was thinking of using square brackets after the field name.

PTAL at my vision: https://github.com/OneGraph/graphiql-explorer/issues/10#issuecomment-567901798. It's highly inspired by Chrome DevTools.

Looks like using curly braces for objects (non-leaf fields that has childs) is also a good idea. PTAL at https://github.com/OneGraph/graphiql-explorer/issues/10#issuecomment-590539831.

FluorescentHallucinogen commented 4 years ago

Also it would be really nice to visually separate the input fields (arguments) from the output (asked) fields by placing input fields into round brackets. But this may out of scope of this pull request.

baohouse commented 4 years ago

@FluorescentHallucinogen Ah yes, it's a high priority for one of our customers, so, I am taking a stab at it. Thanks for pointing to the vision, I have a clear idea now. I also see where to start working https://github.com/OneGraph/graphiql-explorer/blob/2786cab7b9ede1c9846edd5d84be315cfa41a95f/src/Explorer.js#L728

FluorescentHallucinogen commented 4 years ago

@baohouse Any progress?

baohouse commented 4 years ago

@FluorescentHallucinogen Yeah, I have a sense of how it all works together. I'm still far from completing it per the vision. Here's the tasklist:

[X] core functionality (just to get things working; the basic UX is there, but will be eventually be replaced)
- [X] insert new element at end of list
- [X] remove element (by unchecking the element's checkbox, though this will eventually be replaced with drag handles, with remove being in the floating action bar)
[ ] action bar (floating to the right of the element)
- [ ] insert after a given element
- [ ] duplicate element
- [ ] remove element
[ ] reorder element by drag-and-drop
[ ] support scalar elements
[X] support object elements
[ ] restoring field-list back to previous list if unchecking and then rechecking it
[ ] allow collapsing of list without removing elements (essentially hiding details, rather than default behavior of removing the field)
- [X] add checkbox in front of field-list
[ ] put square brackets surrounding list elements (opening square bracket on the same line as the field-list name, and the closing square bracket on a new line following the last element)

TimLehner commented 4 years ago

@baohouse I am very interested in this. Please let me know if I can be of assistance. I am especially interested how this would integrate with custom graphql scalars (see my branch and PR #47)

FluorescentHallucinogen commented 4 years ago

@baohouse Could you please create a WIP pull request?

allow collapsing of list without removing elements (essentially hiding details, rather than default behavior of removing the field)

BTW, this is what annoys me in the Explorer. If I open rotating triangle, Explorer adds this to the query. What if I want to just see what's inside without adding this to the query? So it would be really nice to change this behavior in Explorer globally. This may out of scope of this pull request. But we should provide consistent behavior in Explorer.

add checkbox in front of field-list

What about checkboxes in front of list item fields, not in front of list field?

IMO, we should preserve leading checkboxes for "insert all child fileds" feature i.e. check all nested checkboxes at once automatically and then manually uncheck only unnecessary instead of check them only one by one manually (this is very useful for types with a large number of fields).

See detail explanation how this might works: https://github.com/OneGraph/graphiql-explorer/issues/10#issuecomment-491268985.

BTW, this implies the need of a third "indeterminate" state for checkboxes in addition to "unchecked" and "checked" (if not all child checkboxes checked).

See package, bundlephobia and downloads fields on the image here: https://github.com/OneGraph/graphiql-explorer/issues/10#issuecomment-481835887.

FluorescentHallucinogen commented 4 years ago

I see this pull request grows like a snowball…

@baohouse Feel free to drop (throw out) advanced features like "duplicate element" and "reorder element by drag-and-drop".

Please let me know if I can help in some way too. ;)

TimLehner commented 4 years ago

IMO, we should preserve leading checkboxes for "insert all child fileds" feature i.e. check all nested checkboxes at once automatically and then manually uncheck only unnecessary instead of check them only one by one manually (this is very useful for types with a large number of fields).

Note this behaviour is currently possible (though not intuitive): ALT+Click on a field should select all properties 1 level deep (including non-leaf properties and any required arguments)

FluorescentHallucinogen commented 4 years ago

@TimLehner

Note this behaviour is currently possible (though not intuitive): ALT+Click on a field should select all properties 1 level deep (including non-leaf properties and any required arguments)

I know about this. But currently it has low feature discoverability. How users learn about this hotkey?

TimLehner commented 4 years ago

@FluorescentHallucinogen

I know about this. But currently it has low feature discoverability. How users learn about this hotkey?

I agree this is not well advertised or intuitive at all. Aside from reading the source I am not sure how you would be expected to discover this feature, which is a shame

sgrove commented 4 years ago

It's intended. You should not be selecting all fields by default. If you know that - and the implications of it - and still want to do it, then you probably have searched enough and found out how to do so.

On Sat, Apr 25, 2020 at 6:34 AM Timothy Lehner notifications@github.com wrote:

@FluorescentHallucinogen https://github.com/FluorescentHallucinogen

I know about this. But currently it has low feature discoverability. How users learn about this hotkey?

I agree this is not well advertised or intuitive at all. Aside from reading the source I am not sure how you would be expected to discover this feature, which is a shame

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/OneGraph/graphiql-explorer/issues/32#issuecomment-619380480, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAITYGHXQPXN52GCUBQE4TROLRFXANCNFSM4JRVQZZQ .

FluorescentHallucinogen commented 4 years ago

@sgrove

you probably have searched enough and found out how to do so.

But it's not documented anywhere. ¯_(ツ)_/¯

If I create pull request that implements behavior described in https://github.com/OneGraph/graphiql-explorer/issues/10#issuecomment-491268985 (clicking on the rotating triangles and field names still only expand child fields without checking (inserting) them), will you merge it?

baohouse commented 4 years ago

@FluorescentHallucinogen I'll work on migrating my work onto a clean branch off the master. I realized that not only I was working off an older version of the file, but also a Flow-to-Typescript translated file that I did for the purpose of dropping it into my app's codebase.

FluorescentHallucinogen commented 4 years ago

@baohouse Any news?

FluorescentHallucinogen commented 4 years ago

@baohouse Any progress? Do you need any help?

baohouse commented 4 years ago

@FluorescentHallucinogen Sorry, I've been swamped with work. I don't think I'll have time to properly merge in changes. The first problem was that I had converted the GraphiQL file into Typescript for my app, and "undoing" those changes to isolate the feature-specific ones was tedious. Can I send you a copy of the file in its current state?

FluorescentHallucinogen commented 4 years ago

@baohouse