---
# System prepended metadata

title: 'Reacting to a feed item - Fri 18th September, 2020'
tags: [C+, apollocache, programmingjournal, testing, '2020', reactions, jest]

---

# Reacting to a feed item - Fri 18th September, 2020

I worked on adding the ability to react to feed items (as opposed to reacting to comments). I previously had implemented this on the web Wall, however, the logic for doing so worked with the old feed item data structure, meaning the cache update function was bloated and difficult to reason about.

We have now added updated the feed item data structure with additional properties, making updating feed item reactions so much easier.

Checking whether the current user reacted is as simple as checking for a boolean now:

```typescript=
const [currentUserReacted, setCurrentUserReacted] = useState<ReactionsTotal | null>(
        initialReactionsTotals.filter((reaction) => reaction.currentUserReacted)[0] ?? null
    )
```

I also wrote a cache update resolver unit test to properly test this reacting to feed item logic. I have previously wrote a utility function to generate `cache` Jest mocks, which needed to be updated to work with Apollo Client 3:

```typescript=
import { FetchResult } from 'apollo-link'
import { DataProxy } from 'apollo-cache'

interface CreateMockResolverArgs {
    /** A jest mock that should return your query or null */
    readQueryMock: jest.Mock<any, any>
    /** A jest mock that you will use to check what has been called with */
    writeQueryMock: jest.Mock<any, any>
    /** The response from the mutation (if required in your resolver) */
    mutationPayload?: FetchResult<any>
}

export function createMockResolverArgs({
    readQueryMock,
    writeQueryMock,
    mutationPayload = {},
}: CreateMockResolverArgs) {
    const cache: DataProxy = {
        readFragment: jest.fn(),
        readQuery: readQueryMock,
        writeData: jest.fn(),
        writeFragment: jest.fn(),
        writeQuery: writeQueryMock,
    }
    return { cache, mutationPayload }
}
```

I need to add better type generics, and also update [the published NPM version](https://www.npmjs.com/package/createapollocacheupdatemock). Another issue is `writeData` has been removed from Apollo Client 3, however, I need to maintain backwards compatibility with 2.

###### tags: `programmingjournal` `2020` `C+` `testing` `jest` `apollocache` `reactions`