- client: add message when dns server is starting up

client/src/components/App/index.js

@@ -29,6 +29,7 @@ import UpdateOverlay from '../ui/UpdateOverlay';
 import EncryptionTopline from '../ui/EncryptionTopline';
 import Icons from '../ui/Icons';
 import i18n from '../../i18n';
+import Loading from '../ui/Loading';
 
 class App extends Component {
     componentDidMount() {
@@ -41,8 +42,8 @@ class App extends Component {
         }
     }
 
-    handleStatusChange = () => {
-        this.props.enableDns();
+    reloadPage = () => {
+        window.location.reload();
     };
 
     handleUpdate = () => {
@@ -88,10 +89,13 @@ class App extends Component {
                     <LoadingBar className="loading-bar" updateTime={1000} />
                     <Route component={Header} />
                     <div className="container container--wrap">
-                        {!dashboard.processing && !dashboard.isCoreRunning && (
+                        {dashboard.processing && !dashboard.isCoreRunning && (
                             <div className="row row-cards">
                                 <div className="col-lg-12">
-                                    <Status handleStatusChange={this.handleStatusChange} />
+                                    <Status reloadPage={this.reloadPage}
+                                            message="dns_start"
+                                    />
+                                    <Loading />
                                 </div>
                             </div>
                         )}

client/src/components/Dashboard/index.js

@@ -41,10 +41,7 @@ class Dashboard extends Component {
 
     render() {
         const { dashboard, stats, t } = this.props;
-        const dashboardProcessing =
-            dashboard.processing ||
-            stats.processingStats ||
-            stats.processingGetConfig;
+        const statsProcessing = stats.processingStats || stats.processingGetConfig;
 
         const subtitle =
             stats.interval === 1
@@ -81,8 +78,8 @@ class Dashboard extends Component {
                         {refreshFullButton}
                     </div>
                 </PageTitle>
-                {dashboardProcessing && <Loading />}
-                {!dashboardProcessing && (
+                {statsProcessing && <Loading />}
+                {!statsProcessing && (
                     <div className="row row-cards">
                         <div className="col-lg-12">
                             <Statistics

client/src/components/ui/Status.js

@@ -1,23 +1,27 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import Card from '../ui/Card';
 
-const Status = props => (
+const Status = ({ message, buttonMessage, reloadPage }) => (
     <div className="status">
         <Card bodyType="card-body card-body--status">
             <div className="h4 font-weight-light mb-4">
-                You are currently not using AdGuard Home
+                <Trans>{message}</Trans>
             </div>
-            <button className="btn btn-success" onClick={props.handleStatusChange}>
-                Enable AdGuard Home
-            </button>
+            {buttonMessage &&
+            <button className="btn btn-success" onClick={reloadPage}>
+                <Trans>{buttonMessage}</Trans>
+            </button>}
         </Card>
     </div>
 );
 
 Status.propTypes = {
-    handleStatusChange: PropTypes.func.isRequired,
+    message: PropTypes.string.isRequired,
+    buttonMessage: PropTypes.string,
+    reloadPage: PropTypes.func,
 };
 
-export default Status;
+export default withNamespaces()(Status);