houdini
houdini copied to clipboard
Relay-like @plural directive
Discussed in https://github.com/HoudiniGraphql/houdini/discussions/239
Originally posted by mhzokaii March 22, 2022 Hi!
First of all, your work is really great, congrats.
The @relay (plural: true)
directive defined in Relay, is very helpful in reducing the amount of work required for passing the data down to the sub-components. I couldn't find a similar way in Houdini. Am I missing something? Is it planned to be implemented? Or even maybe you see it as an anti-pattern? Should the @list
directive be used (and if yes, how can it be used in fragment
definitions)?
Hey,
as I've run into the same use case (and seem to be unable to figure out a solution where I basically have a SomeList
Svelte component which is supposed to take an array of the type created by the fragment
and handle individual items further), I thought I'd give it a shot. However, I can't figure out how to start the example project. yarn generate
fails every time:
/tmp/houdini/example $ yarn generate
Usage Error: Couldn't find the node_modules state file - running an install might help (findPackageLocation)
$ yarn run [--inspect] [--inspect-brk] [-T,--top-level] [-B,--binaries-only] <scriptName> ...
I've done the yarn && yarn build
before on the top-level dir. Any ideas what goes wrong there?
Running an install
doesn't help as it will install houdini 0.15.5 into the node_modules
folder of the example instead of using the changed code I'm trying to play with.
yarn is version 3.2.0, node is 18.7.0, just in case that's relevant.
👋 hey there! so i'll be honest, I haven't run the example application in awhile since I've been using the integration tests as my sandbox. Are you able to run that project? It's a sveltekit project so yarn dev
should be all it takes.
You could also just let it install the old version, delete it, and replace it with a symlink to your local directory
The symlink approach fails on yarn generate
with node being unable to load the graphql
module in cmd.js
. However, copying the directory worked for a preliminary test.
Now I'm thinking about the correct way to design the interface. I'd assumed something like this:
export function fragment<_Fragment extends Fragment<any>>(
fragment: GraphQLTagResult,
ref: _Fragment[] | null
): Result<_Fragment>[]
A single fragment (with the @plural
directive) with an array of references which should result a set of results. Would that be in the right direction? If yes: I'd be happy about a few pointers on how to implement the actual data access.