1 files changed, 41 insertions, 0 deletions

diff --git a/src/components/services/content/ServiceDisabled.tsx b/src/components/services/content/ServiceDisabled.tsx
new file mode 100644
index 000000000..2f0d439ec
--- /dev/null
+++ b/src/components/services/content/ServiceDisabled.tsx
@@ -0,0 +1,41 @@
+import { Component, ReactElement } from 'react';
+import { observer } from 'mobx-react';
+import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl';
+import Button from '../../ui/button';
+import { H1 } from '../../ui/headline';
+
+const messages = defineMessages({
+  headline: {
+    id: 'service.disabledHandler.headline',
+    defaultMessage: '{name} is disabled',
+  },
+  action: {
+    id: 'service.disabledHandler.action',
+    defaultMessage: 'Enable {name}',
+  },
+});
+
+interface IProps extends WrappedComponentProps {
+  name: string;
+  enable: () => void;
+}
+
+@observer
+class ServiceDisabled extends Component<IProps> {
+  render(): ReactElement {
+    const { name, enable, intl } = this.props;
+
+    return (
+      <div className="services__info-layer">
+        <H1>{intl.formatMessage(messages.headline, { name })}</H1>
+        <Button
+          label={intl.formatMessage(messages.action, { name })}
+          buttonType="inverted"
+          onClick={() => enable()}
+        />
+      </div>
+    );
+  }
+}
+
+export default injectIntl(ServiceDisabled);