diff --git a/404.html b/404.html index d300a0b..57e3ea9 100644 --- a/404.html +++ b/404.html @@ -4,7 +4,7 @@ GraphQL Client - + diff --git a/assets/js/138067e7.26d0b696.js b/assets/js/138067e7.de0e1298.js similarity index 84% rename from assets/js/138067e7.26d0b696.js rename to assets/js/138067e7.de0e1298.js index 893a35b..747641f 100644 --- a/assets/js/138067e7.26d0b696.js +++ b/assets/js/138067e7.de0e1298.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[682],{3392:(e,r,n)=>{n.r(r),n.d(r,{assets:()=>l,contentTitle:()=>d,default:()=>o,frontMatter:()=>u,metadata:()=>i,toc:()=>c});var s=n(4848),t=n(8453);const u={title:"useDeferredQuery",sidebar_label:"useDeferredQuery"},d=void 0,i={id:"use-deferred-query",title:"useDeferredQuery",description:"useDeferredQuery(query, config?)",source:"@site/docs/use-deferred-query.md",sourceDirName:".",slug:"/use-deferred-query",permalink:"/graphql-client/use-deferred-query",draft:!1,unlisted:!1,editUrl:"https://github.com/swan-io/graphql-client/edit/main/docs/docs/use-deferred-query.md",tags:[],version:"current",frontMatter:{title:"useDeferredQuery",sidebar_label:"useDeferredQuery"},sidebar:"docs",previous:{title:"useQuery",permalink:"/graphql-client/use-query"},next:{title:"useMutation",permalink:"/graphql-client/use-mutation"}},l={},c=[{value:"useDeferredQuery(query, config?)",id:"usedeferredqueryquery-config",level:2},{value:"Params",id:"params",level:3},{value:"Returns",id:"returns",level:3},{value:"Example",id:"example",level:2}];function a(e){const r={code:"code",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",ul:"ul",...(0,t.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(r.h2,{id:"usedeferredqueryquery-config",children:"useDeferredQuery(query, config?)"}),"\n",(0,s.jsxs)(r.p,{children:["Similar to ",(0,s.jsx)(r.code,{children:"useQuery"}),", but requires a manual call to ",(0,s.jsx)(r.code,{children:"query"}),"."]}),"\n",(0,s.jsx)(r.h3,{id:"params",children:"Params"}),"\n",(0,s.jsxs)(r.ul,{children:["\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"query"}),": your query document node"]}),"\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"config"})," (optional)","\n",(0,s.jsxs)(r.ul,{children:["\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"optimize"}),": adapt query to only require data that's missing from the cache (default: ",(0,s.jsx)(r.code,{children:"false"}),")"]}),"\n"]}),"\n"]}),"\n"]}),"\n",(0,s.jsx)(r.h3,{id:"returns",children:"Returns"}),"\n",(0,s.jsxs)(r.p,{children:["This hook returns a tuple you can extract like a ",(0,s.jsx)(r.code,{children:"useState"}),":"]}),"\n",(0,s.jsx)(r.pre,{children:(0,s.jsx)(r.code,{className:"language-ts",children:"const [data, query] = useDeferredQuery(...)\n"})}),"\n",(0,s.jsxs)(r.ul,{children:["\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"data"})," (",(0,s.jsx)(r.code,{children:"AsyncData>"}),"): the GraphQL response"]}),"\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"query(variables)"}),": runs the query"]}),"\n"]}),"\n",(0,s.jsx)(r.h2,{id:"example",children:"Example"}),"\n",(0,s.jsx)(r.pre,{children:(0,s.jsx)(r.code,{className:"language-ts",children:'import { useDeferredQuery } from "@swan-io/graphql-client";\n// ...\n\nconst userPageQuery = graphql(`\n query UserPage($userId: ID!) {\n user(id: $userId) {\n id\n username\n avatar\n }\n }\n`);\n\ntype Props = {\n userId: string;\n};\n\nconst UserPage = ({ userId }: Props) => {\n const [user, queryUser] = useDeferredQuery(userPageQuery);\n\n\tuseEffect(() => {\n\t\tqueryUser({ userId })\n\t}, [userId, queryUser])\n\n return user.match({\n NotAsked: () => null,\n Loading: () => ,\n Done: (result) =>\n result.match({\n Error: (error) => ,\n Ok: (user) => ,\n }),\n });\n};\n'})})]})}function o(e={}){const{wrapper:r}={...(0,t.R)(),...e.components};return r?(0,s.jsx)(r,{...e,children:(0,s.jsx)(a,{...e})}):a(e)}},8453:(e,r,n)=>{n.d(r,{R:()=>d,x:()=>i});var s=n(6540);const t={},u=s.createContext(t);function d(e){const r=s.useContext(u);return s.useMemo((function(){return"function"==typeof e?e(r):{...r,...e}}),[r,e])}function i(e){let r;return r=e.disableParentContext?"function"==typeof e.components?e.components(t):e.components||t:d(e.components),s.createElement(u.Provider,{value:r},e.children)}}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[682],{3392:(e,r,n)=>{n.r(r),n.d(r,{assets:()=>l,contentTitle:()=>d,default:()=>o,frontMatter:()=>t,metadata:()=>i,toc:()=>c});var s=n(4848),u=n(8453);const t={title:"useDeferredQuery",sidebar_label:"useDeferredQuery"},d=void 0,i={id:"use-deferred-query",title:"useDeferredQuery",description:"useDeferredQuery(query, config?)",source:"@site/docs/use-deferred-query.md",sourceDirName:".",slug:"/use-deferred-query",permalink:"/graphql-client/use-deferred-query",draft:!1,unlisted:!1,editUrl:"https://github.com/swan-io/graphql-client/edit/main/docs/docs/use-deferred-query.md",tags:[],version:"current",frontMatter:{title:"useDeferredQuery",sidebar_label:"useDeferredQuery"},sidebar:"docs",previous:{title:"useQuery",permalink:"/graphql-client/use-query"},next:{title:"useMutation",permalink:"/graphql-client/use-mutation"}},l={},c=[{value:"useDeferredQuery(query, config?)",id:"usedeferredqueryquery-config",level:2},{value:"Params",id:"params",level:3},{value:"Returns",id:"returns",level:3},{value:"Example",id:"example",level:2}];function a(e){const r={code:"code",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",ul:"ul",...(0,u.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(r.h2,{id:"usedeferredqueryquery-config",children:"useDeferredQuery(query, config?)"}),"\n",(0,s.jsxs)(r.p,{children:["Similar to ",(0,s.jsx)(r.code,{children:"useQuery"}),", but requires a manual call to ",(0,s.jsx)(r.code,{children:"query"}),"."]}),"\n",(0,s.jsx)(r.h3,{id:"params",children:"Params"}),"\n",(0,s.jsxs)(r.ul,{children:["\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"query"}),": your query document node"]}),"\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"config"})," (optional)","\n",(0,s.jsxs)(r.ul,{children:["\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"optimize"}),": adapt query to only require data that's missing from the cache (default: ",(0,s.jsx)(r.code,{children:"false"}),")"]}),"\n"]}),"\n"]}),"\n"]}),"\n",(0,s.jsx)(r.h3,{id:"returns",children:"Returns"}),"\n",(0,s.jsxs)(r.p,{children:["This hook returns a tuple you can extract like a ",(0,s.jsx)(r.code,{children:"useState"}),":"]}),"\n",(0,s.jsx)(r.pre,{children:(0,s.jsx)(r.code,{className:"language-ts",children:"const [data, query] = useDeferredQuery(...)\n"})}),"\n",(0,s.jsxs)(r.ul,{children:["\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"data"})," (",(0,s.jsx)(r.code,{children:"AsyncData>"}),"): the GraphQL response"]}),"\n",(0,s.jsxs)(r.li,{children:[(0,s.jsx)(r.code,{children:"query(variables)"}),": runs the query"]}),"\n"]}),"\n",(0,s.jsx)(r.h2,{id:"example",children:"Example"}),"\n",(0,s.jsx)(r.pre,{children:(0,s.jsx)(r.code,{className:"language-ts",children:'import { useDeferredQuery } from "@swan-io/graphql-client";\n// ...\n\nconst userPageQuery = graphql(`\n query UserPage($userId: ID!) {\n user(id: $userId) {\n id\n username\n avatar\n }\n }\n`);\n\ntype Props = {\n userId: string;\n};\n\nconst UserPage = ({ userId }: Props) => {\n const [user, queryUser] = useDeferredQuery(userPageQuery);\n\n useEffect(() => {\n queryUser({ userId })\n }, [userId, queryUser])\n\n return user.match({\n NotAsked: () => null,\n Loading: () => ,\n Done: (result) =>\n result.match({\n Error: (error) => ,\n Ok: (user) => ,\n }),\n });\n};\n'})})]})}function o(e={}){const{wrapper:r}={...(0,u.R)(),...e.components};return r?(0,s.jsx)(r,{...e,children:(0,s.jsx)(a,{...e})}):a(e)}},8453:(e,r,n)=>{n.d(r,{R:()=>d,x:()=>i});var s=n(6540);const u={},t=s.createContext(u);function d(e){const r=s.useContext(t);return s.useMemo((function(){return"function"==typeof e?e(r):{...r,...e}}),[r,e])}function i(e){let r;return r=e.disableParentContext?"function"==typeof e.components?e.components(u):e.components||u:d(e.components),s.createElement(t.Provider,{value:r},e.children)}}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.22cba2d2.js b/assets/js/runtime~main.22cba2d2.js new file mode 100644 index 0000000..dcc0455 --- /dev/null +++ b/assets/js/runtime~main.22cba2d2.js @@ -0,0 +1 @@ +(()=>{"use strict";var e,t,r,a,o,n={},d={};function f(e){var t=d[e];if(void 0!==t)return t.exports;var r=d[e]={id:e,loaded:!1,exports:{}};return n[e].call(r.exports,r,r.exports,f),r.loaded=!0,r.exports}f.m=n,f.c=d,e=[],f.O=(t,r,a,o)=>{if(!r){var n=1/0;for(l=0;l=o)&&Object.keys(f.O).every((e=>f.O[e](r[i])))?r.splice(i--,1):(d=!1,o0&&e[l-1][2]>o;l--)e[l]=e[l-1];e[l]=[r,a,o]},f.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return f.d(t,{a:t}),t},r=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,f.t=function(e,a){if(1&a&&(e=this(e)),8&a)return e;if("object"==typeof e&&e){if(4&a&&e.__esModule)return e;if(16&a&&"function"==typeof e.then)return e}var o=Object.create(null);f.r(o);var n={};t=t||[null,r({}),r([]),r(r)];for(var d=2&a&&e;"object"==typeof d&&!~t.indexOf(d);d=r(d))Object.getOwnPropertyNames(d).forEach((t=>n[t]=()=>e[t]));return n.default=()=>e,f.d(o,n),o},f.d=(e,t)=>{for(var r in t)f.o(t,r)&&!f.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},f.f={},f.e=e=>Promise.all(Object.keys(f.f).reduce(((t,r)=>(f.f[r](e,t),t)),[])),f.u=e=>"assets/js/"+({48:"a94703ab",98:"a7bd4aaa",113:"470aea15",165:"d73abe6d",401:"17896441",456:"79f7b534",546:"e8405da1",581:"935f2afb",585:"755cfc2e",634:"c4f5d8e4",647:"5e95c892",682:"138067e7",924:"d589d3a7",956:"6b495f58"}[e]||e)+"."+{48:"8b0ccadb",98:"fd305e17",113:"6ea4c2d0",165:"9e13a3d7",237:"7663bed8",401:"fd5a9d4d",456:"d2d96a37",546:"68558b10",581:"98afd73a",585:"a1a97e84",634:"12a7b096",647:"1dd55255",682:"de0e1298",924:"26937052",956:"89d627ba"}[e]+".js",f.miniCssF=e=>{},f.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),f.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a={},o="docs:",f.l=(e,t,r,n)=>{if(a[e])a[e].push(t);else{var d,i;if(void 0!==r)for(var c=document.getElementsByTagName("script"),l=0;l{d.onerror=d.onload=null,clearTimeout(b);var o=a[e];if(delete a[e],d.parentNode&&d.parentNode.removeChild(d),o&&o.forEach((e=>e(r))),t)return t(r)},b=setTimeout(s.bind(null,void 0,{type:"timeout",target:d}),12e4);d.onerror=s.bind(null,d.onerror),d.onload=s.bind(null,d.onload),i&&document.head.appendChild(d)}},f.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.p="/graphql-client/",f.gca=function(e){return e={17896441:"401",a94703ab:"48",a7bd4aaa:"98","470aea15":"113",d73abe6d:"165","79f7b534":"456",e8405da1:"546","935f2afb":"581","755cfc2e":"585",c4f5d8e4:"634","5e95c892":"647","138067e7":"682",d589d3a7:"924","6b495f58":"956"}[e]||e,f.p+f.u(e)},(()=>{var e={354:0,869:0};f.f.j=(t,r)=>{var a=f.o(e,t)?e[t]:void 0;if(0!==a)if(a)r.push(a[2]);else if(/^(354|869)$/.test(t))e[t]=0;else{var o=new Promise(((r,o)=>a=e[t]=[r,o]));r.push(a[2]=o);var n=f.p+f.u(t),d=new Error;f.l(n,(r=>{if(f.o(e,t)&&(0!==(a=e[t])&&(e[t]=void 0),a)){var o=r&&("load"===r.type?"missing":r.type),n=r&&r.target&&r.target.src;d.message="Loading chunk "+t+" failed.\n("+o+": "+n+")",d.name="ChunkLoadError",d.type=o,d.request=n,a[1](d)}}),"chunk-"+t,t)}},f.O.j=t=>0===e[t];var t=(t,r)=>{var a,o,n=r[0],d=r[1],i=r[2],c=0;if(n.some((t=>0!==e[t]))){for(a in d)f.o(d,a)&&(f.m[a]=d[a]);if(i)var l=i(f)}for(t&&t(r);c{"use strict";var e,t,r,a,o,n={},d={};function i(e){var t=d[e];if(void 0!==t)return t.exports;var r=d[e]={id:e,loaded:!1,exports:{}};return n[e].call(r.exports,r,r.exports,i),r.loaded=!0,r.exports}i.m=n,i.c=d,e=[],i.O=(t,r,a,o)=>{if(!r){var n=1/0;for(l=0;l=o)&&Object.keys(i.O).every((e=>i.O[e](r[f])))?r.splice(f--,1):(d=!1,o0&&e[l-1][2]>o;l--)e[l]=e[l-1];e[l]=[r,a,o]},i.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return i.d(t,{a:t}),t},r=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,i.t=function(e,a){if(1&a&&(e=this(e)),8&a)return e;if("object"==typeof e&&e){if(4&a&&e.__esModule)return e;if(16&a&&"function"==typeof e.then)return e}var o=Object.create(null);i.r(o);var n={};t=t||[null,r({}),r([]),r(r)];for(var d=2&a&&e;"object"==typeof d&&!~t.indexOf(d);d=r(d))Object.getOwnPropertyNames(d).forEach((t=>n[t]=()=>e[t]));return n.default=()=>e,i.d(o,n),o},i.d=(e,t)=>{for(var r in t)i.o(t,r)&&!i.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},i.f={},i.e=e=>Promise.all(Object.keys(i.f).reduce(((t,r)=>(i.f[r](e,t),t)),[])),i.u=e=>"assets/js/"+({48:"a94703ab",98:"a7bd4aaa",113:"470aea15",165:"d73abe6d",401:"17896441",456:"79f7b534",546:"e8405da1",581:"935f2afb",585:"755cfc2e",634:"c4f5d8e4",647:"5e95c892",682:"138067e7",924:"d589d3a7",956:"6b495f58"}[e]||e)+"."+{48:"8b0ccadb",98:"fd305e17",113:"6ea4c2d0",165:"9e13a3d7",237:"7663bed8",401:"fd5a9d4d",456:"d2d96a37",546:"68558b10",581:"98afd73a",585:"a1a97e84",634:"12a7b096",647:"1dd55255",682:"26d0b696",924:"26937052",956:"89d627ba"}[e]+".js",i.miniCssF=e=>{},i.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a={},o="docs:",i.l=(e,t,r,n)=>{if(a[e])a[e].push(t);else{var d,f;if(void 0!==r)for(var c=document.getElementsByTagName("script"),l=0;l{d.onerror=d.onload=null,clearTimeout(b);var o=a[e];if(delete a[e],d.parentNode&&d.parentNode.removeChild(d),o&&o.forEach((e=>e(r))),t)return t(r)},b=setTimeout(s.bind(null,void 0,{type:"timeout",target:d}),12e4);d.onerror=s.bind(null,d.onerror),d.onload=s.bind(null,d.onload),f&&document.head.appendChild(d)}},i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.p="/graphql-client/",i.gca=function(e){return e={17896441:"401",a94703ab:"48",a7bd4aaa:"98","470aea15":"113",d73abe6d:"165","79f7b534":"456",e8405da1:"546","935f2afb":"581","755cfc2e":"585",c4f5d8e4:"634","5e95c892":"647","138067e7":"682",d589d3a7:"924","6b495f58":"956"}[e]||e,i.p+i.u(e)},(()=>{var e={354:0,869:0};i.f.j=(t,r)=>{var a=i.o(e,t)?e[t]:void 0;if(0!==a)if(a)r.push(a[2]);else if(/^(354|869)$/.test(t))e[t]=0;else{var o=new Promise(((r,o)=>a=e[t]=[r,o]));r.push(a[2]=o);var n=i.p+i.u(t),d=new Error;i.l(n,(r=>{if(i.o(e,t)&&(0!==(a=e[t])&&(e[t]=void 0),a)){var o=r&&("load"===r.type?"missing":r.type),n=r&&r.target&&r.target.src;d.message="Loading chunk "+t+" failed.\n("+o+": "+n+")",d.name="ChunkLoadError",d.type=o,d.request=n,a[1](d)}}),"chunk-"+t,t)}},i.O.j=t=>0===e[t];var t=(t,r)=>{var a,o,n=r[0],d=r[1],f=r[2],c=0;if(n.some((t=>0!==e[t]))){for(a in d)i.o(d,a)&&(i.m[a]=d[a]);if(f)var l=f(i)}for(t&&t(r);c Client | GraphQL Client - + diff --git a/getting-started/index.html b/getting-started/index.html index 05b5edc..9bd6a0b 100644 --- a/getting-started/index.html +++ b/getting-started/index.html @@ -4,7 +4,7 @@ Getting started | GraphQL Client - + diff --git a/index.html b/index.html index f816e7b..ef72e99 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ GraphQL Client: A simple, typesafe GraphQL client for React | GraphQL Client - + diff --git a/pagination/index.html b/pagination/index.html index 4f1de3f..69a77f9 100644 --- a/pagination/index.html +++ b/pagination/index.html @@ -4,7 +4,7 @@ Pagination | GraphQL Client - + diff --git a/use-deferred-query/index.html b/use-deferred-query/index.html index 8c451d6..cda5ee6 100644 --- a/use-deferred-query/index.html +++ b/use-deferred-query/index.html @@ -4,7 +4,7 @@ useDeferredQuery | GraphQL Client - + @@ -27,6 +27,6 @@

ReturnsExample​

-
import { useDeferredQuery } from "@swan-io/graphql-client";
// ...

const userPageQuery = graphql(`
  query UserPage($userId: ID!) {
    user(id: $userId) {
      id
      username
      avatar
    }
  }
`);

type Props = {
  userId: string;
};

const UserPage = ({ userId }: Props) => {
  const [user, queryUser] = useDeferredQuery(userPageQuery);

	useEffect(() => {
		queryUser({ userId })
	}, [userId, queryUser])

  return user.match({
    NotAsked: () => null,
    Loading: () => <LoadingIndicator />,
    Done: (result) =>
      result.match({
        Error: (error) => <ErrorIndicator error={error} />,
        Ok: (user) => <UserDetails user={user} />,
      }),
  });
};
Copyright © 2024 Swan
+
import { useDeferredQuery } from "@swan-io/graphql-client";
// ...

const userPageQuery = graphql(`
  query UserPage($userId: ID!) {
    user(id: $userId) {
      id
      username
      avatar
    }
  }
`);

type Props = {
  userId: string;
};

const UserPage = ({ userId }: Props) => {
  const [user, queryUser] = useDeferredQuery(userPageQuery);

  useEffect(() => {
    queryUser({ userId })
  }, [userId, queryUser])

  return user.match({
    NotAsked: () => null,
    Loading: () => <LoadingIndicator />,
    Done: (result) =>
      result.match({
        Error: (error) => <ErrorIndicator error={error} />,
        Ok: (user) => <UserDetails user={user} />,
      }),
  });
};
Copyright © 2024 Swan
\ No newline at end of file diff --git a/use-mutation/index.html b/use-mutation/index.html index 47859e6..6c99440 100644 --- a/use-mutation/index.html +++ b/use-mutation/index.html @@ -4,7 +4,7 @@ useMutation | GraphQL Client - + diff --git a/use-query/index.html b/use-query/index.html index 22c4798..7139059 100644 --- a/use-query/index.html +++ b/use-query/index.html @@ -4,7 +4,7 @@ useQuery | GraphQL Client - +