how work with localmock client

index.ts

import { from, ApolloClient, HttpLink, InMemoryCache } from '@apollo/client';
import { errorLink } from './error.link';
import * as tags from './posts.resolvers';

const typeDefs = [tags.typeDefs];
const resolvers = [tags.resolvers];

const gqlClient = new ApolloClient({
  cache: new InMemoryCache(),
  typeDefs,
  resolvers,
  link: from([
    errorLink,
    new HttpLink({
      uri: 'https://48p1r2roz4.sse.codesandbox.io',
    }),
  ])
});

export {
  gqlClient
}

posts.resolver.ts

import gql from "graphql-tag";

// example data
const authors = [
  { id: 1, firstName: 'Tom', lastName: 'Coleman' },
  { id: 2, firstName: 'Sashko', lastName: 'Stubailo' },
  { id: 3, firstName: 'Mikhail', lastName: 'Novikov' },
];

const posts = [
  { id: 1, authorId: 1, title: 'Introduction to GraphQL', votes: 2 },
  { id: 2, authorId: 2, title: 'Welcome to Meteor', votes: 3 },
  { id: 3, authorId: 2, title: 'Advanced GraphQL', votes: 1 },
  { id: 4, authorId: 3, title: 'Launchpad is Cool', votes: 7 },
];

export const typeDefs = gql`
  type Author {
    id: Int!
    firstName: String
    lastName: String
    """
    the list of Posts by this author
    """
    posts: [Post]
  }

  type Post {
    id: Int!
    title: String
    author: Author
    votes: Int
  }

  # the schema allows the following query:
  extend type Query {
    posts: [Post]
    author(id: Int!): Author
  }

  # this schema allows the following mutation:
  type Mutation {
    upvotePost (
      postId: Int!
    ): Post
  }
`;

export const resolvers = {
  Query: {
    posts: () => posts,
    author: (_ : any, { id }: {id: number}) => authors.find(e => e.id === id),
  },

  Mutation: {
    upvotePost: (_: any, { postId }: {postId: number}) => {
      const post = posts.find(e => e.id === postId);
      if (!post) {
        throw new Error(`Couldn't find post with id ${postId}`);
      }
      post.votes += 1;
      return post;
    },
  },

  Author: {
    posts: (author: {id: number}) => posts.filter(e => e.authorId === author.id),
  },

  Post: {
    author: (post: {authorId: number}) => authors.find(e => e.id === post.authorId),
  },
};

query.apollo.ts

import { useQuery, gql } from '@apollo/client';
import { Posts } from './__generated__/Posts';

export const posts = () =>
  useQuery<Posts>(
    gql`
      query Posts($id: Int!) {
        data: author(id: $id) @client {
          firstName
          lastName
          posts {
            id
            title
          }
        }
      }
    `,
  );

Did you really make it work?
In my cases, I used __typenames in the data set.

const authors = [
  { id: 1, firstName: 'Tom', lastName: 'Coleman', __typename: 'Author' },
  { id: 2, firstName: 'Sashko', lastName: 'Stubailo', __typename: 'Author' },
  { id: 3, firstName: 'Mikhail', lastName: 'Novikov', __typename: 'Author' },
];

const posts = [
  { id: 1, authorId: 1, title: 'Introduction to GraphQL', votes: 2, __typename: 'Post' },
  { id: 2, authorId: 2, title: 'Welcome to Meteor', votes: 3, __typename: 'Post },
  { id: 3, authorId: 2, title: 'Advanced GraphQL', votes: 1, __typename: 'Post },
  { id: 4, authorId: 3, title: 'Launchpad is Cool', votes: 7, __typename: 'Post },
];

Without __typename it did not work for getting related data Post -> Author.