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

  • import { GET_CART_ITEMS } from './pages/cart';
    
    export const resolvers = {
      Launch: {
        isInCart: (launch, _, { cache }) => {
          const { cartItems } = cache.readQuery({ query: GET_CART_ITEMS });
          return cartItems.includes(launch.id);
        },
      },
    };
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">import</span> <span class="token constant">GET_CART_ITEMS</span> <span class="token keyword">const</span> <span class="token constant">GET_CART_ITEMS</span><span class="token operator">:</span> <span class="token decorator"><span class="token at operator">@</span><span class="token function">apollo</span></span><span class="token operator">/</span>client<span class="token punctuation">.</span>DocumentNode</code></pre>
    Docs
    0
  •   resolvers: {
        Launch: {
          isInCart: (launch, _args, { cache }) => {
            const { cartItems } = cache.readQuery({ query: GET_CART_ITEMS });
            return cartItems.includes(launch.id);
          },
        },
      },
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token punctuation">(</span>parameter<span class="token punctuation">)</span> launch<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache, HttpLink, gql } from '@apollo/client';
    
    const GET_CART_ITEMS = gql`
      query GetCartItems {
        cartItems @client
      }
    `;
    
    const cache = new InMemoryCache();
    cache.writeQuery({
      query: GET_CART_ITEMS,
      data: {
        cartItems: [],
      },
    });
    
    const client = new ApolloClient({
      cache,
      link: new HttpLink({
        uri: 'http://localhost:4000/graphql',
      }),
      resolvers: {
        Launch: {
          isInCart: (launch, _args, { cache }) => {
            const { cartItems } = cache.readQuery({ query: GET_CART_ITEMS });
            return cartItems.includes(launch.id);
          },
        },
      },
    });
    
    const GET_LAUNCH_DETAILS = gql`
      query LaunchDetails($launchId: ID!) {
        launch(id: $launchId) {
          isInCart @client
          site
          rocket {
            type
          }
        }
      }
    `;
    
    // ... run the query using client.query, a <Query /> component, etc.
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • const { todo } = cache.readQuery({
      query: gql`
        query ReadTodo {
          todo(id: 5) {
            id
            text
            completed
          }
        }
      `,
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> todo<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import { GET_CART_ITEMS } from './pages/cart';
    
    export const resolvers = {
      Launch: {
        isInCart: (launch, _, { cache }) => {
          const { cartItems } = cache.readQuery({ query: GET_CART_ITEMS });
          return cartItems.includes(launch.id);
        },
      },
    };
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">import</span> <span class="token constant">GET_CART_ITEMS</span> <span class="token keyword">const</span> <span class="token constant">GET_CART_ITEMS</span><span class="token operator">:</span> <span class="token decorator"><span class="token at operator">@</span><span class="token function">apollo</span></span><span class="token operator">/</span>client<span class="token punctuation">.</span>DocumentNode</code></pre>
    Docs
    0
  •   resolvers: {
        Launch: {
          isInCart: (launch, _args, { cache }) => {
            const { cartItems } = cache.readQuery({ query: GET_CART_ITEMS });
            return cartItems.includes(launch.id);
          },
        },
      },
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token punctuation">(</span>parameter<span class="token punctuation">)</span> launch<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache, gql } from '@apollo/client';
    
    let nextTodoId = 0;
    
    const cache = new InMemoryCache();
    
    cache.writeQuery({
      query: gql`query GetTodos { todos { ... } }`,
      data: { todos: [] },
    });
    
    const client = new ApolloClient({
      resolvers: {
        Mutation: {
          addTodo: (_, { text }, { cache }) => {
            const query = gql`
              query GetTodos {
                todos @client {
                  id
                  text
                  completed
                }
              }
            `;
    
            const previous = cache.readQuery({ query });
            const newTodo = { id: nextTodoId++, text, completed: false, __typename: 'TodoItem' };
            const data = {
              todos: [...previous.todos, newTodo],
            };
    
            cache.writeQuery({ query, data });
            return newTodo;
          },
        },
      },
    });
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache, HttpLink, gql } from '@apollo/client';
    
    const GET_CART_ITEMS = gql`
      query GetCartItems {
        cartItems @client
      }
    `;
    
    const cache = new InMemoryCache();
    cache.writeQuery({
      query: GET_CART_ITEMS,
      data: {
        cartItems: [],
      },
    });
    
    const client = new ApolloClient({
      cache,
      link: new HttpLink({
        uri: 'http://localhost:4000/graphql',
      }),
      resolvers: {
        Launch: {
          isInCart: (launch, _args, { cache }) => {
            const { cartItems } = cache.readQuery({ query: GET_CART_ITEMS });
            return cartItems.includes(launch.id);
          },
        },
      },
    });
    
    const GET_LAUNCH_DETAILS = gql`
      query LaunchDetails($launchId: ID!) {
        launch(id: $launchId) {
          isInCart @client
          site
          rocket {
            type
          }
        }
      }
    `;
    
    // ... run the query using client.query, a <Query /> component, etc.
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • cache.writeQuery({
      query: IS_LOGGED_IN,
      data: {
        isLoggedIn: !!localStorage.getItem("token"),
      },
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> cache<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache } from '@apollo/client';
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      resolvers: {
        Mutation: {
          updateVisibilityFilter: (_, { visibilityFilter }, { cache }) => {
            cache.writeQuery({
              query: gql`query GetVisibilityFilter { visibilityFilter }`,
              data: {
                __typename: 'Filter',
                visibilityFilter,
              },
            });
          },
        },
      },
    };
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • import { InMemoryCache } from '@apollo/client';
    
    const cache = new InMemoryCache();
    cache.writeQuery({
      query: gql`query MyQuery {
        isLoggedIn,
        cartItems
      }`,
      data: {
        isLoggedIn: !!localStorage.getItem('token'),
        cartItems: [],
      },
    });
    <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">class</span> <span class="token class-name">InMemoryCache</span> <span class="token keyword">import</span> InMemoryCache</code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache } from '@apollo/client';
    
    const cache = new InMemoryCache();
    const client = new ApolloClient({
      cache,
      resolvers: { /* ... */ },
    });
    
    cache.writeQuery({
      query: gql`
        query GetTodosNetworkStatusAndFilter {
          todos
          visibilityFilter
          networkStatus {
            isConnected
          }
        }
      `,
      data: {
        todos: [],
        visibilityFilter: 'SHOW_ALL',
        networkStatus: {
          __typename: 'NetworkStatus',
          isConnected: false,
        },
      },
    });
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache, HttpLink, gql } from '@apollo/client';
    
    const query = gql`
      query CurrentAuthorPostCount($authorId: Int!) {
        currentAuthorId @client @export(as: "authorId")
        postCount(authorId: $authorId) @client
      }
    `;
    
    const cache = new InMemoryCache();
    const client = new ApolloClient({
      cache,
      resolvers: {
        Query: {
          postCount(_, { authorId }) {
            return authorId === 12345 ? 100 : 0;
          },
        },
      },
    });
    
    cache.writeQuery({
      query: gql`{ currentAuthorId }`,
      data: {
        currentAuthorId: 12345,
      },
    });
    
    // ... run the query using client.query, the <Query /> component, etc.
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • const todo = cache.readFragment({
      id: '5', // The value of the to-do item's unique identifier
      fragment: gql`
        fragment MyTodo on Todo {
          id
          text
          completed
        }
      `,
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> todo<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache } from '@apollo/client';
    
    const client = new ApolloClient({
      resolvers: {
        Mutation: {
          toggleTodo: (_, variables, { cache }) => {
            const id = `TodoItem:${variables.id}`;
            const fragment = gql`
              fragment CompleteTodo on TodoItem {
                completed
              }
            `;
            const todo = cache.readFragment({ fragment, id });
            const data = { ...todo, completed: !todo.completed };
    
            cache.writeFragment({ fragment, id, data });
            return null;
          },
        },
      },
    });
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • const bookYearFragment = gql`
      fragment BookYear on Book {
        publicationYear
      }
    `;
    
    const fragmentResult = cache.writeFragment({
      id: cache.identify(invisibleManBook),  fragment: bookYearFragment,
      data: {
        publicationYear: '1952'
      }
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> bookYearFragment<span class="token operator">:</span> <span class="token builtin">any</span></code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache } from '@apollo/client';
    
    const client = new ApolloClient({
      resolvers: {
        Mutation: {
          toggleTodo: (_, variables, { cache }) => {
            const id = `TodoItem:${variables.id}`;
            const fragment = gql`
              fragment CompleteTodo on TodoItem {
                completed
              }
            `;
            const todo = cache.readFragment({ fragment, id });
            const data = { ...todo, completed: !todo.completed };
    
            cache.writeFragment({ fragment, id, data });
            return null;
          },
        },
      },
    });
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • import { ApolloClient, InMemoryCache } from '@apollo/client';
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      resolvers: {
        Mutation: {
          updateUserEmail: (_, { id, email }, { cache }) => {
            cache.writeFragment({
              id: cache.identify({ __typename: "User", id }),
              fragment: gql`fragment UserEmail on User { email }`,
              data: { email },
            });
          },
        },
      },
    };
    <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">class</span> <span class="token class-name">ApolloClient<span class="token operator">&lt;</span>TCacheShape<span class="token operator">></span></span> <span class="token keyword">import</span> ApolloClient</code></pre>
    Docs
    0
  • const newComment = {
      __typename: 'Comment',
      id: 'abc123',
      text: 'Great blog post!',
    };
    
    cache.modify({
      id: cache.identify(myPost),
      fields: {
        comments(existingCommentRefs = [], { readField }) {
          const newCommentRef = cache.writeFragment({
            data: newComment,
            fragment: gql`
              fragment NewComment on Comment {
                id
                text
              }
            `
          });
    
          // Quick safety check - if the new comment is already
          // present in the cache, we don't need to add it again.
          if (existingCommentRefs.some(
            ref => readField('id', ref) === newComment.id
          )) {
            return existingCommentRefs;
          }
    
          return [...existingCommentRefs, newCommentRef];
        }
      }
    });
    <pre class="typing-tooltip"><code data-language="javascript" class="language-javascript"><span class="token keyword">const</span> newComment<span class="token operator">:</span> <span class="token punctuation">{</span> __typename<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span> id<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span> text<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span> <span class="token punctuation">}</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
  • Powered by Official black Bloop logo with a period
    download the IDE extension

    View other examples