Refetch on order update

src/Fetcher.js

@@ -12,6 +12,7 @@ class Fetcher extends React.Component {
       isLoading: true,
       error: null,
       url: null,
+      refetch: null,
     };
   }
 
@@ -54,9 +55,12 @@ class Fetcher extends React.Component {
   }
 
   render() {
-    // A hack to get it to fetch when url changes
-    if (this.state.url !== this.props.url) {
-      this.setState({ url: this.props.url });
+    // A hack to get it to fetch when url or refetch changes
+    if (
+      this.state.url !== this.props.url ||
+      this.state.refetch !== this.props.refetch
+    ) {
+      this.setState({ url: this.props.url, refetch: this.props.refetch });
       this.fetch();
     }
 

src/order/ShowOrder.js

@@ -91,6 +91,7 @@ class ShowOrder extends React.Component {
       transaction: null,
       isLoading: false,
       redirect: false,
+      refetch: 0,
       error: null,
     };
   }
@@ -118,7 +119,7 @@ class ShowOrder extends React.Component {
   }
 
   onSend(transaction) {
-    this.setState({ transaction });
+    this.setState({ transaction, refetch: this.state.refetch + 1 });
   }
 
   setData(data) {
@@ -184,7 +185,11 @@ class ShowOrder extends React.Component {
     }
 
     return (
-      <Fetcher url={"/api/order/" + id} onFetch={(data) => this.setData(data)}>
+      <Fetcher
+        url={"/api/order/" + id}
+        onFetch={(data) => this.setData(data)}
+        refetch={this.state.refetch}
+      >
         {this.state.error && <Alert variant="danger">{this.state.error}</Alert>}
         <Row>
           <Col>