array (list) input

[lkleuver]

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]

@lkleuver PTAL at #10 (comment). 😉

[sgrove]

@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]

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]

@baohouse Are you working on a pull request?

Was thinking of using square brackets after the field name.

PTAL at my vision: #10 (comment). 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 #10 (comment).

[FluorescentHallucinogen]

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]

@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

graphiql-explorer/src/Explorer.js

Line 728 in 2786cab

/* TODO: handle List types*/

[FluorescentHallucinogen]

@baohouse Any progress?

[baohouse]

@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:

• core functionality (just to get things working; the basic UX is there, but will be eventually be replaced)
  • insert new element at end of list
  • 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
• 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)
  • 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]

@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]

@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: #10 (comment).

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: #10 (comment).

[FluorescentHallucinogen]

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]

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]

@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?