part8d: fix 'setContext'

‘setContext’ is deprecated in Apollo Client 4, replace it with ’SetContextLink‘

Author: Juemuren

src/content/8/en/part8d.md

@@ -164,24 +164,23 @@ const App = () => {
 After the backend changes, creating new persons requires that a valid user token is sent with the request. In order to send the token, we have to change the way we define the *ApolloClient* object in <i>main.jsx</i> a little.
 
 ```js
-import { ApolloClient, InMemoryCache, ApolloProvider, createHttpLink } from '@apollo/client'  // highlight-line
-import { setContext } from '@apollo/client/link/context' // highlight-line
+import { ApolloClient, InMemoryCache, HttpLink, } from '@apollo/client'  // highlight-line
+import { ApolloProvider } from '@apollo/client/react'
+import { SetContextLink } from '@apollo/client/link/context'
 
 // highlight-start
-const authLink = setContext((_, { headers }) => {
+const authLink = new SetContextLink((preContext) => {
   const token = localStorage.getItem('phonenumbers-user-token')
   return {
     headers: {
-      ...headers,
-      authorization: token ? `Bearer ${token}` : null,
-    }
+      ...preContext.headers,
+      authorization: token ? `Bearer ${token}` : '',
+    },
   }
 })
 // highlight-end
 
-const httpLink = createHttpLink({
-  uri: 'http://localhost:4000',
-})
+const httpLink = new HttpLink({ uri: 'http://localhost:4000' })
 
 const client = new ApolloClient({
   cache: new InMemoryCache(),