tauri-plugin-graphql-urql
v2.0.3
Published
A plugin for Tauri that enables type-safe IPC through GraphQL.
Downloads
72
Readme
tauri-plugin-graphql
Custom urql
exchange that uses Tauri's IPC system to resolve queries against a GraphQL endpoint.
Install
$ pnpm add tauri-plugin-graphql-urql
# or
$ npm install tauri-plugin-graphql-urql
# or
$ yarn add tauri-plugin-graphql-urql
Usage
You need to register the plugin with Tauri first! Please see the top-level Readme for a full example.
Import and use the custom exchange to connect to the GraphQL endpoint exposed over IPC.
import { invokeExchange } from "tauri-plugin-graphql-urql";
const client = createClient({
url: "graphql", // this value is important, don't touch
exchanges: [invokeExchange],
});
const heroQuery = `
query {
hero {
name
}
}
`;
function Hero() {
const [result, reexecuteQuery] = useQuery({
query: heroQuery,
});
const { data, fetching, error } = result;
if (fetching) return <p>Loading...</p>;
if (error) return <p>Oh no... {error.message}</p>;
return (
<p>The hero is {data.hero.name}</p>
);
}
Subscriptions
This adapter also supports subscriptions.
import { subscribe } from "tauri-plugin-graphql-urql";
import { subscriptionExchange } from "@urql/preact";
const client = createClient({
url: "graphql",
exchanges: [
subscriptionExchange({
forwardSubscription: (operation) => ({
subscribe: (sink) => ({
unsubscribe: subscribe(operation, sink),
}),
}),
}),
],
});
const newMessages = `
subscription MessageSub {
helloWorld
}
`;
function handleSubscription(messages = [], response) {
return [response.helloWorld, ...messages];
};
function TestSubscription() {
const [res] = useSubscription({ query: newMessages }, handleSubscription);
if (!res.data) {
return <p>No new messages</p>;
}
return (
<p>
{res.data}
</p>
);
}