From 6eb838e75013235bb1aa24ddf7bbd5dd0a42ec8b Mon Sep 17 00:00:00 2001
From: Ernst Widerberg <ernst@sunet.se>
Date: Thu, 25 Nov 2021 10:54:42 +0100
Subject: Fix race condition

Use localStorage only in root App, pass token as prop to child
components.
---
 src/components/App.js        | 16 +++++++++++-----
 src/components/List.js       |  2 +-
 src/components/Login.js      |  2 +-
 src/components/ObjectView.js |  2 +-
 4 files changed, 14 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/components/App.js b/src/components/App.js
index 636c672..cc89ca8 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -30,13 +30,13 @@ class App extends React.Component {
     }
 
     setToken(token) {
-        this.setState({ token: token });
         localStorage.setItem("token", token);
+        this.setState({ token: token });
     }
 
     clearToken() {
-        this.setState({ token: null });
         localStorage.removeItem("token");
+        this.setState({ token: null });
     }
 
     setError(e) {
@@ -63,10 +63,16 @@ class App extends React.Component {
                 <Header clearToken={this.clearToken} />
                 <Switch>
                     <Route path="/:id">
-                        <MakeObjectView setError={this.setError} />
+                        <MakeObjectView
+                            token={this.state.token}
+                            setError={this.setError}
+                        />
                     </Route>
                     <Route path="/">
-                        <List setError={this.setError} />
+                        <List
+                            token={this.state.token}
+                            setError={this.setError}
+                        />
                     </Route>
                 </Switch>
             </Router>
@@ -76,7 +82,7 @@ class App extends React.Component {
 
 function MakeObjectView(props) {
     let { id } = useParams();
-    return <ObjectView id={id} setError={props.setError} />;
+    return <ObjectView id={id} token={props.token} setError={props.setError} />;
 }
 
 export default App;
diff --git a/src/components/List.js b/src/components/List.js
index e526c4b..8b48307 100644
--- a/src/components/List.js
+++ b/src/components/List.js
@@ -54,7 +54,7 @@ class List extends React.Component {
     getData() {
         fetch(`${process.env.COLLECTOR_URL}/sc/v0/get?${this.queryString()}`, {
             headers: {
-                Authorization: "Bearer " + localStorage.getItem("token")
+                Authorization: "Bearer " + this.props.token
             }
         })
             // TODO: Look at `status` or return code or both?
diff --git a/src/components/Login.js b/src/components/Login.js
index 4339539..c64ead0 100644
--- a/src/components/Login.js
+++ b/src/components/Login.js
@@ -49,7 +49,7 @@ class Login extends React.Component {
     }
 
     logout() {
-        localStorage.removeItem("token");
+        this.props.clearToken();
     }
 
     render() {
diff --git a/src/components/ObjectView.js b/src/components/ObjectView.js
index fda636b..5e2121a 100644
--- a/src/components/ObjectView.js
+++ b/src/components/ObjectView.js
@@ -19,7 +19,7 @@ class ObjectView extends React.Component {
     getData() {
         fetch(`${process.env.COLLECTOR_URL}/sc/v0/get/${this.props.id}`, {
             headers: {
-                Authorization: "Bearer " + localStorage.getItem("token")
+                Authorization: "Bearer " + this.props.token
             }
         })
             // TODO: Look at `status` or return code or both?
-- 
cgit v1.1