Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How do I use createSubscription? #1

Open
ohmree opened this issue Jul 18, 2021 · 4 comments
Open

How do I use createSubscription? #1

ohmree opened this issue Jul 18, 2021 · 4 comments

Comments

@ohmree
Copy link

ohmree commented Jul 18, 2021

Hi, thanks for making this!

There are zero examples or docs other than the readme, and after quite a bit of fiddling around I still can't get subscription updates to display in real-time.

Now this might also be an issue with my backend or my understanding of subscriptions (or both), but I'd like to make sure I'm not doing something wrong here.

Here's my demo component, to render it I'm using a Provider with a properly set-up Client (using subscriptions-transport-ws and this adapter for absinthe).

I'd expect result.data to have a meaningful value eventually, but it's always undefined.

const vodsSub = `
  subscription VodAdded {
    vodAdded {
      id
      title
    }
  }
`;

const VodsList: Component = () => {
    function handleSubscription(vods = [], response: any) {
        console.log(response)
        return [response.newVods, ...vods];
    };


    const [result, _executeSubscription] = createSubscription({query: vodsSub}, handleSubscription)
    // What do I do with executeSubscription?
    return (
        <Show when={result.data} fallback={<p>Loading...</p>}>
            <ul>
                {result
                    .data
                    ?.map(({ title, id }: any) => (<li>{title}: {id}</li>))}
            </ul>
        </Show>
    )
}

The names for the gql stuff should be correct, since GraphiQL auto-completes them, which means at least the server knows about the subscription, what a vod is etc.

Sorry if this isn't the most informative issue description, I can add more info if it's needed.

EDIT: I found an alternative solution for connecting my backend to my frontend and now I can subscribe to mutations from GraphiQL just fine, everything works as expected.

The only thing I'm struggling with ATM is doing the same from solid-urql so any help with that would be appreciated.

EDIT 2: after some more digging around I found out that absinthe might have its own addon for GraphiQL that handles subscriptions so the previous edit is possibly incorrect.

Final edit (I hope): after close examination of phoenix and absinthe's log output I think that the browser<->server communication works for the subscription (I can see a subscription being registered on the elixir side with the parameters I gave it on the solid side).

So yeah, a quick subscription example with solid-urql would be great.

Sorry for the wall of text, it's been a learning journey for me :)

@trusktr
Copy link

trusktr commented Feb 10, 2022

ping

@tqwewe
Copy link
Owner

tqwewe commented Feb 17, 2022

Sadly I don't think I had completed subscription support 100% yet.
And I don't know when I'll get a chance to work on this as I'm preparing to fligh back to Aus, but I am more than happy to accept PR's if anyone wants to take a shot. I think I started work on it but never finished completely with the subscriptions.

@smlarkin
Copy link

@trusktr Sounds like you are not going to finish this port ... is that correct ?

@kristiangerkman
Copy link

Did a PR #4 for the most basic use case

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

No branches or pull requests

5 participants