From 5a29276f0bc5af28456049afa75a4a2f7feae69b Mon Sep 17 00:00:00 2001
From: Salman Dabbakuti <dabbakutisalman@gmail.com>
Date: Sat, 20 Nov 2021 10:50:09 +0530
Subject: [PATCH] updated: passing graphql client to props of all components

---
 client/src/Account.js |  6 ++----
 client/src/App.js     | 13 ++++++++++---
 client/src/Home.js    | 11 ++---------
 3 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/client/src/Account.js b/client/src/Account.js
index 4874b4f..4af79a6 100644
--- a/client/src/Account.js
+++ b/client/src/Account.js
@@ -1,10 +1,8 @@
 import { useState, useEffect } from 'react'
-import { GraphQLClient, gql } from 'graphql-request';
-
-const client = new GraphQLClient(process.env.REACT_APP_API_URL || 'http://localhost:4000');
+import { gql } from 'graphql-request';
 
 export default function Account(props) {
-
+  const { client } = props;
   const [loading, setLoading] = useState(true)
   const [user, setUser] = useState({ firstName: '', lastName: '', phone: '', email: '' });
 
diff --git a/client/src/App.js b/client/src/App.js
index a865c18..e005d20 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -1,14 +1,21 @@
 import { BrowserRouter, Route, Switch } from "react-router-dom";
-
+import { GraphQLClient } from 'graphql-request';
 import Home from "./Home";
 import Account from "./Account";
 
+const token = localStorage.getItem('TOKEN');
+const client = new GraphQLClient(process.env.REACT_APP_API_URL || 'http://localhost:4000', {
+  headers: {
+    authorization: token ? `Bearer ${token}` : ''
+  }
+});
+
 export default function App() {
   return (
     <BrowserRouter>
       <Switch>
-        <Route exact path="/" component={Home} />
-        <Route exact path="/user/:token" component={Account} />
+        <Route exact path="/" render={() => <Home client={client} />} />
+        <Route exact path="/user/:token" render={(props) => <Account {...props} client={client} />} />
         <Route render={() => <h1>Not Found</h1>} />
       </Switch >
     </BrowserRouter>
diff --git a/client/src/Home.js b/client/src/Home.js
index 2e614e7..70fd103 100644
--- a/client/src/Home.js
+++ b/client/src/Home.js
@@ -1,16 +1,9 @@
 
 import { useState } from 'react'
-import { GraphQLClient, gql } from 'graphql-request';
+import { gql } from 'graphql-request';
 import './index.css'
 
-const token = localStorage.getItem('TOKEN');
-const client = new GraphQLClient(process.env.REACT_APP_API_URL || 'http://localhost:4000', {
-  headers: {
-    authorization: token ? `Bearer ${token}` : ''
-  }
-});
-
-export default function Home() {
+export default function Home({ client }) {
   const [email, setEmail] = useState('');
   const [loading, setLoading] = useState(false);