diff --git a/package-lock.json b/package-lock.json
index 7945df60..175f0e87 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5340,7 +5340,7 @@
},
"discontinuous-range": {
"version": "1.0.0",
- "resolved": "https://registry.npmjs.org/discontinuous-range/-/discontinuous-range-1.0.0.tgz",
+ "resolved": "https://registry.yarnpkg.com/discontinuous-range/-/discontinuous-range-1.0.0.tgz",
"integrity": "sha1-44Mx8IRLukm5qctxx3FYWqsbxlo=",
"dev": true
},
@@ -9346,7 +9346,7 @@
},
"is-subset": {
"version": "0.1.1",
- "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
+ "resolved": "https://registry.yarnpkg.com/is-subset/-/is-subset-0.1.1.tgz",
"integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY=",
"dev": true
},
@@ -10557,13 +10557,13 @@
},
"lodash.escape": {
"version": "4.0.1",
- "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-4.0.1.tgz",
+ "resolved": "https://registry.yarnpkg.com/lodash.escape/-/lodash.escape-4.0.1.tgz",
"integrity": "sha1-yQRGkMIeBClL6qUXcS/e0fqI3pg=",
"dev": true
},
"lodash.flattendeep": {
"version": "4.4.0",
- "resolved": "https://registry.npmjs.org/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz",
+ "resolved": "https://registry.yarnpkg.com/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz",
"integrity": "sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI=",
"dev": true
},
@@ -10575,7 +10575,7 @@
},
"lodash.isequal": {
"version": "4.5.0",
- "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+ "resolved": "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
"integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA=",
"dev": true
},
@@ -13817,7 +13817,7 @@
},
"railroad-diagrams": {
"version": "1.0.0",
- "resolved": "https://registry.npmjs.org/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz",
+ "resolved": "https://registry.yarnpkg.com/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz",
"integrity": "sha1-635iZ1SN3t+4mcG5Dlc3RVnN234=",
"dev": true
},
@@ -14977,7 +14977,7 @@
},
"rst-selector-parser": {
"version": "2.2.3",
- "resolved": "https://registry.npmjs.org/rst-selector-parser/-/rst-selector-parser-2.2.3.tgz",
+ "resolved": "https://registry.yarnpkg.com/rst-selector-parser/-/rst-selector-parser-2.2.3.tgz",
"integrity": "sha1-gbIw6i/MYGbInjRy3nlChdmwPZE=",
"dev": true,
"requires": {
diff --git a/src/App.js b/src/App.js
index ba40b7e8..5547e1e3 100644
--- a/src/App.js
+++ b/src/App.js
@@ -9,8 +9,9 @@ const App = (MainHeader, Home, MenuLayout, CreateServer) => () => (
-
+
+
diff --git a/src/common/AsideMenu.js b/src/common/AsideMenu.js
index 56e7d10c..433163ba 100644
--- a/src/common/AsideMenu.js
+++ b/src/common/AsideMenu.js
@@ -49,7 +49,11 @@ const AsideMenu = (DeleteServerButton) => {
Manage tags
-
+
);
diff --git a/src/servers/DeleteServerButton.js b/src/servers/DeleteServerButton.js
index 8d0caaff..e50610bc 100644
--- a/src/servers/DeleteServerButton.js
+++ b/src/servers/DeleteServerButton.js
@@ -7,25 +7,22 @@ import { serverType } from './prop-types';
const propTypes = {
server: serverType,
className: PropTypes.string,
+ textClassName: PropTypes.string,
+ children: PropTypes.node,
};
const DeleteServerButton = (DeleteServerModal) => {
- const DeleteServerButtonComp = ({ server, className }) => {
+ const DeleteServerButtonComp = ({ server, className, children, textClassName }) => {
const [ isModalOpen, setModalOpen ] = useState(false);
return (
- setModalOpen(true)}>
-
- Remove this server
+ setModalOpen(true)}>
+ {!children && }
+ {children || 'Remove this server'}
- setModalOpen(!isModalOpen)}
- server={server}
- key="deleteServerModal"
- />
+ setModalOpen(!isModalOpen)} />
);
};
diff --git a/src/servers/ServersListGroup.js b/src/servers/ServersListGroup.js
index 476922c1..55f8784a 100644
--- a/src/servers/ServersListGroup.js
+++ b/src/servers/ServersListGroup.js
@@ -26,7 +26,9 @@ ServerListItem.propTypes = {
const ServersListGroup = ({ servers, children }) => (
- {children}
+
+
{children}
+
{servers.length > 0 && (
{servers.map(({ id, name }) => )}
diff --git a/src/servers/helpers/ServerError.js b/src/servers/helpers/ServerError.js
index 96f1d449..7389d394 100644
--- a/src/servers/helpers/ServerError.js
+++ b/src/servers/helpers/ServerError.js
@@ -3,31 +3,48 @@ import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
import Message from '../../utils/Message';
import ServersListGroup from '../ServersListGroup';
+import { serverType } from '../prop-types';
import './ServerError.scss';
const propTypes = {
servers: PropTypes.object,
+ selectedServer: serverType,
type: PropTypes.oneOf([ 'not-found', 'not-reachable' ]).isRequired,
};
-export const ServerError = ({ type, servers: { list } }) => (
-
-
-
- {type === 'not-found' && 'Could not find this Shlink server.'}
- {type === 'not-reachable' && (
-
- Oops! Could not connect to this Shlink server.
- Make sure you have internet connection, and the server is properly configured and on-line.
-
- )}
-
-
-
- These are the {type === 'not-reachable' ? 'other' : ''} Shlink servers currently configured. Choose one of
- them or add a new one.
-
-
-);
+export const ServerError = (DeleteServerButton) => {
+ const ServerErrorComp = ({ type, servers: { list }, selectedServer }) => (
+
+
+
+ {type === 'not-found' && 'Could not find this Shlink server.'}
+ {type === 'not-reachable' && (
+
+ Oops! Could not connect to this Shlink server.
+ Make sure you have internet connection, and the server is properly configured and on-line.
+
+ )}
+
+
-ServerError.propTypes = propTypes;
+
+ These are the Shlink servers currently configured. Choose one of
+ them or add a new one.
+
+
+ {type === 'not-reachable' && (
+
+
+ Alternatively, if you think you may have miss-configured this server, you
+ can remove it or
+ edit it.
+
+
+ )}
+
+ );
+
+ ServerErrorComp.propTypes = propTypes;
+
+ return ServerErrorComp;
+};
diff --git a/src/servers/helpers/ServerError.scss b/src/servers/helpers/ServerError.scss
index 073758ae..a4d991b9 100644
--- a/src/servers/helpers/ServerError.scss
+++ b/src/servers/helpers/ServerError.scss
@@ -1,6 +1,15 @@
-.server-error-container {
+.server-error__container {
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
+
+.server-error__delete-btn {
+ color: #dc3545;
+ cursor: pointer;
+}
+
+.server-error__delete-btn:hover {
+ text-decoration: underline;
+}
diff --git a/src/servers/prop-types/index.js b/src/servers/prop-types/index.js
index 4bdb7355..221d946a 100644
--- a/src/servers/prop-types/index.js
+++ b/src/servers/prop-types/index.js
@@ -7,18 +7,14 @@ const regularServerType = PropTypes.shape({
apiKey: PropTypes.string,
version: PropTypes.string,
printableVersion: PropTypes.string,
+ serverNotReachable: PropTypes.bool,
});
const notFoundServerType = PropTypes.shape({
serverNotFound: PropTypes.bool.isRequired,
});
-const notReachableServerType = PropTypes.shape({
- serverNotReachable: PropTypes.bool.isRequired,
-});
-
export const serverType = PropTypes.oneOfType([
regularServerType,
notFoundServerType,
- notReachableServerType,
]);
diff --git a/src/servers/reducers/selectedServer.js b/src/servers/reducers/selectedServer.js
index 9d646458..75b1237a 100644
--- a/src/servers/reducers/selectedServer.js
+++ b/src/servers/reducers/selectedServer.js
@@ -49,7 +49,7 @@ export const selectServer = ({ findServerById }, buildShlinkApiClient) => (serve
} catch (e) {
dispatch({
type: SELECT_SERVER,
- selectedServer: { serverNotReachable: true },
+ selectedServer: { ...selectedServer, serverNotReachable: true },
});
}
};
diff --git a/src/servers/services/provideServices.js b/src/servers/services/provideServices.js
index 9991d15b..5533372f 100644
--- a/src/servers/services/provideServices.js
+++ b/src/servers/services/provideServices.js
@@ -33,8 +33,8 @@ const provideServices = (bottle, connect, withRouter) => {
bottle.serviceFactory('ForServerVersion', () => ForServerVersion);
bottle.decorator('ForServerVersion', connect([ 'selectedServer' ]));
- bottle.serviceFactory('ServerError', () => ServerError);
- bottle.decorator('ServerError', connect([ 'servers' ]));
+ bottle.serviceFactory('ServerError', ServerError, 'DeleteServerButton');
+ bottle.decorator('ServerError', connect([ 'servers', 'selectedServer' ]));
// Services
bottle.constant('csvjson', csvjson);