diff --git a/src/lib/cloud-manager-hoc.jsx b/src/lib/cloud-manager-hoc.jsx
index 407b50c99..a78239b80 100644
--- a/src/lib/cloud-manager-hoc.jsx
+++ b/src/lib/cloud-manager-hoc.jsx
@@ -48,9 +48,7 @@ const cloudManagerHOC = function (WrappedComponent) {
             this.disconnectFromCloud();
         }
         canUseCloud (props) {
-            // TODO add a canUseCloud to pass down to this HOC (e.g. from www) and also check that here.
-            // This should cover info about the website specifically, like scrather status
-            return !!(props.cloudHost && props.username && props.vm && props.projectId);
+            return !!(props.cloudHost && props.username && props.vm && props.projectId && props.hasCloudPermission);
         }
         shouldNotModifyCloudData (props) {
             return (props.hasEverEnteredEditor && !props.canSave);
@@ -92,7 +90,7 @@ const cloudManagerHOC = function (WrappedComponent) {
         handleCloudDataUpdate (projectHasCloudData) {
             if (this.isConnected() && !projectHasCloudData) {
                 this.disconnectFromCloud();
-            } else if (!this.isConnected() && projectHasCloudData) {
+            } else if (!this.isConnected() && this.canUseCloud(this.props) && projectHasCloudData) {
                 this.connectToCloud();
             }
         }
@@ -102,6 +100,7 @@ const cloudManagerHOC = function (WrappedComponent) {
                 cloudHost,
                 projectId,
                 username,
+                hasCloudPermission,
                 hasEverEnteredEditor,
                 isShowingWithId,
                 /* eslint-enable no-unused-vars */
@@ -121,6 +120,7 @@ const cloudManagerHOC = function (WrappedComponent) {
     CloudManager.propTypes = {
         canSave: PropTypes.bool.isRequired,
         cloudHost: PropTypes.string,
+        hasCloudPermission: PropTypes.bool,
         hasEverEnteredEditor: PropTypes.bool,
         isShowingWithId: PropTypes.bool,
         projectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
diff --git a/test/unit/util/cloud-manager-hoc.test.jsx b/test/unit/util/cloud-manager-hoc.test.jsx
index 84e4687cc..977b5045f 100644
--- a/test/unit/util/cloud-manager-hoc.test.jsx
+++ b/test/unit/util/cloud-manager-hoc.test.jsx
@@ -59,6 +59,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -76,6 +77,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 store={store}
                 username="user"
                 vm={vm}
@@ -93,6 +95,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 vm={vm}
@@ -109,6 +112,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={stillLoadingStore}
                 username="user"
@@ -119,12 +123,31 @@ describe('CloudManagerHOC', () => {
         expect(CloudProvider).not.toHaveBeenCalled();
     });
 
+    test('when hasCloudPermission is false, the cloud provider is not set on the vm', () => {
+        const Component = () => <div />;
+        const WrappedComponent = cloudManagerHOC(Component);
+        mount(
+            <WrappedComponent
+                canSave
+                cloudHost="nonEmpty"
+                hasCloudPermission={false}
+                store={store}
+                username="user"
+                vm={vm}
+            />
+        );
+
+        expect(vm.setCloudProvider.mock.calls.length).toBe(0);
+        expect(CloudProvider).not.toHaveBeenCalled();
+    });
+
     test('if the isShowingWithId prop becomes true, it sets the cloud provider on the vm', () => {
         const Component = () => <div />;
         const WrappedComponent = cloudManagerHOC(Component);
         const mounted = mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={stillLoadingStore}
                 username="user"
@@ -146,6 +169,7 @@ describe('CloudManagerHOC', () => {
         const mounted = mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={stillLoadingStore}
                 username="user"
@@ -172,6 +196,7 @@ describe('CloudManagerHOC', () => {
         const mounted = mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -197,6 +222,7 @@ describe('CloudManagerHOC', () => {
         const mounted = mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -223,6 +249,7 @@ describe('CloudManagerHOC', () => {
         const mounted = mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -253,6 +280,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -273,6 +301,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -297,6 +326,7 @@ describe('CloudManagerHOC', () => {
         mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -322,6 +352,7 @@ describe('CloudManagerHOC', () => {
         const mounted = mount(
             <WrappedComponent
                 canSave
+                hasCloudPermission
                 cloudHost="nonEmpty"
                 store={store}
                 username="user"
@@ -347,6 +378,7 @@ describe('CloudManagerHOC', () => {
         const WrappedComponent = cloudManagerHOC(Component);
         const mounted = mount(
             <WrappedComponent
+                hasCloudPermission
                 canSave={false}
                 cloudHost="nonEmpty"
                 store={store}