Fix potentially inconsistent state update (#584)

Since `this.state` can be asynchronously updated, use the callback form

Signed-off-by: XhmikosR <xhmikosr@gmail.com>

src/components/common/EnableDisable.tsx

@@ -121,7 +121,9 @@ export class EnableDisable extends Component<
    * Toggle the custom time modal
    */
   toggleModal = () => {
-    this.setState({ customModalShown: !this.state.customModalShown });
+    this.setState(prevState => ({
+      customModalShown: !prevState.customModalShown
+    }));
   };
 
   /**

src/components/list/ListPage.tsx

@@ -79,16 +79,16 @@ export class ListPage extends Component<
   };
 
   onAdding = (domain: string) =>
-    this.setState({
-      message: this.props.t("Adding {{domain}}...", { domain }),
+    this.setState((prevState, prevProps) => ({
+      message: prevProps.t("Adding {{domain}}...", { domain }),
       messageType: "info"
-    });
+    }));
 
   onAlreadyAdded = (domain: string) =>
-    this.setState({
-      message: this.props.t("{{domain}} is already added", { domain }),
+    this.setState((prevState, prevProps) => ({
+      message: prevProps.t("{{domain}} is already added", { domain }),
       messageType: "danger"
-    });
+    }));
 
   onAdded = (domain: string) =>
     this.setState(prevState => ({
@@ -98,11 +98,11 @@ export class ListPage extends Component<
     }));
 
   onAddFailed = (domain: string, prevDomains: string[]) =>
-    this.setState({
+    this.setState((prevState, prevProps) => ({
       domains: prevDomains,
-      message: this.props.t("Failed to add {{domain}}", { domain }),
+      message: prevProps.t("Failed to add {{domain}}", { domain }),
       messageType: "danger"
-    });
+    }));
 
   onRemoved = (domain: string) =>
     this.setState(prevState => ({
@@ -110,11 +110,11 @@ export class ListPage extends Component<
     }));
 
   onRemoveFailed = (domain: string, prevDomains: string[]) =>
-    this.setState({
+    this.setState((prevState, prevProps) => ({
       domains: prevDomains,
-      message: this.props.t("Failed to remove {{domain}}", { domain }),
+      message: prevProps.t("Failed to remove {{domain}}", { domain }),
       messageType: "danger"
-    });
+    }));
 
   onRemove = (domain: string) => {
     if (this.state.domains.includes(domain)) {
@@ -139,10 +139,10 @@ export class ListPage extends Component<
   };
 
   handleValidationError = () => {
-    this.setState({
-      message: this.props.validationErrorMsg,
+    this.setState((prevState, prevProps) => ({
+      message: prevProps.validationErrorMsg,
       messageType: "danger"
-    });
+    }));
   };
 
   componentDidMount() {

src/components/log/QueryLog.tsx

@@ -227,13 +227,13 @@ class QueryLog extends Component<WithTranslation, QueryLogState> {
     this.updateHandler.promise
       .then(data => {
         // Update the log with the new queries
-        this.setState({
+        this.setState(prevState => ({
           loading: false,
           atEnd: data.cursor === null,
           cursor: data.cursor,
-          history: this.state.history.concat(data.history),
+          history: prevState.history.concat(data.history),
           filtersChanged: false
-        });
+        }));
       })
       .catch(ignoreCancel);
   };

src/components/settings/DNSInfo.tsx

@@ -101,15 +101,15 @@ class DNSInfo extends Component<WithTranslation, DNSInfoState> {
   }
 
   handleUpstreamAdd = (upstream: string) => {
-    this.setState({
-      upstreamDns: this.state.upstreamDns.concat(upstream)
-    });
+    this.setState(prevState => ({
+      upstreamDns: prevState.upstreamDns.concat(upstream)
+    }));
   };
 
   handleUpstreamRemove = (upstream: string) => {
-    this.setState({
-      upstreamDns: this.state.upstreamDns.filter(item => item !== upstream)
-    });
+    this.setState(prevState => ({
+      upstreamDns: prevState.upstreamDns.filter(item => item !== upstream)
+    }));
   };
 
   handleConditionalForwardingUpdate = (