3 files changed, 84 insertions, 9 deletions

diff --git a/src/features/workspaces/components/EditWorkspaceForm.js b/src/features/workspaces/components/EditWorkspaceForm.js
index bba4485ff..e602ebd5a 100644
--- a/src/features/workspaces/components/EditWorkspaceForm.js
+++ b/src/features/workspaces/components/EditWorkspaceForm.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
@@ -36,6 +36,14 @@ const messages = defineMessages({
     id: 'settings.workspace.form.servicesInWorkspaceHeadline',
     defaultMessage: '!!!Services in this Workspace',
   },
+  noServicesAdded: {
+    id: 'settings.services.noServicesAdded',
+    defaultMessage: '!!!You haven\'t added any services yet.',
+  },
+  discoverServices: {
+    id: 'settings.services.discoverServices',
+    defaultMessage: '!!!Discover services',
+  },
 });
 
 const styles = () => ({
@@ -150,14 +158,29 @@ class EditWorkspaceForm extends Component {
           </div>
           <h2>{intl.formatMessage(messages.servicesInWorkspaceHeadline)}</h2>
           <div className={classes.serviceList}>
-            {services.map(s => (
-              <WorkspaceServiceListItem
-                key={s.id}
-                service={s}
-                isInWorkspace={workspaceServices.includes(s.id)}
-                onToggle={() => this.toggleService(s)}
-              />
-            ))}
+            {services.length === 0 ? (
+              <div className="align-middle settings__empty-state">
+                {/* ===== Empty state ===== */}
+                <p className="settings__empty-text">
+                  <span className="emoji">
+                    <img src="./assets/images/emoji/sad.png" alt="" />
+                  </span>
+                  {intl.formatMessage(messages.noServicesAdded)}
+                </p>
+                <Link to="/settings/recipes" className="button">{intl.formatMessage(messages.discoverServices)}</Link>
+              </div>
+            ) : (
+              <Fragment>
+                {services.map(s => (
+                  <WorkspaceServiceListItem
+                    key={s.id}
+                    service={s}
+                    isInWorkspace={workspaceServices.includes(s.id)}
+                    onToggle={() => this.toggleService(s)}
+                  />
+                ))}
+              </Fragment>
+            )}
           </div>
         </div>
         <div className="settings__controls">
diff --git a/src/i18n/locales/defaultMessages.json b/src/i18n/locales/defaultMessages.json
index df7f04a06..e662ea6b9 100644
--- a/src/i18n/locales/defaultMessages.json
+++ b/src/i18n/locales/defaultMessages.json
@@ -3347,6 +3347,32 @@
           "column": 31,
           "line": 35
         }
+      },
+      {
+        "defaultMessage": "!!!You haven't added any services yet.",
+        "end": {
+          "column": 3,
+          "line": 42
+        },
+        "file": "src/features/workspaces/components/EditWorkspaceForm.js",
+        "id": "settings.services.noServicesAdded",
+        "start": {
+          "column": 19,
+          "line": 39
+        }
+      },
+      {
+        "defaultMessage": "!!!Discover services",
+        "end": {
+          "column": 3,
+          "line": 46
+        },
+        "file": "src/features/workspaces/components/EditWorkspaceForm.js",
+        "id": "settings.services.discoverServices",
+        "start": {
+          "column": 20,
+          "line": 43
+        }
       }
     ],
     "path": "src/features/workspaces/components/EditWorkspaceForm.json"
diff --git a/src/i18n/messages/src/features/workspaces/components/EditWorkspaceForm.json b/src/i18n/messages/src/features/workspaces/components/EditWorkspaceForm.json
index 7b0c3e1ce..20ed99f8d 100644
--- a/src/i18n/messages/src/features/workspaces/components/EditWorkspaceForm.json
+++ b/src/i18n/messages/src/features/workspaces/components/EditWorkspaceForm.json
@@ -63,5 +63,31 @@
       "line": 38,
       "column": 3
     }
+  },
+  {
+    "id": "settings.services.noServicesAdded",
+    "defaultMessage": "!!!You haven't added any services yet.",
+    "file": "src/features/workspaces/components/EditWorkspaceForm.js",
+    "start": {
+      "line": 39,
+      "column": 19
+    },
+    "end": {
+      "line": 42,
+      "column": 3
+    }
+  },
+  {
+    "id": "settings.services.discoverServices",
+    "defaultMessage": "!!!Discover services",
+    "file": "src/features/workspaces/components/EditWorkspaceForm.js",
+    "start": {
+      "line": 43,
+      "column": 20
+    },
+    "end": {
+      "line": 46,
+      "column": 3
+    }
   }
 ]
\ No newline at end of file