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 {
      ApolloClient,
      HttpLink,
      ApolloLink,
      InMemoryCache,
      concat,
    } from "@apollo/client";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const authMiddleware = new ApolloLink(
      (operation, forward) => {
        // add the authorization to the headers
        operation.setContext(({ headers = {} }) => ({
          headers: {
            ...headers,
            authorization:
              localStorage.getItem("token") || null,
          },
        }));
    
        return forward(operation);
      }
    );
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: concat(authMiddleware, httpLink),
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
      HttpLink,
      ApolloLink,
    } from "@apollo/client";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const addDateLink = new ApolloLink((operation, forward) => {
      return forward(operation).map((response) => {
        response.data.date = new Date();
        return response;
      });
    });
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: addDateLink.concat(httpLink),
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
      HttpLink,
      ApolloLink,
    } from "@apollo/client";
    import { asyncMap } from "@apollo/client/utilities";
    
    import { usdToEur } from "./currency";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const usdToEurLink = new ApolloLink(
      (operation, forward) => {
        return asyncMap(
          forward(operation),
          async (response) => {
            let data = response.data;
            if (data.price && data.currency === "USD") {
              data.price = await usdToEur(data.price);
              data.currency = "EUR";
            }
            return response;
          }
        );
      }
    );
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: usdToEurLink.concat(httpLink),
    });
    
    Docs
    0
  • import { from, HttpLink } from "@apollo/client";
    import { RetryLink } from "@apollo/client/link/retry";
    import MyAuthLink from "../auth";
    
    const additiveLink = from([
      new RetryLink(),
      new MyAuthLink(),
      new HttpLink({ uri: "http://localhost:4000/graphql" }),
    ]);
    
    Docs
    0
  • import { ApolloLink, from } from "@apollo/client";
    
    const timeStartLink = new ApolloLink(
      (operation, forward) => {
        operation.setContext({ start: new Date() });
        return forward(operation);
      }
    );
    
    const logTimeLink = new ApolloLink((operation, forward) => {
      return forward(operation).map((data) => {
        // data from a previous link
        const time = new Date() - operation.getContext().start;
        console.log(
          `operation ${operation.operationName} took ${time} to complete`
        );
        return data;
      });
    });
    
    const additiveLink = from([timeStartLink, logTimeLink]);
    
    Docs
    0
  • import {
      ApolloClient,
      HttpLink,
      ApolloLink,
      InMemoryCache,
      from,
    } from "@apollo/client";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const authMiddleware = new ApolloLink(
      (operation, forward) => {
        // add the authorization to the headers
        operation.setContext(({ headers = {} }) => ({
          headers: {
            ...headers,
            authorization:
              localStorage.getItem("token") || null,
          },
        }));
    
        return forward(operation);
      }
    );
    
    const activityMiddleware = new ApolloLink(
      (operation, forward) => {
        // add the recent-activity custom header to the headers
        operation.setContext(({ headers = {} }) => ({
          headers: {
            ...headers,
            "recent-activity":
              localStorage.getItem("lastOnlineTime") || null,
          },
        }));
    
        return forward(operation);
      }
    );
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: from([
        authMiddleware,
        activityMiddleware,
        httpLink,
      ]),
    });
    
    Docs
    0
  • import {
      ApolloClient,
      createHttpLink,
      InMemoryCache,
    } from "@apollo/client";
    
    const client = new ApolloClient({
      ssrMode: true,
      link: createHttpLink({
        uri: "http://localhost:3010",
        credentials: "same-origin",
        headers: { cookie: req.header("Cookie") },
      }),
      cache: new InMemoryCache(),
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
      HttpLink,
      ApolloLink,
    } from "@apollo/client";
    import { asyncMap } from "@apollo/client/utilities";
    
    import { usdToEur } from "./currency";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const usdToEurLink = new ApolloLink(
      (operation, forward) => {
        return asyncMap(
          forward(operation),
          async (response) => {
            let data = response.data;
            if (data.price && data.currency === "USD") {
              data.price = await usdToEur(data.price);
              data.currency = "EUR";
            }
            return response;
          }
        );
      }
    );
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: usdToEurLink.concat(httpLink),
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
    } from "@apollo/client";
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      uri: "/graphql",
    });
    
    client.query({
      query: MY_QUERY,
      context: {
        // example of setting the headers with context per operation
        headers: {
          special: "Special header value",
        },
      },
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
    } from "@apollo/client";
    
    const client = new ApolloClient({
      uri: "https://api.example.com",
      cache: new InMemoryCache(),
      // Enable sending cookies over cross-origin requests
      credentials: "include",
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
    } from "@apollo/client";
    
    const cache = new InMemoryCache();
    
    const client = new ApolloClient({
      // Provide required constructor fields
      cache: cache,
      uri: "http://localhost:4000/",
    
      // Provide some optional constructor fields
      name: "react-web-client",
      version: "1.3",
      queryDeduplication: false,
      defaultOptions: {
        watchQuery: {
          fetchPolicy: "cache-and-network",
        },
      },
    });
    
    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 (
        

    Total number of messages: {messageCount.total}

    ); }
    Docs
    0
  • Powered by Official black Bloop logo with a period
    download the IDE extension

    View other examples