How to use where clause in Knex
Create refunds with Stripe
Load HTML with Cheerio
How to send POST request with Axios
Find intersection of array in Lodash
Powered by Official white Bloop logo with a period

Terms / Privacy / Search / Support

  • const [addTodo, { data, loading, error }] = useMutation(ADD_TODO, {
      variables: {
        text: "placeholder",
        someOtherVariable: 1234,
      },
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> addTodo<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • const [addComment] = useMutation(ADD_COMMENT, {
      update(cache, { data: { addComment } }) {
        cache.modify({
          id: cache.identify(myPost),
          fields: {
            comments(existingCommentRefs = [], { readField }) {
              const newCommentRef = cache.writeFragment({
                data: addComment,
                fragment: gql`
                  fragment NewComment on Comment {
                    id
                    text
                  }
                `
              });
              return [...existingCommentRefs, newCommentRef];
            }
          }
        });
      }
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> addComment<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • addTodo({
      variables: {
        text: input.value,
      },
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> addTodo<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • addTodo({
      variables: { type: input.value },
      update(cache, result) {
        // Update the cache as an approximation of server-side mutation effects.
      },
      // Force ReallyImportantQuery to be passed to onQueryUpdated.
      refetchQueries: ["ReallyImportantQuery"],
      onQueryUpdated(observableQuery) {
        // If ReallyImportantQuery is active, it will be passed to onQueryUpdated.
        // If no query with that name is active, a warning will be logged.
      },
    })
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> addTodo<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import React from "react";
    import { ApolloConsumer, useApolloClient, useQuery, gql } from "@apollo/client";
    
    const GET_MESSAGE_COUNT = gql`
      query GetMessageCount {
        messageCount @client {
          total
        }
      }
    `;
    
    const resolvers = {
      Query: {
        messageCount: (_, args, { cache }) => {
          // ... calculate and return the number of messages in
          // the cache ...
          return {
            total: 123,
            __typename: "MessageCount",
          };
        },
      },
    };
    
    export function MessageCount() {
      const client = useApolloClient();
      client.addResolvers(resolvers);
    
      const { loading, data: { messageCount } } = useQuery(GET_MESSAGE_COUNT);
    
      if (loading) return "Loading ...";
    
      return (
        <p>
          Total number of messages: {messageCount.total}
        </p>
      );
    };
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token punctuation">(</span>alias<span class="token punctuation">)</span> <span class="token keyword">namespace</span> React <span class="token keyword">import</span> React</code></pre>
    Docs
    0
  • // Add this import to the top of the file
    import { getDataFromTree } from "@apollo/client/react/ssr";
    
    // Replace the TODO with this
    getDataFromTree(App).then((content) => {
      // Extract the entirety of the Apollo Client cache's current state
      const initialState = client.extract();
    
      // Add both the page content and the cache state to a top-level component
      const html = <Html content={content} state={initialState} />;
    
      // Render the component to static markup and return it
      res.status(200);
      res.send(`<!doctype html>\n${ReactDOM.renderToStaticMarkup(html)}`);
      res.end();
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token punctuation">(</span>alias<span class="token punctuation">)</span> <span class="token keyword">function</span> <span class="token function">getDataFromTree</span><span class="token punctuation">(</span><span class="token parameter">tree<span class="token operator">:</span> React<span class="token punctuation">.</span>ReactNode<span class="token punctuation">,</span> context<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token punctuation">[</span>key<span class="token operator">:</span> string<span class="token punctuation">]</span><span class="token operator">:</span> any<span class="token punctuation">;</span> <span class="token punctuation">}</span></span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token builtin">Promise</span><span class="token operator">&lt;</span><span class="token builtin">string</span><span class="token operator">></span> <span class="token keyword">import</span> getDataFromTree</code></pre>
    Docs
    0
  • import React from "react";
    import { ApolloConsumer, useApolloClient, useQuery, gql } from "@apollo/client";
    
    const GET_MESSAGE_COUNT = gql`
      query GetMessageCount {
        messageCount @client {
          total
        }
      }
    `;
    
    const resolvers = {
      Query: {
        messageCount: (_, args, { cache }) => {
          // ... calculate and return the number of messages in
          // the cache ...
          return {
            total: 123,
            __typename: "MessageCount",
          };
        },
      },
    };
    
    export function MessageCount() {
      const client = useApolloClient();
      client.addResolvers(resolvers);
    
      const { loading, data: { messageCount } } = useQuery(GET_MESSAGE_COUNT);
    
      if (loading) return "Loading ...";
    
      return (
        <p>
          Total number of messages: {messageCount.total}
        </p>
      );
    };
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token punctuation">(</span>alias<span class="token punctuation">)</span> <span class="token keyword">namespace</span> React <span class="token keyword">import</span> React</code></pre>
    Docs
    0
  • Powered by Official black Bloop logo with a period
    download the IDE extension

    View other examples