🔥 Remove depricated react-apollo and replace with @apollo/client

- add graphql and graphql-tag deps

app/templates/client/base/apolloClient.js

@@ -1,10 +1,9 @@
-import { ApolloClient } from "react-apollo";
+import { ApolloClient, InMemoryCache } from '@apollo/client';
+import { config } from "config";
+
+const { API_URI } = config;
 
 export default new ApolloClient({
-  dataIdFromObject: result => {
-    if (result.id && result.__typename) {
-      return result.__typename + result.id;
-    }
-    return null;
-  }
+  uri: API_URI,
+  cache: new InMemoryCache()
 });

app/templates/client/base/configureStore.js

@@ -1,13 +1,10 @@
-import { applyMiddleware, createStore } from "redux";
-import { composeWithDevTools } from "redux-devtools-extension/developmentOnly";
+import { createStore } from "redux";
 
-import apolloClient from "./apolloClient";
 import reducer from "./reducer";
 
 export default function configureStore() {
   const store = createStore(
-    reducer,
-    composeWithDevTools(applyMiddleware(apolloClient.middleware()))
+    reducer
   );
 
   if (module.hot) {

app/templates/client/base/reducer.js

@@ -1,9 +1,7 @@
 import { combineReducers } from "redux";
 
 import { reducer as appReducer } from "modules/app";
-import apolloClient from "./apolloClient";
 
 export default combineReducers({
-  app: appReducer,
-  apollo: apolloClient.reducer()
+  app: appReducer
 });

app/templates/client/config/index.js

@@ -0,0 +1,6 @@
+// eslint-disable-next-line no-process-env
+const { API_URI } = process.env;
+
+export const config = {
+  API_URI
+};

app/templates/client/index.js

@@ -4,7 +4,7 @@ import "material-design-icons/iconfont/material-icons.css";
 
 import React from "react";
 import ReactDOM from "react-dom";
-import { ApolloProvider } from "react-apollo";
+import { ApolloProvider } from "@apollo/client";
 import { ThemeProvider } from "react-css-themr";
 import { BrowserRouter } from "react-router-dom";
 

app/templates/package.json

@@ -3,11 +3,14 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@apollo/client": "^3.2.2",
     "@zeal/react-scripts": "^2.0.0",
     "babel-polyfill": "^6.23.0",
     "enzyme": "^2.8.2",
     "eslint": "3.19.0",
     "eslint-config-prettier": "^2.1.1",
+    "graphql": "^15.3.0",
+    "graphql-tag": "^2.11.0",
     "history": "^4.6.1",
     "husky": "^0.13.3",
     "lint-staged": "^3.5.0",
@@ -17,15 +20,13 @@
     "prettier": "^1.3.1",
     "ramda": "^0.23.0",
     "react": "^16.13.1",
-    "react-apollo": "^1.2.0",
     "react-css-themr": "^2.1.0",
     "react-dom": "^16.13.1",
     "react-redux": "^5.0.4",
     "react-router-dom": "^5.2.0",
     "react-test-renderer": "^16.13.1",
     "react-transition-group": "^1.1.3",
     "redux": "^3.6.0",
-    "redux-devtools-extension": "^2.13.2",
     "roboto-fontface": "^0.7.0",
     "sass-lint": "^1.10.2",
     "zeal-redux-utils": "^1.0.0"