From 29c2de3d58a66d3b557386593ba6e11c84cffeb6 Mon Sep 17 00:00:00 2001
From: Oleksii Kurinnyi <okurinny@redhat.com>
Date: Wed, 13 Nov 2019 15:22:21 +0200
Subject: [PATCH] [UD] Add ability to create a new workspace from the dashboard
 with a devfile (#15143)

* Remove unused directives.

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* Add `ready-to-go-stacks` directive.

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* Add `import-custom-stack` directive.

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* Adapt workspace creating flow in order to use `ready-to-go-stacks` and `import-custom-stack`

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* fix license headers

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* Fix selenium test

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* Fix compilation warnings

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

* fix workspace name applying

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>
---
 .../after-creation-dialog.controller.ts       |  56 ---
 .../after-creation-dialog.html                |  35 --
 .../after-creation-dialog.styl                |   5 -
 .../create-workspace.controller.ts            | 321 +++++-------------
 .../create-workspace/create-workspace.html    | 130 ++++---
 .../create-workspace.service.ts               |  67 ++--
 .../create-workspace/create-workspace.styl    |  50 ++-
 .../devfile-by-url.controller.ts              |  61 ++++
 .../devfile-by-url.directive.ts               |  48 +++
 .../devfile-by-url/devfile-by-url.html        |  48 +++
 .../devfile-by-url/devfile-by-url.styl        |  28 ++
 .../devfile-source-selector.directive.ts      |  59 ++++
 .../devfile-source-selector.html              |  18 +
 .../devfile-source-selector.styl              |  37 ++
 .../import-custom-stack.controller.ts         | 110 ++++++
 .../import-custom-stack.directive.ts          |  43 +++
 .../import-custom-stack.html                  |  25 ++
 .../import-custom-stack.styl                  |  24 ++
 .../ram-settings-machine-item.controller.ts   |  40 ---
 .../ram-settings-machine-item.directive.ts    |  44 ---
 .../ram-settings-machine-item.html            |  53 ---
 .../ram-settings-machine-item.styl            |  32 --
 .../ram-settings/ram-settings.controller.ts   | 109 ------
 .../ram-settings/ram-settings.directive.ts    |  43 ---
 .../ram-settings/ram-settings.html            |  14 -
 .../ram-settings/ram-settings.styl            |   6 -
 .../devfile-selector.controller.ts            |   4 +-
 .../devfile-selector.directive.ts             |   2 +-
 .../devfile-selector/devfile-selector.html    |   0
 .../devfile-selector/devfile-selector.styl    |   0
 .../namespace-selector.controller.ts          |   0
 .../namespace-selector.directive.ts           |   2 +-
 .../namespace-selector.html                   |   0
 .../namespace-selector.service.ts             |   4 +-
 .../namespace-selector.styl                   |   0
 .../add-import-project.controller.ts          |   0
 .../add-import-project.directive.ts           |   4 +-
 .../add-import-project.html                   |   0
 .../add-import-project.service.ts             |   2 +-
 .../add-import-project.styl                   |   0
 .../import-blank-project.controller.ts        |   0
 .../import-blank-project.directive.ts         |   2 +-
 .../import-blank-project.html                 |   0
 .../import-blank-project.service.ts           |   0
 .../import-blank-project.styl                 |   0
 .../import-git-project.controller.ts          |   0
 .../import-git-project.directive.ts           |   2 +-
 .../import-git-project.html                   |   0
 .../import-git-project.service.ts             |   0
 .../import-git-project.styl                   |   0
 .../github-repository-interface.ts            |   0
 .../github-repository-item.directive.ts       |   2 +-
 .../github-repository-item.html               |   0
 .../github-repository-item.styl               |   0
 .../import-github-project.controller.ts       |   4 +-
 .../import-github-project.directive.ts        |   2 +-
 .../import-github-project.html                |   0
 .../import-github-project.service.ts          |   2 +-
 .../import-github-project.styl                |   0
 .../no-github-oauth-dialog.controller.ts      |   0
 .../oauth-dialog/no-github-oauth-dialog.html  |   0
 .../oauth-dialog/no-github-oauth-dialog.styl  |   0
 .../import-zip-project.controller.ts          |   0
 .../import-zip-project.directive.ts           |   2 +-
 .../import-zip-project.html                   |   0
 .../import-zip-project.service.ts             |   0
 .../import-zip-project.styl                   |   0
 .../template-selector-item.directive.ts       |   2 +-
 .../template-selector-item.html               |   0
 .../template-selector-item.styl               |   0
 .../template-selector.controller.ts           |   0
 .../template-selector.directive.ts            |   2 +-
 .../template-selector/template-selector.html  |   0
 .../template-selector.service.ts              |   0
 .../template-selector/template-selector.styl  |   0
 .../edit-project/edit-project.controller.ts   |   0
 .../edit-project/edit-project.directive.ts    |   2 +-
 .../edit-project/edit-project.html            |   0
 .../edit-project/edit-project.service.ts      |   2 +-
 .../edit-project/edit-project.styl            |   0
 .../project-metadata.controller.ts            |   0
 .../project-metadata.directive.ts             |   2 +-
 .../project-metadata/project-metadata.html    |   0
 .../project-metadata.service.ts               |   0
 .../project-metadata/project-metadata.styl    |   0
 ...roject-source-selector-action-type.enum.ts |   0
 ...roject-source-selector-editing-progress.ts |   0
 .../project-source-selector.controller.ts     |  43 ++-
 .../project-source-selector.directive.ts      |  12 +-
 .../project-source-selector.html              |   4 +-
 .../project-source-selector.service.ts        |   2 +-
 .../project-source-selector.styl              |   0
 .../project-source.enum.ts                    |   0
 .../ready-to-go-stacks.controller.ts          | 239 +++++++++++++
 .../ready-to-go-stacks.directive.ts           |  38 +++
 .../ready-to-go-stacks.html                   |  56 +++
 .../ready-to-go-stacks.styl                   |   2 +
 .../workspaces/workspace-config.service.ts    |   6 +-
 .../workspace-devfile-editor.controller.ts    |  26 +-
 .../workspace-devfile-editor.directive.ts     |   3 +-
 .../devfile/workspace-devfile-editor.html     |   7 +-
 .../devfile/workspace-devfile-editor.styl     |   6 -
 .../workspace-details-config.ts               |   2 +-
 .../workspace-editors/workspace-editors.styl  |   2 +-
 .../workspace-details-overview.controller.ts  |   3 +-
 src/app/workspaces/workspaces-config.ts       |  93 ++---
 src/components/api/che-factory.factory.ts     |  43 ++-
 .../che-multi-transclude.directive.ts         |   2 +-
 .../notification/che-notification.factory.ts  |   2 +-
 .../che-ui-elements-injector.service.ts       |   8 +-
 .../custom-async-validator.directive.ts       |  39 ++-
 .../che-toggle-button-popover.directive.ts    |   2 +-
 .../popover/che-toggle-popover.directive.ts   |   4 +-
 .../show-area/che-show-area.directive.ts      |  44 ++-
 .../widget/show-area/che-show-area.html       |  13 +-
 .../widget/show-area/che-show-area.styl       |   1 -
 src/components/widget/tab/che-tab.styl        |   9 +-
 117 files changed, 1290 insertions(+), 971 deletions(-)
 delete mode 100644 src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.controller.ts
 delete mode 100644 src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.html
 delete mode 100644 src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.styl
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.controller.ts
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.directive.ts
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.html
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.styl
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.directive.ts
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.html
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.styl
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.controller.ts
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.directive.ts
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.html
 create mode 100644 src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.styl
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.controller.ts
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.directive.ts
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.html
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.styl
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings.controller.ts
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings.directive.ts
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings.html
 delete mode 100644 src/app/workspaces/create-workspace/ram-settings/ram-settings.styl
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/devfile-selector/devfile-selector.controller.ts (91%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/devfile-selector/devfile-selector.directive.ts (88%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/devfile-selector/devfile-selector.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/devfile-selector/devfile-selector.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/namespace-selector/namespace-selector.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/namespace-selector/namespace-selector.directive.ts (88%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/namespace-selector/namespace-selector.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/namespace-selector/namespace-selector.service.ts (96%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/namespace-selector/namespace-selector.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/add-import-project.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/add-import-project.directive.ts (83%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/add-import-project.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/add-import-project.service.ts (99%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/add-import-project.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts (84%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-blank-project/import-blank-project.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-blank-project/import-blank-project.service.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-blank-project/import-blank-project.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-git-project/import-git-project.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts (83%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-git-project/import-git-project.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-git-project/import-git-project.service.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-git-project/import-git-project.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/github-repository-interface.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts (79%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts (97%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts (83%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/import-github-project.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts (99%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/import-github-project.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts (83%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-zip-project/import-zip-project.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-zip-project/import-zip-project.service.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/import-zip-project/import-zip-project.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts (80%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector.directive.ts (84%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector.service.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/add-import-project/template-selector/template-selector.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/edit-project.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/edit-project.directive.ts (86%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/edit-project.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/edit-project.service.ts (97%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/edit-project.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/project-metadata/project-metadata.controller.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts (86%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/project-metadata/project-metadata.html (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/project-metadata/project-metadata.service.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/edit-project/project-metadata/project-metadata.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector-action-type.enum.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector-editing-progress.ts (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector.controller.ts (83%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector.directive.ts (91%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector.html (91%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector.service.ts (98%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source-selector.styl (100%)
 rename src/app/workspaces/create-workspace/{ => ready-to-go-stacks}/project-source-selector/project-source.enum.ts (100%)
 create mode 100644 src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts
 create mode 100644 src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.directive.ts
 create mode 100644 src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html
 create mode 100644 src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl

diff --git a/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.controller.ts b/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.controller.ts
deleted file mode 100644
index 04f12395b2b..00000000000
--- a/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.controller.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-/*
- * Copyright (c) 2015-2018 Red Hat, Inc.
- * This program and the accompanying materials are made
- * available under the terms of the Eclipse Public License 2.0
- * which is available at https://www.eclipse.org/legal/epl-2.0/
- *
- * SPDX-License-Identifier: EPL-2.0
- *
- * Contributors:
- *   Red Hat, Inc. - initial API and implementation
- */
-'use strict';
-
-export class AfterCreationDialogController {
-
-  static $inject = ['$mdDialog'];
-
-  /**
-   * Service for displaying dialogs.
-   */
-  private $mdDialog: ng.material.IDialogService;
-
-  /**
-   * Default constructor that is using resource
-   */
-  constructor($mdDialog: ng.material.IDialogService) {
-    this.$mdDialog = $mdDialog;
-  }
-
-  $onInit(): void {
-    // this method won't be called here
-    // place all initialization code in constructor
-  }
-
-  /**
-   * It will hide the dialog box.
-   */
-  close(): void {
-    this.$mdDialog.cancel();
-  }
-
-  /**
-   * Opens a workspace in IDE.
-   */
-  openWorkspace(): any {
-    return this.$mdDialog.hide();
-  }
-
-  /**
-   * Opens the Workspace Details page.
-   */
-  editWorkspace(): void {
-    this.$mdDialog.cancel();
-  }
-
-}
diff --git a/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.html b/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.html
deleted file mode 100644
index 913f20f9449..00000000000
--- a/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!--
-
-    Copyright (c) 2015-2018 Red Hat, Inc.
-    This program and the accompanying materials are made
-    available under the terms of the Eclipse Public License 2.0
-    which is available at https://www.eclipse.org/legal/epl-2.0/
-
-    SPDX-License-Identifier: EPL-2.0
-
-    Contributors:
-      Red Hat, Inc. - initial API and implementation
-
--->
-<che-popup title="Workspace Is Created"
-           on-close="afterCreationDialogController.close()">
-  <div class="after-creation-dialog">
-
-    <div class="after-creation-dialog-content">
-      <p>Workspace was successfully created.</p>
-      <p>You may continue editing workspace or open it in IDE.</p>
-    </div>
-
-    <div flex
-         layout="row"
-         layout-align="end center">
-      <che-button-primary che-button-title="Edit"
-                          ng-click="afterCreationDialogController.editWorkspace()">
-      </che-button-primary>
-      <che-button-default che-button-title="Open In IDE"
-                          ng-click="afterCreationDialogController.openWorkspace()">
-      </che-button-default>
-    </div>
-
-  </div>
-</che-popup>
diff --git a/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.styl b/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.styl
deleted file mode 100644
index 1cd06b074e4..00000000000
--- a/src/app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.styl
+++ /dev/null
@@ -1,5 +0,0 @@
-.after-creation-dialog
-  width 100%
-
-  .after-creation-dialog-content
-    margin 20px 0
diff --git a/src/app/workspaces/create-workspace/create-workspace.controller.ts b/src/app/workspaces/create-workspace/create-workspace.controller.ts
index d7449e01450..af6f15c01a1 100644
--- a/src/app/workspaces/create-workspace/create-workspace.controller.ts
+++ b/src/app/workspaces/create-workspace/create-workspace.controller.ts
@@ -11,18 +11,27 @@
  */
 'use strict';
 
-import {CheEnvironmentRegistry} from '../../../components/api/environment/che-environment-registry.factory';
-import {EnvironmentManager} from '../../../components/api/environment/environment-manager';
-import {IEnvironmentManagerMachine} from '../../../components/api/environment/environment-manager-machine';
-import {CreateWorkspaceSvc} from './create-workspace.service';
-import {NamespaceSelectorSvc} from './namespace-selector/namespace-selector.service';
-import {RandomSvc} from '../../../components/utils/random.service';
-import {CheNotification} from '../../../components/notification/che-notification.factory';
+import { CreateWorkspaceSvc } from './create-workspace.service';
 import {
   ICheButtonDropdownMainAction,
   ICheButtonDropdownOtherAction
 } from '../../../components/widget/button-dropdown/che-button-dropdown.directive';
-import {DevfileRegistry} from '../../../components/api/devfile-registry.factory';
+
+/**
+ * View tabs.
+ */
+enum TABS {
+  READY_TO_GO,
+  IMPORT_DEVFILE
+}
+
+/**
+ *
+ */
+type DevfileChangeEventData = {
+  devfile: che.IWorkspaceDevfile,
+  attrs?: { [key: string]: string }
+};
 
 /**
  * This class is handling the controller for workspace creation.
@@ -31,115 +40,76 @@ import {DevfileRegistry} from '../../../components/api/devfile-registry.factory'
  */
 export class CreateWorkspaceController {
 
-  static $inject = ['$mdDialog', '$timeout', 'cheEnvironmentRegistry', 'createWorkspaceSvc', 'namespaceSelectorSvc',
-   'randomSvc', '$log', 'cheNotification', 'devfileRegistry'];
+  static $inject = [
+    '$location',
+    '$scope',
+    'createWorkspaceSvc',
+  ];
 
   /**
-   * Dropdown button config.
-   */
-  headerCreateButtonConfig: {
-    mainAction: ICheButtonDropdownMainAction,
-    otherActions: Array<ICheButtonDropdownOtherAction>
-  };
-  private $mdDialog: ng.material.IDialogService;
-  /**
-   * Timeout service.
-   */
-  private $timeout: ng.ITimeoutService;
-  /**
-   * The registry of environment managers.
-   */
-  private cheEnvironmentRegistry: CheEnvironmentRegistry;
-  /**
-   * Workspace creation service.
-   */
-  private createWorkspaceSvc: CreateWorkspaceSvc;
-  /**
-   * Namespace selector service.
-   */
-  private namespaceSelectorSvc: NamespaceSelectorSvc;
-  /**
-   * Generator for random strings.
-   */
-  private randomSvc: RandomSvc;
-  /**
-   * Logging service.
-   */
-  private $log: ng.ILogService;
-  /**
-   * Notification factory.
+   * Selected tab index.
    */
-  private cheNotification: CheNotification;
+  selectedTab: number = 0;
   /**
-   * Devfile registry.
+   * View tabs.
    */
-  private devfileRegistry: DevfileRegistry;
-  /**
-   * The environment manager.
-   */
-  private environmentManager: EnvironmentManager;
+  tabs: typeof TABS;
+
   /**
-   * The selected devfile.
+   * Location service.
    */
-  private selectedDevfile: che.IWorkspaceDevfile;
+  private $location: ng.ILocationService;
   /**
-   * The selected namespace ID.
+   * Directive scope service.
    */
-  private namespaceId: string;
+  private $scope: ng.IScope;
   /**
-   * The map of forms.
+   * Workspace creation service.
    */
-  private forms: Map<string, ng.IFormController>;
+  private createWorkspaceSvc: CreateWorkspaceSvc;
   /**
-   * The list of names of existing workspaces.
+   * Dropdown button config.
    */
-  private usedNamesList: string[];
+  private headerCreateButtonConfig: {
+    mainAction: ICheButtonDropdownMainAction,
+    otherActions: Array<ICheButtonDropdownOtherAction>
+  };
   /**
-   * The name of workspace.
+   * Devfiles by view.
    */
-  private workspaceName: string;
+  private devfiles: Map<TABS, DevfileChangeEventData> = new Map();
   /**
-   * Hide progress loader if <code>true</code>.
+   * Forms by view.
    */
-  private hideLoader: boolean;
-
-  private stackName: string;
+  private forms: Map<TABS, ng.IFormController> = new Map();
 
   /**
    * Default constructor that is using resource injection
    */
-  constructor($mdDialog: ng.material.IDialogService,
-              $timeout: ng.ITimeoutService,
-              cheEnvironmentRegistry: CheEnvironmentRegistry,
-              createWorkspaceSvc: CreateWorkspaceSvc,
-              namespaceSelectorSvc: NamespaceSelectorSvc,
-              randomSvc: RandomSvc,
-              $log: ng.ILogService,
-              cheNotification: CheNotification,
-              devfileRegistry: DevfileRegistry) {
-    this.$mdDialog = $mdDialog;
-    this.$timeout = $timeout;
-    this.cheEnvironmentRegistry = cheEnvironmentRegistry;
+  constructor(
+    $location: ng.ILocationService,
+    $scope: ng.IScope,
+    createWorkspaceSvc: CreateWorkspaceSvc
+  ) {
+    this.$location = $location;
+    this.$scope = $scope;
     this.createWorkspaceSvc = createWorkspaceSvc;
-    this.namespaceSelectorSvc = namespaceSelectorSvc;
-    this.randomSvc = randomSvc;
-    this.$log = $log;
-    this.cheNotification = cheNotification;
-    this.devfileRegistry = devfileRegistry;
 
-    this.usedNamesList = [];
-    this.forms = new Map();
-
-    this.namespaceId = this.namespaceSelectorSvc.getNamespaceId();
-    this.buildListOfUsedNames().then(() => {
-      this.workspaceName = this.randomSvc.getRandString({prefix: 'wksp-', list: this.usedNamesList});
-      this.reValidateName();
+    this.tabs = TABS;
+    this.updateSelectedTab(this.$location.search().tab);
+    const locationWatcherDeregistration = $scope.$watch(() => {
+      return $location.search().tab;
+    }, (newTab: string, oldTab: string) => {
+      if (newTab === oldTab) {
+        return;
+      }
+      if (angular.isDefined(newTab)) {
+        this.updateSelectedTab(newTab);
+      }
+    });
+    $scope.$on('$destroy', () => {
+      locationWatcherDeregistration();
     });
-
-    // loader should be hidden and page content shown
-    // when stacks selector is rendered
-    // and default stack is selected
-    this.hideLoader = false;
 
     // header toolbar
     // dropdown button config
@@ -172,56 +142,39 @@ export class CreateWorkspaceController {
   }
 
   /**
-   * Callback which is called when stack is selected.
-   *
-   * @param {string} stackId the stack ID
-   */
-  onDevfileSelected(devfile: che.IWorkspaceDevfile): void {
-    // tiny timeout for templates selector to be rendered
-    this.$timeout(() => {
-      this.hideLoader = true;
-    }, 10);
-    this.selectedDevfile = devfile;
-  }
-
-  /**
-   * Callback which is called when namespace is selected.
-   *
-   * @param {string} namespaceId a namespace ID
+   * Changes search part of URL.
+   * @param index a tab index.
    */
-  onNamespaceChanged(namespaceId: string) {
-    this.namespaceId = namespaceId;
-
-    this.buildListOfUsedNames().then(() => {
-      this.reValidateName();
-    });
-  }
-
-  /**
-   * Returns list of namespaces.
-   *
-   * @return {Array<che.INamespace>}
-   */
-  getNamespaces(): Array<che.INamespace> {
-    return this.namespaceSelectorSvc.getNamespaces();
+  onSelectTab(index?: number): void {
+    let param: { tab?: string } = {};
+    if (angular.isDefined(index)) {
+      param.tab = TABS[index];
+    }
+    if (angular.isUndefined(this.$location.search().tab)) {
+      this.$location.replace().search(param);
+    } else {
+      this.$location.search(param);
+    }
   }
 
   /**
-   * Returns namespaces empty message if set.
+   * Update selected tab index by search part of URL.
    *
-   * @returns {string}
+   * @param tab a tab name
    */
-  getNamespaceEmptyMessage(): string {
-    return this.namespaceSelectorSvc.getNamespaceEmptyMessage();
+  updateSelectedTab(tab: string): void {
+    const index = parseInt(TABS[tab], 10);
+    this.selectedTab = isNaN(index) ? 0 : index;
   }
 
   /**
-   * Returns namespaces caption.
+   * Stores forms in map.
    *
-   * @returns {string}
+   * @param {number} tab
+   * @param {ng.IFormController} form
    */
-  getNamespaceCaption(): string {
-    return this.namespaceSelectorSvc.getNamespaceCaption();
+  registerForm(tab: number, form: ng.IFormController) {
+    this.forms.set(tab, form);
   }
 
   /**
@@ -230,110 +183,19 @@ export class CreateWorkspaceController {
    * @return {boolean}
    */
   isCreateButtonDisabled(): boolean {
-    if (!this.namespaceId || !this.selectedDevfile) {
-      return true;
-    }
-
-    for (const form of this.forms.values()) {
-      if (form.$valid !== true) {
-        return true;
-      }
-    }
+    const form = this.forms.get(this.selectedTab);
 
-    return false;
-  }
-
-  /**
-   * Stores forms in list.
-   *
-   * @param {string} inputName
-   * @param {ng.IFormController} form
-   */
-  registerForm(inputName: string, form: ng.IFormController) {
-    this.forms.set(inputName, form);
-  }
-
-  /**
-   * Returns <code>false</code> if workspace's name is not unique in the namespace.
-   * Only member with 'manageWorkspaces' permission can definitely know whether
-   * name is unique or not.
-   *
-   * @param {string} name workspace's name
-   */
-  isNameUnique(name: string): boolean {
-    return this.usedNamesList.indexOf(name) === -1;
-  }
-
-  /**
-   * Filters list of workspaces by current namespace and
-   * builds list of names for current namespace.
-   *
-   * @return {IPromise<any>}
-   */
-  buildListOfUsedNames(): ng.IPromise<any> {
-    return this.createWorkspaceSvc.fetchWorkspacesByNamespace(this.namespaceId).then((workspaces: Array<che.IWorkspace>) => {
-      this.usedNamesList = workspaces.filter((workspace: che.IWorkspace) => {
-        return workspace.namespace === this.namespaceId;
-      }).map((workspace: che.IWorkspace) => {
-        return this.createWorkspaceSvc.getWorkspaceName(workspace);
-      });
-    });
-  }
-
-  /**
-   * Triggers form validation on Settings tab.
-   */
-  reValidateName(): void {
-    const form: ng.IFormController = this.forms.get('name');
-
-    if (!form) {
-      return;
-    }
-
-    ['name', 'deskname'].forEach((inputName: string) => {
-      const model = form[inputName] as ng.INgModelController;
-      if (model) {
-        model.$validate();
-      }
-    });
+    return !form || form.$valid !== true;
   }
 
   /**
    * Creates workspace.
-   *
-   * @returns {angular.IPromise<che.IWorkspace>}
    */
   createWorkspace(): ng.IPromise<che.IWorkspace> {
-    // update workspace name
-    let devfileSource = angular.copy(this.selectedDevfile);
-    devfileSource.metadata.name = this.workspaceName;
-    return this.createWorkspaceSvc.createWorkspaceFromDevfile(devfileSource, {stackName: this.stackName});
+    const { devfile, attrs } = this.devfiles.get(this.selectedTab);
+    return this.createWorkspaceSvc.createWorkspaceFromDevfile(devfile, attrs, this.selectedTab === TABS.IMPORT_DEVFILE);
   }
 
-  /**
-   * Creates a workspace and shows a dialogue window for a user to select
-   * whether to open Workspace Details page or the IDE.
-   *
-   * @param {MouseEvent} $event
-   */
-  createWorkspaceAndShowDialog($event: MouseEvent): void {
-    this.createWorkspace().then((workspace: che.IWorkspace) => {
-      this.$mdDialog.show({
-        targetEvent: $event,
-        controller: 'AfterCreationDialogController',
-        controllerAs: 'afterCreationDialogController',
-        bindToController: true,
-        clickOutsideToClose: true,
-        templateUrl: 'app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.html'
-      }).then(() => {
-        // when promise is resolved then open workspace in IDE
-        this.createWorkspaceSvc.redirectToIDE(workspace);
-      }, () => {
-        // when promise is rejected then open Workspace Details page
-        this.createWorkspaceSvc.redirectToDetails(workspace);
-      });
-    });
-  }
 
   /**
    * Creates a workspace and redirects to the IDE.
@@ -343,4 +205,9 @@ export class CreateWorkspaceController {
       this.createWorkspaceSvc.redirectToIDE(workspace);
     });
   }
+
+  onDevfileChange(tab: number, devfile: che.IWorkspaceDevfile, attrs: { [key: string]: string }): void {
+    this.devfiles.set(tab, { devfile, attrs });
+  }
+
 }
diff --git a/src/app/workspaces/create-workspace/create-workspace.html b/src/app/workspaces/create-workspace/create-workspace.html
index 51730a0aa5d..a8d77135fc7 100644
--- a/src/app/workspaces/create-workspace/create-workspace.html
+++ b/src/app/workspaces/create-workspace/create-workspace.html
@@ -1,73 +1,57 @@
-<che-toolbar che-title="New Workspace"
-             class="create-workspace-toolbar">
-  <che-button-dropdown button-style="che-button-save-flat"
-                       button-disabled="createWorkspaceController.isCreateButtonDisabled()"
-                       main-action-config="createWorkspaceController.headerCreateButtonConfig.mainAction"
-                       other-actions-config="createWorkspaceController.headerCreateButtonConfig.otherActions"
-                       class="create-workspace-header-button"></che-button-dropdown>
-</che-toolbar>
-
-<md-progress-linear md-mode="indeterminate"
-                    class="create-workspace-progress"
-                    ng-hide="createWorkspaceController.hideLoader"></md-progress-linear>
-
-<md-content md-scroll-y flex
-            md-theme="default"
-            class="create-workspace-content">
-  <div ng-class="{'create-workspace-content-hidden': !createWorkspaceController.hideLoader}">
-
-    <!-- Name -->
-    <che-label-container che-label-name="Name"
-                         che-label-description="Define a name for your workspace.">
-      <ng-form flex layout="column"
-               name="workspaceNameForm"
-               class="create-workspace-name-form">
-        <che-input-box ng-init="createWorkspaceController.registerForm('name', workspaceNameForm)"
-                       che-form="workspaceNameForm"
-                       che-name="workspaceName"
-                       id="workspace-name-input"
-                       che-place-holder="Name of the workspace"
-                       aria-label="Name of the workspace"
-                       ng-model="createWorkspaceController.workspaceName"
-                       ng-model-options="{ updateOn: 'default blur', debounce: { 'default': 200, 'blur': 0 }, allowInvalid: false }"
-                       required
-                       custom-validator="createWorkspaceController.isNameUnique($value)"
-                       ng-minlength="3"
-                       ng-maxlength="100"
-                       ng-pattern="/^[a-z\d][a-z\d-.]+[a-z\d]$/i">
-          <div ng-message="required">A name is required.</div>
-          <div ng-message="minlength">The name has to be more than 3 characters long.</div>
-          <div ng-message="pattern">The name should not contain special characters like space, dollar, etc. and should start and end only with digits, latin letters or underscores.</div>
-          <div ng-message="maxlength">The name has to be less than 100 characters long.</div>
-          <div ng-message="customValidator">This workspace name is already used.</div>
-        </che-input-box>
-      </ng-form>
-    </che-label-container>
-
-    <!-- Namespace -->
-    <che-label-container che-label-name="{{createWorkspaceController.getNamespaceCaption()}}"
-                         ng-if="createWorkspaceController.getNamespaces().length > 0 || createWorkspaceController.getNamespaceEmptyMessage()">
-      <namespace-selector
-        on-namespace-change="createWorkspaceController.onNamespaceChanged(namespaceId)"></namespace-selector>
-    </che-label-container>
-
-    <che-label-container che-label-name="Select Stack"
-                         che-label-description="Choose your workspace runtime environment used to build and run your projects.">
-      <devfile-selector on-devfile-select="createWorkspaceController.onDevfileSelected(devfile)"
-                        stack-name="createWorkspaceController.stackName">
-      </devfile-selector>
-    </che-label-container>
-    <!-- Project source selector -->
-    <che-label-container che-label-name="Projects">
-      <project-source-selector devfile="createWorkspaceController.selectedDevfile"></project-source-selector>
-    </che-label-container>
-    <che-label-container>
-      <che-button-save-flat id="create-workspace-footer-button"
-                            name="saveButton"
-                            che-button-title="Create & Open"
-                            ng-click="createWorkspaceController.createWorkspaceAndOpenIDE()"
-                            ng-disabled="createWorkspaceController.isCreateButtonDisabled()"></che-button-save-flat>
-    </che-label-container>
-
-  </div>
-</md-content>
+<div id="create-workspace">
+  <che-toolbar che-title="New Workspace"
+               class="create-workspace-toolbar">
+    <che-button-dropdown button-style="che-button-save-flat"
+                         button-disabled="createWorkspaceController.isCreateButtonDisabled()"
+                         main-action-config="createWorkspaceController.headerCreateButtonConfig.mainAction"
+                         other-actions-config="createWorkspaceController.headerCreateButtonConfig.otherActions"
+                         class="create-workspace-header-button"></che-button-dropdown>
+  </che-toolbar>
+  <md-content md-theme="default" class="create-workspace-content">
+    <md-tabs md-dynamic-height
+             md-stretch-tabs="auto"
+             md-selected="createWorkspaceController.selectedTab"
+             class="create-workspace-content"
+             md-no-ink-bar>
+      <!-- READY-TO-GO STACK -->
+      <md-tab md-on-select="createWorkspaceController.onSelectTab(createWorkspaceController.tabs.READY_TO_GO)">
+        <md-tab-label>
+          <span class="che-tab-label-title">READY-TO-GO STACK</span>
+        </md-tab-label>
+        <md-tab-body>
+          <ng-form name="createWorkspaceReadyToGoForm" id="create-workspace-ready-to-go-form">
+            <ready-to-go-stacks
+              ng-init="createWorkspaceController.registerForm(createWorkspaceController.tabs.READY_TO_GO, createWorkspaceReadyToGoForm)"
+              on-change="createWorkspaceController.onDevfileChange(createWorkspaceController.tabs.READY_TO_GO, devfile, attrs)">
+              <che-button-save-flat id="create-workspace-ready-to-go-button" name="saveButton"
+                                    che-button-title="Create & Open"
+                                    ng-click="createWorkspaceController.createWorkspaceAndOpenIDE()"
+                                    ng-disabled="createWorkspaceReadyToGoForm.$invalid">
+              </che-button-save-flat>
+            </ready-to-go-stacks>
+          </ng-form>
+        </md-tab-body>
+      </md-tab>
+      <!-- IMPORT CUSTOM STACK -->
+      <md-tab
+        md-on-select="createWorkspaceController.onSelectTab(createWorkspaceController.tabs.IMPORT_DEVFILE)">
+        <md-tab-label>
+          <span class="che-tab-label-title">IMPORT DEVFILE</span>
+        </md-tab-label>
+        <md-tab-body>
+          <ng-form name="createWorkspaceImportStackForm" id="create-workspace-import-stack-form">
+            <import-stack
+              ng-init="createWorkspaceController.registerForm(createWorkspaceController.tabs.IMPORT_DEVFILE, createWorkspaceImportStackForm)"
+              on-change="createWorkspaceController.onDevfileChange(createWorkspaceController.tabs.IMPORT_DEVFILE, devfile, attrs)">
+              <che-button-save-flat id="create-workspace-import-stack-form-button" name="saveButton"
+                                    che-button-title="Create & Open"
+                                    ng-click="createWorkspaceController.createWorkspaceAndOpenIDE()"
+                                    ng-disabled="createWorkspaceImportStackForm.$invalid">
+              </che-button-save-flat>
+            </import-stack>
+          </ng-form>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </md-content>
+</div>
diff --git a/src/app/workspaces/create-workspace/create-workspace.service.ts b/src/app/workspaces/create-workspace/create-workspace.service.ts
index 0ae9c14d286..ca6bb3fd71f 100644
--- a/src/app/workspaces/create-workspace/create-workspace.service.ts
+++ b/src/app/workspaces/create-workspace/create-workspace.service.ts
@@ -11,8 +11,8 @@
  */
 'use strict';
 
-import {NamespaceSelectorSvc} from './namespace-selector/namespace-selector.service';
-import {ProjectSourceSelectorService} from './project-source-selector/project-source-selector.service';
+import {NamespaceSelectorSvc} from './ready-to-go-stacks/namespace-selector/namespace-selector.service';
+import {ProjectSourceSelectorService} from './ready-to-go-stacks/project-source-selector/project-source-selector.service';
 import {CheNotification} from '../../../components/notification/che-notification.factory';
 import {ConfirmDialogService} from '../../../components/service/confirm-dialog/confirm-dialog.service';
 import {CheWorkspace} from '../../../components/api/workspace/che-workspace.factory';
@@ -150,40 +150,7 @@ export class CreateWorkspaceSvc {
     return defer.promise;
   }
 
-  createWorkspaceFromConfig(workspaceConfig: che.IWorkspaceConfig, attributes: any): ng.IPromise<che.IWorkspace> {
-    const namespaceId = this.namespaceSelectorSvc.getNamespaceId(),
-          projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
-
-    return this.checkEditingProgress().then(() => {
-      workspaceConfig.projects = projectTemplates;
-      this.addProjectCommands({config: workspaceConfig}, projectTemplates);
-      return this.cheWorkspace.createWorkspaceFromConfig(namespaceId, workspaceConfig, attributes).then((workspace: che.IWorkspace) => {
-        return this.cheWorkspace.fetchWorkspaces().then(() => this.cheWorkspace.getWorkspaceById(workspace.id));
-      })
-      .then((workspace: che.IWorkspace) => {
-        this.projectSourceSelectorService.clearTemplatesList();
-        const workspaces = this.cheWorkspace.getWorkspaces();
-        if (workspaces.findIndex((_workspace: che.IWorkspace) => {
-            return _workspace.id === workspace.id;
-          }) === -1) {
-          workspaces.push(workspace);
-        }
-        this.cheWorkspace.startUpdateWorkspaceStatus(workspace.id);
-
-        return workspace;
-      }, (error: any) => {
-        let errorMessage = 'Creation workspace failed.';
-        if (error && error.data && error.data.message) {
-          errorMessage = error.data.message;
-        }
-        this.cheNotification.showError(errorMessage);
-
-        return this.$q.reject(error);
-      });
-    });
-  }
-
-  createWorkspaceFromDevfile(sourceDevfile: che.IWorkspaceDevfile, attributes: any): ng.IPromise<che.IWorkspace> {
+  createWorkspaceFromDevfile(sourceDevfile: che.IWorkspaceDevfile, attributes: any, skipProjectTemplates?: boolean): ng.IPromise<che.IWorkspace> {
     const namespaceId = this.namespaceSelectorSvc.getNamespaceId(),
           projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
 
@@ -200,13 +167,13 @@ export class CreateWorkspaceSvc {
     });
 
     return this.checkEditingProgress().then(() => {
-      sourceDevfile.projects = projects;
-
-      // If no projects defined in devfile were added - remove the commands from devfile as well:
-      if (noProjectsFromDevfile) {
-        sourceDevfile.commands = [];
+      if (!skipProjectTemplates) {
+        sourceDevfile.projects = projects;
+        // If no projects defined in devfile were added - remove the commands from devfile as well:
+        if (noProjectsFromDevfile) {
+          sourceDevfile.commands = [];
+        }
       }
-
       return this.cheWorkspace.createWorkspaceFromDevfile(namespaceId, sourceDevfile, attributes).then((workspace: che.IWorkspace) => {
         return this.cheWorkspace.fetchWorkspaces().then(() => this.cheWorkspace.getWorkspaceById(workspace.id));
       })
@@ -287,6 +254,22 @@ export class CreateWorkspaceSvc {
     });
   }
 
+  /**
+   * Returns workspaces names for a namespace.
+   *
+   * @param namespace namespace
+   */
+  buildListOfUsedNames(namespace: string): ng.IPromise<string[]> {
+    return this.fetchWorkspacesByNamespace(namespace).then((workspaces: Array<che.IWorkspace>) => {
+      const names = workspaces.filter((workspace: che.IWorkspace) => {
+        return workspace.namespace === namespace;
+      }).map((workspace: che.IWorkspace) => {
+        return this.getWorkspaceName(workspace);
+      });
+      return this.$q.when(names);
+    });
+  }
+
   /**
    * Returns name of the pointed workspace.
    *
diff --git a/src/app/workspaces/create-workspace/create-workspace.styl b/src/app/workspaces/create-workspace/create-workspace.styl
index b8acd8cb9e2..ae36ab8d933 100644
--- a/src/app/workspaces/create-workspace/create-workspace.styl
+++ b/src/app/workspaces/create-workspace/create-workspace.styl
@@ -1,25 +1,46 @@
-.create-workspace-progress
-  position absolute
-  top 56px
-  z-index 2
+#create-workspace
+  display flex
+  flex-direction column
+  flex 1
 
-.create-workspace-toolbar
-  .che-toolbar-header > div:last-child
-    bottom 9px
+.che-toolbar-header > div:last-child
+  bottom 9px
 
 .create-workspace-header-button .che-button-dropdown
-  button.che-button,
-  .fa-caret-down
+  button.che-button, .fa-caret-down
     min-height 36px
     height 36px
 
   .area-dropdown.dropdown-menu
     top 36px
 
-
 md-content.create-workspace-content
+  padding 0
+  height 0
+  flex-grow 1
   background-color $very-light-grey-background-color
-  padding 15px
+
+  md-tabs-canvas
+    height 50px
+
+    & *
+      height inherit
+
+    md-pagination-wrapper
+      md-tab-item:not(.md-active)
+        border-bottom none
+
+      md-tab-item
+        border-bottom 1px solid $primary-color
+
+  md-tab-content > *
+    background-color $very-light-grey-background-color
+
+  .che-input-box > div
+    min-height 55px
+
+  .che-label-container
+    padding 24px 0
 
   .che-label-container-label-name
     text-transform uppercase
@@ -29,14 +50,9 @@ md-content.create-workspace-content
   .che-label-container-content
     min-width 850px
 
-  .create-workspace-content-hidden
-    visibility hidden
-
-  #create-workspace-footer-button
+  #create-workspace-ready-to-go-button, #create-workspace-import-stack-form-button
     width 100%
 
     button
       margin 0 !important
       width 100% !important
-
-
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.controller.ts b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.controller.ts
new file mode 100644
index 00000000000..a5d7e3333f9
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.controller.ts
@@ -0,0 +1,61 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+import {CheFactory} from '../../../../../components/api/che-factory.factory';
+
+const ATTR_URL = 'factoryurl';
+
+/**
+ * This class is handling the controller for import devfile from a URL.
+ *
+ * @author Oleksii Orel
+ */
+export class DevfileByUrlController {
+
+  static $inject = ['cheFactory'];
+
+  workspaceDevfileOnChange: Function;
+  workspaceDevfileLocation: string;
+
+  private workspaceDevfile: che.IWorkspaceDevfile | {} = {};
+  private cheFactory: CheFactory;
+
+  /**
+   * Default constructor that is using resource injection
+   */
+  constructor(cheFactory: CheFactory) {
+    this.cheFactory = cheFactory;
+  }
+
+  $onInit(): void {
+    if (this.workspaceDevfileLocation) {
+      this.onUrlChanged(this.workspaceDevfileLocation);
+    }
+  }
+
+  onUrlChanged(url: string): void {
+    if (this.cheFactory.hasDevfile(url)) {
+      const devfile = this.cheFactory.getDevfile(url);
+      const attributes = {};
+      attributes[ATTR_URL] = url;
+      if (angular.isFunction(this.workspaceDevfileOnChange) && devfile) {
+        this.workspaceDevfileOnChange({devfile, attributes});
+      }
+      this.workspaceDevfile = devfile;
+    }
+  }
+
+  isUrlValid(url: string): ng.IPromise<void> {
+    return this.cheFactory.fetchDevfile(url);
+  }
+}
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.directive.ts b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.directive.ts
new file mode 100644
index 00000000000..5b54a823265
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.directive.ts
@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+/**
+ * Defines a directive for import devfile from a URL.
+ *
+ * @author Oleksii Orel
+ */
+export class DevfileByUrl implements ng.IDirective {
+  restrict: string;
+  templateUrl: string;
+  controller: string;
+  controllerAs: string;
+  bindToController: boolean;
+
+  scope: {
+    [propName: string]: string;
+  };
+
+  /**
+   * Default constructor that is using resource
+   */
+  constructor() {
+    this.controller = 'DevfileByUrlController';
+    this.controllerAs = 'devfileByUrlController';
+    this.bindToController = true;
+
+    this.restrict = 'E';
+    this.templateUrl = 'app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.html';
+
+    // scope values
+    this.scope = {
+      workspaceDevfileLocation: '=',
+      workspaceDevfileOnChange: '&'
+    };
+  }
+
+}
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.html b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.html
new file mode 100644
index 00000000000..8a53d1ec61f
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.html
@@ -0,0 +1,48 @@
+<!--
+
+    Copyright (c) 2015-2018 Red Hat, Inc.
+    This program and the accompanying materials are made
+    available under the terms of the Eclipse Public License 2.0
+    which is available at https://www.eclipse.org/legal/epl-2.0/
+
+    SPDX-License-Identifier: EPL-2.0
+
+    Contributors:
+      Red Hat, Inc. - initial API and implementation
+
+-->
+<div class="import-devfile-by-url">
+  <form name="devfileUrlForm">
+    <che-input-box che-form="devfileUrlForm"
+                   che-name="devfileURL"
+                   che-place-holder="Url of the devfile"
+                   aria-label="Url of the devfile"
+                   che-width="auto"
+                   ng-model="devfileByUrlController.workspaceDevfileLocation"
+                   che-on-change="devfileByUrlController.onUrlChanged($value)"
+                   ng-model-options="{ debounce: { 'default': 1000, 'blur': 0 }, allowInvalid: false}"
+                   custom-async-validator="devfileByUrlController.isUrlValid($value)"
+                   ng-maxlength="512"
+                   ng-required="true"
+                   type="url">
+      <div ng-message="required"></div>
+      <div ng-message="maxlength">
+        The URL has to be less than 512 characters long
+      </div>
+      <div ng-message="customAsyncValidator">
+        Unknown Content Type or no Content Type found in URL
+      </div>
+      <div ng-show="devfileUrlForm.$invalid">
+        Invalid URL
+      </div>
+    </che-input-box>
+  </form>
+  <div class="devfile-show-content" ng-if="devfileUrlForm.$valid && devfileByUrlController.workspaceDevfile">
+    <che-show-area show-title="Show content" hide-title="Hide content">
+      <workspace-devfile-editor is-active="false"
+                                editor-read-only="true"
+                                workspace-devfile="devfileByUrlController.workspaceDevfile"></workspace-devfile-editor>
+    </che-show-area>
+    <span class="additional-info">The content is read-only</span>
+  </div>
+</div>
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.styl b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.styl
new file mode 100644
index 00000000000..207831b2b66
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.styl
@@ -0,0 +1,28 @@
+.import-devfile-by-url
+  margin 0
+  min-height 90px
+  .ng-active[ng-messages] .ng-scope:not(:first-child)
+    display none
+
+  .che-button
+    margin-bottom 0
+    padding-bottom 0
+
+  che-show-area workspace-devfile-editor
+    width 100%
+    margin-bottom 12px
+    .config-import
+      margin 0
+      .config-editor
+        margin 0
+    a
+      display none
+
+  .devfile-show-content
+    position: relative
+    .additional-info
+      position absolute
+      bottom 0
+      left 140px
+      line-height 38px
+      color $grey-input-label-color
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.directive.ts b/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.directive.ts
new file mode 100644
index 00000000000..9950011a250
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.directive.ts
@@ -0,0 +1,59 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+interface IDevfileSourceSelectorScope extends ng.IScope {
+  selectedSource: string;
+  onSelectSource: (source: string) => void;
+  onChange: (eventData: {source: string}) => void;
+}
+
+export const URL = 'url';
+export const YAML = 'yaml';
+
+/**
+ * Defines a directive for source selector widget.
+ *
+ * @author Oleksii Orel
+ */
+export class DevfileSourceSelector implements ng.IDirective {
+  restrict: string = 'E';
+  templateUrl: string = 'app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.html';
+  replace: boolean = true;
+
+  scope: {
+    [propName: string]: string
+  };
+
+  /**
+   * Default constructor that is using resource
+   */
+  constructor() {
+    this.scope = {
+      selectedSource: '=',
+      onChange: '&?'
+    };
+  }
+
+  link($scope: IDevfileSourceSelectorScope) {
+    $scope[URL] = URL;
+    $scope[YAML] = YAML;
+    $scope.selectedSource = URL;
+    $scope.onSelectSource = (source: string) => {
+      $scope.selectedSource = source;
+      if ($scope.onChange !== undefined) {
+        $scope.onChange({source});
+      }
+    };
+  }
+
+}
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.html b/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.html
new file mode 100644
index 00000000000..d9815f35ef6
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.html
@@ -0,0 +1,18 @@
+<div class="devfile-source-selector">
+  <div ng-class="{'selected': selectedSource === url}"
+       ng-click="onSelectSource(url);"
+       class="source-item">
+    <div>
+      <i class="fa fa-link"></i>
+    </div>
+    <span>URL</span>
+  </div>
+  <div ng-class="{'selected': selectedSource === yaml}"
+       ng-click="onSelectSource(yaml);"
+       class="source-item">
+    <div>
+      <i class="fa fa-file"></i>
+    </div>
+    <span>YAML</span>
+  </div>
+</div>
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.styl b/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.styl
new file mode 100644
index 00000000000..c59b7f8c56b
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.styl
@@ -0,0 +1,37 @@
+.devfile-source-selector .source-item
+  float left
+  width 195px
+  line-height 85px
+  margin-right 50px
+  text-align center
+  display inline-block
+  vertical-align middle
+  border 1px solid $grey-input-label-color
+  color $grey-input-label-color
+  user-select none
+  &.selected
+    border-color $primary-color
+    span
+      color: $black-color
+  div
+    float left
+    width 75px
+    height 85px
+    i
+      width 100%
+      font-size 55px
+      float inherit
+      text-align end
+      line-height inherit
+      &.fa-file
+        margin-top 2px
+      &.fa-link
+        width initial
+        height initial
+        transform rotate(90deg)
+        &:before
+          position absolute
+          left 17px
+          bottom 4px
+  span
+    font-size 18px
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.controller.ts b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.controller.ts
new file mode 100644
index 00000000000..713c08ddea0
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.controller.ts
@@ -0,0 +1,110 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+import {IImportStackScopeBindings} from './import-custom-stack.directive';
+import {YAML, URL} from './devfile-source-selector/devfile-source-selector.directive';
+import {CreateWorkspaceSvc} from '../create-workspace.service';
+import {RandomSvc} from '../../../../components/utils/random.service';
+import {NamespaceSelectorSvc} from '../ready-to-go-stacks/namespace-selector/namespace-selector.service';
+
+/**
+ * This class is handling the controller for stack importing directive.
+ *
+ * @author Oleksii Orel
+ */
+export class ImportStackController implements IImportStackScopeBindings {
+
+  static $inject = ['namespaceSelectorSvc', 'createWorkspaceSvc', 'randomSvc'];
+
+  onChange: (eventData: { devfile: che.IWorkspaceDevfile, attrs?: { [key: string]: any } }) => void;
+
+  /**
+   * Namespace selector service.
+   */
+  private namespaceSelectorSvc: NamespaceSelectorSvc;
+  /**
+   * Generator for random strings.
+   */
+  private randomSvc: RandomSvc;
+  /**
+   * Workspace creation service.
+   */
+  private createWorkspaceSvc: CreateWorkspaceSvc;
+  /**
+   * The selected source for devfile importing(URL or YAML).
+   */
+  private selectedSource: string;
+  /**
+   * The imported devfile location(URL).
+   */
+  private devfileLocation: string;
+  /**
+   * The imported devfile(YAML).
+   */
+  private devfile: che.IWorkspaceDevfile;
+
+  /**
+   * Default constructor that is using resource injection
+   */
+  constructor(namespaceSelectorSvc: NamespaceSelectorSvc, createWorkspaceSvc: CreateWorkspaceSvc, randomSvc: RandomSvc) {
+    this.namespaceSelectorSvc = namespaceSelectorSvc;
+    this.createWorkspaceSvc = createWorkspaceSvc;
+    this.randomSvc = randomSvc;
+  }
+
+  $onInit(): void {
+  }
+
+  private initializeMinDevfile() {
+    this.devfile = {
+      apiVersion: '1.0.0',
+      components: [],
+      projects: [],
+      metadata: {
+        name: 'wksp-custom'
+      }
+    };
+
+    if (this.devfile) {
+      const prefix = `${this.devfile.metadata.name}-`;
+      const namespaceId = this.namespaceSelectorSvc.getNamespaceId();
+      this.createWorkspaceSvc.buildListOfUsedNames(namespaceId).then((list: string[]) => {
+        this.devfile.metadata.name = this.randomSvc.getRandString({prefix, list});
+      });
+    }
+  }
+
+  updateDevfile(devfile: che.IWorkspaceDevfile, attrs: { factoryurl?: string } = {}): void {
+    if (this.isYamlSelected()) {
+      this.devfile = devfile;
+    } else if (attrs.factoryurl) {
+      this.devfileLocation = attrs.factoryurl;
+    }
+    if (angular.isFunction(this.onChange)) {
+      this.onChange({devfile, attrs});
+    }
+  }
+
+  onSourceChange(source: string): void {
+    if (source === YAML && !this.devfile) {
+      this.initializeMinDevfile();
+    }
+  }
+
+  isUrlSelected(): boolean {
+    return this.selectedSource === URL;
+  }
+
+  isYamlSelected(): boolean {
+    return this.selectedSource === YAML;
+  }
+}
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.directive.ts b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.directive.ts
new file mode 100644
index 00000000000..97c3a18cefe
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.directive.ts
@@ -0,0 +1,43 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+export interface IImportStackScopeBindings {
+  onChange: (eventData: { devfile: che.IWorkspaceDevfile, attrs?: { [key: string]: any } }) => void;
+}
+
+/**
+ * Defines a directive for displaying import stack widget.
+ *
+ * @author Oleksii Orel
+ */
+export class ImportStack implements ng.IDirective {
+
+  restrict: string = 'E';
+  templateUrl: string = 'app/workspaces/create-workspace/import-custom-stack/import-custom-stack.html';
+  controller: string = 'ImportStackController';
+  controllerAs: string = 'importStackController';
+  bindToController: boolean = true;
+
+  transclude: boolean = true;
+
+  scope: {
+    onChange: string;
+  };
+
+  constructor() {
+    this.scope = {
+      onChange: '&'
+    };
+  }
+
+}
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.html b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.html
new file mode 100644
index 00000000000..7910b90471f
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.html
@@ -0,0 +1,25 @@
+<div class="import-custom-stack">
+  <!-- Devfile source selector  -->
+  <che-label-container che-label-name="Source"
+                       che-label-description="Define a source for your devfile.">
+    <devfile-source-selector
+      selected-source="importStackController.selectedSource"
+      on-change="importStackController.onSourceChange(source)"></devfile-source-selector>
+  </che-label-container>
+  <!-- Import stack  -->
+  <che-label-container che-label-name="{{importStackController.selectedSource}}">
+    <!-- URL -->
+    <devfile-by-url ng-if="importStackController.isUrlSelected() === true"
+                    workspace-devfile-location="importStackController.devfileLocation"
+                    workspace-devfile-on-change="importStackController.updateDevfile(devfile, attributes)"></devfile-by-url>
+    <!-- YAML -->
+    <workspace-devfile-editor ng-if="importStackController.isYamlSelected() === true"
+                              is-active="true"
+                              workspace-devfile="importStackController.devfile"
+                              workspace-devfile-on-change="importStackController.updateDevfile(devfile)"></workspace-devfile-editor>
+  </che-label-container>
+  <!-- Create Workspace Button -->
+  <che-label-container>
+    <ng-transclude></ng-transclude>
+  </che-label-container>
+</div>
diff --git a/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.styl b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.styl
new file mode 100644
index 00000000000..d116da1dbfc
--- /dev/null
+++ b/src/app/workspaces/create-workspace/import-custom-stack/import-custom-stack.styl
@@ -0,0 +1,24 @@
+.import-custom-stack
+  .che-label-container:first-child
+    border-bottom none
+  .config-import
+    margin-left 0
+    .config-editor
+      margin-top 0
+    .saving-message
+      display none
+
+md-tab-content.md-active .import-custom-stack .config-import
+    animation-iteration-count 1
+    animation-duration .5s
+    animation-delay 0s
+    animation-name devfile-by-url-height
+    overflow hidden
+    .CodeMirror
+      height 345px
+
+@keyframes devfile-by-url-height
+  0%
+    max-height 55px
+  100%
+    max-height 350px
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.controller.ts b/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.controller.ts
deleted file mode 100644
index 2436aac2f62..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.controller.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-/*
- * Copyright (c) 2015-2018 Red Hat, Inc.
- * This program and the accompanying materials are made
- * available under the terms of the Eclipse Public License 2.0
- * which is available at https://www.eclipse.org/legal/epl-2.0/
- *
- * SPDX-License-Identifier: EPL-2.0
- *
- * Contributors:
- *   Red Hat, Inc. - initial API and implementation
- */
-'use strict';
-
-/**
- * This class is handling the controller for the machine item row in ram settings.
- *
- * @author Oleksii Kurinnyi
- */
-export class RamSettingsMachineItemController {
-  /**
-   * The name of the machine.
-   */
-  machineName: string;
-  /**
-   * Callback which is called on machine's memory limit is changed.
-   */
-  onRamChange: (data: {name: string, memoryLimitGBytes: number}) => void;
-
-  $onInit(): void { }
-
-  /**
-   * Callback which is called when machine's RAM setting is changed.
-   *
-   * @param {number} value a machine's memory limit in GB
-   */
-  onRamChanged(value: number) {
-    this.onRamChange({name: this.machineName, memoryLimitGBytes: value});
-  }
-
-}
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.directive.ts b/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.directive.ts
deleted file mode 100644
index ed5a3c1320d..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.directive.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-/*
- * Copyright (c) 2015-2018 Red Hat, Inc.
- * This program and the accompanying materials are made
- * available under the terms of the Eclipse Public License 2.0
- * which is available at https://www.eclipse.org/legal/epl-2.0/
- *
- * SPDX-License-Identifier: EPL-2.0
- *
- * Contributors:
- *   Red Hat, Inc. - initial API and implementation
- */
-'use strict';
-
-/**
- * Defines a directive for displaying machine's RAM settings item.
- *
- * @author Oleksii Kurinnyi
- */
-export class RamSettingsMachineItem implements ng.IDirective {
-  restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.html';
-  replace: boolean = true;
-
-  controller: string = 'RamSettingsMachineItemController';
-  controllerAs: string = 'ramSettingsMachineItemController';
-
-  bindToController: boolean = true;
-
-  scope: {
-    [propName: string]: string
-  };
-
-  /**
-   * Default constructor that is using resource
-   */
-  constructor() {
-    this.scope = {
-      machineName: '=',
-      machineImage: '=',
-      machineMemoryLimit: '=',
-      onRamChange: '&'
-    };
-  }
-}
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.html b/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.html
deleted file mode 100644
index 5e76b09130a..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.html
+++ /dev/null
@@ -1,53 +0,0 @@
-<div class="ram-settings-machine-item">
-
-  <che-list-item flex>
-
-    <div flex="100"
-         layout="row"
-         layout-align="start stretch"
-         class="che-list-item-row">
-
-      <!-- Icon -->
-      <div layout="column" layout-align="center start">
-        <div layout="column" layout-align="center center"
-             class="ram-settings-machine-item-icon">
-          <div class="chefont cheico-stacks"></div>
-        </div>
-      </div>
-
-      <div flex layout="row" flex="auto">
-        <!-- Name -->
-        <div flex="40" layout="column" layout-align="center start">
-          <span class="che-list-item-name ram-settings-machine-item-item-name">{{ramSettingsMachineItemController.machineName}}</span>
-        </div>
-
-        <!-- Description -->
-        <div flex layout="column" layout-align="center start">
-          <span class="che-list-item-secondary ram-settings-machine-item-secondary-color">{{ramSettingsMachineItemController.machineImage}}</span>
-        </div>
-      </div>
-
-      <!-- RAM limit -->
-      <div flex="25" layout="column" layout-align="center start">
-        <ng-form name="ramAmountForm">
-          <che-number-spinner che-form="ramAmountForm"
-                              che-name="memory"
-                              che-step="0.1"
-                              che-tofixed="1"
-                              che-minvalue="0.1"
-                              che-maxvalue="100"
-                              che-unit="GB"
-                              id="machine-{{ramSettingsMachineItemController.machineName}}-ram"
-                              ng-model="ramSettingsMachineItemController.machineMemoryLimit"
-                              ng-change="ramSettingsMachineItemController.onRamChanged(value)"
-                              required>
-          </che-number-spinner>
-        </ng-form>
-      </div>
-      <div style="width: 10px"></div>
-    </div>
-
-
-  </che-list-item>
-
-</div>
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.styl b/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.styl
deleted file mode 100644
index a7ad9b59c00..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.styl
+++ /dev/null
@@ -1,32 +0,0 @@
-.ram-settings-machine-item
-  font-size 12px
-
-  md-item.che-list-item
-    border none
-
-  md-item-content
-    display block
-    border none
-
-    .che-list-item-row
-      line-height 47px
-      height 47px
-
-.ram-settings-machine-item
-
-  position relative
-  background-color $che-white-color
-  border 1px solid lighten($very-light-grey-color, 4%)
-  z-index 0
-
-  *
-    outline none
-
-  &:not(:first-of-type)
-    margin-top -1px
-
-  .ram-settings-machine-item-icon
-    width 100px
-    & > div
-      font-size 42px
-      filter grayscale(100%) opacity(50%)
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings.controller.ts b/src/app/workspaces/create-workspace/ram-settings/ram-settings.controller.ts
deleted file mode 100644
index 30fc53c8dff..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings.controller.ts
+++ /dev/null
@@ -1,109 +0,0 @@
-/*
- * Copyright (c) 2015-2018 Red Hat, Inc.
- * This program and the accompanying materials are made
- * available under the terms of the Eclipse Public License 2.0
- * which is available at https://www.eclipse.org/legal/epl-2.0/
- *
- * SPDX-License-Identifier: EPL-2.0
- *
- * Contributors:
- *   Red Hat, Inc. - initial API and implementation
- */
-'use strict';
-import {EnvironmentManager} from '../../../../components/api/environment/environment-manager';
-import {IEnvironmentManagerMachine} from '../../../../components/api/environment/environment-manager-machine';
-import {MemoryUnit, IChangeMemoryUnit} from '../../../../components/filter/change-memory-unit/change-memory-unit.filter';
-
-type machine = {
-  name: string;
-  image: string;
-  memoryLimitGBytes: number;
-};
-
-/**
- * @ngdoc controller
- * @name workspaces.ram-settings.controller:RamSettingsController
- * @description This class is handling the controller of RAM settings.
- * @author Oleksii Kurinnyi
- */
-export class RamSettingsController {
-
-  static $inject = ['$filter', '$scope'];
-
-  /**
-   * Filter service.
-   */
-  private $filter: ng.IFilterService;
-  /**
-   * List of machines provided by parent controller.
-   */
-  private machines: Array<IEnvironmentManagerMachine>;
-  /**
-   * The environment manager.
-   */
-  private environmentManager: EnvironmentManager;
-  /**
-   * List of machines.
-   */
-  private machinesList: Array<machine>;
-  /**
-   * Callback should be called when memory limit changes.
-   */
-  private onRamChange: (data: {name: string, memoryLimitBytes: number}) => void;
-
-  /**
-   * Default constructor that is using resource injection
-   */
-  constructor($filter: ng.IFilterService, $scope: ng.IScope) {
-    this.$filter = $filter;
-
-    $scope.$watch(() => { return this.machines; }, () => {
-      this.updateMachinesList();
-    }, true);
-  }
-
-  $onInit(): void { }
-
-  /**
-   * Builds list of machines properties.
-   */
-  updateMachinesList(): void {
-    if (!angular.isArray(this.machines)) {
-      this.machinesList = [];
-    } else {
-      this.machinesList = this.machines.map((machine: IEnvironmentManagerMachine) => {
-        const source: any = this.environmentManager.getSource(machine),
-              memoryLimitBytes = this.environmentManager.getMemoryLimit(machine),
-              memoryLimitGBytesWithUnit = this.$filter<IChangeMemoryUnit>('changeMemoryUnit')(memoryLimitBytes, [MemoryUnit[MemoryUnit.B], MemoryUnit[MemoryUnit.GB]]);
-        return <machine>{
-          image: source && source.image ? source.image : '',
-          name: machine.name,
-          memoryLimitGBytes: this.getNumber(memoryLimitGBytesWithUnit)
-        };
-      });
-    }
-  }
-
-  /**
-   * Callback which is called when RAM is changes.
-   *
-   * @param {string} name a machine name
-   * @param {number} memoryLimitGBytes amount of ram in GB
-   */
-  onRamChanged(name: string, memoryLimitGBytes: number): void {
-    const memoryLimitBytesWithUnit = this.$filter<IChangeMemoryUnit>('changeMemoryUnit')(memoryLimitGBytes, [MemoryUnit[MemoryUnit.GB], MemoryUnit[MemoryUnit.B]]);
-    this.onRamChange({name: name, memoryLimitBytes: this.getNumber(memoryLimitBytesWithUnit)});
-  }
-
-  /**
-   * Returns number.
-   *
-   * @param {string} memoryLimit a string which contains machine's memory limit.
-   * @return {number}
-   */
-  private getNumber(memoryLimit: string): number {
-    const [, memoryLimitNumber] = /^([^\s]+)\s+[^\s]+$/.exec(memoryLimit);
-    return parseFloat(memoryLimitNumber);
-  }
-
-}
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings.directive.ts b/src/app/workspaces/create-workspace/ram-settings/ram-settings.directive.ts
deleted file mode 100644
index 5570ed3f93e..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings.directive.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/*
- * Copyright (c) 2015-2018 Red Hat, Inc.
- * This program and the accompanying materials are made
- * available under the terms of the Eclipse Public License 2.0
- * which is available at https://www.eclipse.org/legal/epl-2.0/
- *
- * SPDX-License-Identifier: EPL-2.0
- *
- * Contributors:
- *   Red Hat, Inc. - initial API and implementation
- */
-'use strict';
-
-/**
- * Defines a directive for displaying machines RAM settings.
- *
- * @author Oleksii Kurinnyi
- */
-export class RamSettings implements ng.IDirective {
-  restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/ram-settings/ram-settings.html';
-  replace: boolean = false;
-
-  controller: string = 'RamSettingsController';
-  controllerAs: string = 'ramSettingsController';
-
-  bindToController: boolean = true;
-
-  scope: {
-    [propName: string]: string
-  };
-
-  /**
-   * Default constructor that is using resource
-   */
-  constructor() {
-    this.scope = {
-      machines: '=',
-      environmentManager: '=',
-      onRamChange: '&'
-    };
-  }
-}
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings.html b/src/app/workspaces/create-workspace/ram-settings/ram-settings.html
deleted file mode 100644
index 6081a1d9ff7..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings.html
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="ram-settings">
-  <div class="ram-settings-list">
-
-    <!-- Machines list -->
-    <che-list class="ram-settings-machines-list">
-      <ram-settings-machine-item ng-repeat="machine in ramSettingsController.machinesList | orderBy:'name'"
-                                 machine-name="machine.name"
-                                 machine-image="machine.image"
-                                 machine-memory-limit="machine.memoryLimitGBytes"
-                                 on-ram-change="ramSettingsController.onRamChanged(name, memoryLimitGBytes)"></ram-settings-machine-item>
-    </che-list>
-
-  </div>
-</div>
diff --git a/src/app/workspaces/create-workspace/ram-settings/ram-settings.styl b/src/app/workspaces/create-workspace/ram-settings/ram-settings.styl
deleted file mode 100644
index 02541525209..00000000000
--- a/src/app/workspaces/create-workspace/ram-settings/ram-settings.styl
+++ /dev/null
@@ -1,6 +0,0 @@
-.ram-settings
-
-  .ram-settings-machines-list.che-list
-    margin 0
-
-    che-box-shadow()
diff --git a/src/app/workspaces/create-workspace/devfile-selector/devfile-selector.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.controller.ts
similarity index 91%
rename from src/app/workspaces/create-workspace/devfile-selector/devfile-selector.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.controller.ts
index afbee6bf186..d002de2b8a6 100644
--- a/src/app/workspaces/create-workspace/devfile-selector/devfile-selector.controller.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.controller.ts
@@ -10,8 +10,8 @@
  *   Red Hat, Inc. - initial API and implementation
  */
 'use strict';
-import {CheWorkspace} from '../../../../components/api/workspace/che-workspace.factory';
-import {DevfileRegistry, IDevfileMetaData} from '../../../../components/api/devfile-registry.factory';
+import {CheWorkspace} from '../../../../../components/api/workspace/che-workspace.factory';
+import {DevfileRegistry, IDevfileMetaData} from '../../../../../components/api/devfile-registry.factory';
 
 /**
  * @description This class is handling the controller of devfile selector.
diff --git a/src/app/workspaces/create-workspace/devfile-selector/devfile-selector.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.directive.ts
similarity index 88%
rename from src/app/workspaces/create-workspace/devfile-selector/devfile-selector.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.directive.ts
index 6db26e7c91e..73212a12420 100644
--- a/src/app/workspaces/create-workspace/devfile-selector/devfile-selector.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.directive.ts
@@ -18,7 +18,7 @@
  */
 export class DevfileSelector implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/devfile-selector/devfile-selector.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.html';
   replace: boolean = true;
 
   controller: string = 'DevfileSelectorController';
diff --git a/src/app/workspaces/create-workspace/devfile-selector/devfile-selector.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.html
similarity index 100%
rename from src/app/workspaces/create-workspace/devfile-selector/devfile-selector.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.html
diff --git a/src/app/workspaces/create-workspace/devfile-selector/devfile-selector.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/devfile-selector/devfile-selector.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.styl
diff --git a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/namespace-selector/namespace-selector.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.controller.ts
diff --git a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.directive.ts
similarity index 88%
rename from src/app/workspaces/create-workspace/namespace-selector/namespace-selector.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.directive.ts
index 499d296fe26..50bdecf0a90 100644
--- a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.directive.ts
@@ -18,7 +18,7 @@
  */
 export class NamespaceSelector implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/namespace-selector/namespace-selector.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.html';
   replace: boolean = true;
 
   controller: string = 'NamespaceSelectorController';
diff --git a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.html
similarity index 100%
rename from src/app/workspaces/create-workspace/namespace-selector/namespace-selector.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.html
diff --git a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.service.ts
similarity index 96%
rename from src/app/workspaces/create-workspace/namespace-selector/namespace-selector.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.service.ts
index d361d08a25b..52d14713f0e 100644
--- a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.service.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.service.ts
@@ -11,8 +11,8 @@
  */
 'use strict';
 
-import {CheNamespaceRegistry} from '../../../../components/api/namespace/che-namespace-registry.factory';
-import {CheUser} from '../../../../components/api/che-user.factory';
+import {CheNamespaceRegistry} from '../../../../../components/api/namespace/che-namespace-registry.factory';
+import {CheUser} from '../../../../../components/api/che-user.factory';
 
 /**
  * Service for namespace selector.
diff --git a/src/app/workspaces/create-workspace/namespace-selector/namespace-selector.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/namespace-selector/namespace-selector.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.directive.ts
similarity index 83%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.directive.ts
index 4a737c4ce2b..0896711eff8 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.directive.ts
@@ -18,7 +18,7 @@
  */
 export class AddImportProject implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.html';
 
   bindToController: boolean = true;
   controller: string = 'AddImportProjectController';
@@ -29,6 +29,6 @@ export class AddImportProject implements ng.IDirective {
   } = {
     isProjectNameUnique: '&',
     projectOnAdd: '&',
-    devfile: '=' 
+    devfile: '='
   };
 }
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.service.ts
similarity index 99%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.service.ts
index 7934adb756b..5132fe41eda 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.service.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.service.ts
@@ -17,7 +17,7 @@ import {ImportGitProjectService} from './import-git-project/import-git-project.s
 import {ImportBlankProjectService} from './import-blank-project/import-blank-project.service';
 import {TemplateSelectorSvc} from './template-selector/template-selector.service';
 import {ProjectSource} from '../project-source.enum';
-import {IObservable, IObservableCallbackFn, Observable} from '../../../../../components/utils/observable';
+import {IObservable, IObservableCallbackFn, Observable} from '../../../../../../components/utils/observable';
 import {editingProgress} from '../project-source-selector-editing-progress';
 
 /**
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/add-import-project.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts
similarity index 84%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts
index f65396179d7..6c8c508f5ac 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive.ts
@@ -18,7 +18,7 @@
  */
 export class ImportBlankProject implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.html';
   replace: boolean = true;
 
   controller: string = 'ImportBlankProjectController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.service.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.service.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts
similarity index 83%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts
index 9bb7d47b5e8..38b9e1e6b27 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.directive.ts
@@ -18,7 +18,7 @@
  */
 export class ImportGitProject implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.html';
   replace: boolean = true;
 
   controller: string = 'ImportGitProjectController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.service.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.service.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-interface.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-interface.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-interface.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-interface.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts
similarity index 79%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts
index e6d77f9a633..e08728563d0 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive.ts
@@ -13,7 +13,7 @@
 
 export class GithubRepositoryItem implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html';
   replace: boolean = true;
 
   scope: {
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts
similarity index 97%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts
index ad276a96208..0e4c40fe442 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.controller.ts
@@ -11,7 +11,7 @@
  */
 'use strict';
 
-import { CheBranding } from '../../../../../../components/branding/che-branding.factory';
+import { CheBranding } from '../../../../../../../components/branding/che-branding.factory';
 import { ImportGithubProjectService, LoadingState } from './import-github-project.service';
 import { ProjectSource } from '../../project-source.enum';
 import { IGithubRepository } from './github-repository-interface';
@@ -226,7 +226,7 @@ export class ImportGithubProjectController {
         controllerAs: 'noGithubOauthDialogController',
         bindToController: true,
         clickOutsideToClose: true,
-        templateUrl: 'app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html'
+        templateUrl: 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html'
       });
 
       return;
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts
similarity index 83%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts
index f848cbda1a0..13a6e79c520 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.directive.ts
@@ -18,7 +18,7 @@
  */
 export class ImportGithubProject implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.html';
   replace: boolean = true;
 
   controller: string = 'ImportGithubProjectController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts
similarity index 99%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts
index bd1430faa5d..3d6e717bcb4 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.service.ts
@@ -10,7 +10,7 @@
  *   Red Hat, Inc. - initial API and implementation
  */
 'use strict';
-import {CheAPI} from '../../../../../../components/api/che-api.factory';
+import {CheAPI} from '../../../../../../../components/api/che-api.factory';
 import {IGithubRepository} from './github-repository-interface';
 import {editingProgress, IEditingProgress} from '../../project-source-selector-editing-progress';
 
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts
similarity index 83%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts
index d871543188a..629eddba757 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive.ts
@@ -18,7 +18,7 @@
  */
 export class ImportZipProject implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.html';
   replace: boolean = true;
 
   controller: string = 'ImportZipProjectController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.service.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.service.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts
similarity index 80%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts
index 65cd877a10f..a752c326b99 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive.ts
@@ -18,7 +18,7 @@
  */
 export class TemplateSelectorItem implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html';
 
   scope: {
     [propName: string]: string;
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.directive.ts
similarity index 84%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.directive.ts
index a6e6f1ec1fb..46afdbcdb09 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.directive.ts
@@ -18,7 +18,7 @@
  */
 export class TemplateSelector implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.html';
   replace: boolean = true;
 
   controller: string = 'TemplateSelectorController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.service.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.service.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/add-import-project/template-selector/template-selector.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.directive.ts
similarity index 86%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.directive.ts
index 6fa7ebdf8b2..4a06a0380f9 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.directive.ts
@@ -18,7 +18,7 @@
  */
 export class EditProject implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.html';
 
   bindToController: boolean = true;
   controller: string = 'EditProjectController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.service.ts
similarity index 97%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.service.ts
index 3440995cacd..f4d87ca0b23 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.service.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.service.ts
@@ -11,7 +11,7 @@
  */
 'use strict';
 import {ProjectMetadataService} from './project-metadata/project-metadata.service';
-import {IObservable, IObservableCallbackFn, Observable} from '../../../../../components/utils/observable';
+import {IObservable, IObservableCallbackFn, Observable} from '../../../../../../components/utils/observable';
 import {editingProgress} from '../project-source-selector-editing-progress';
 
 /**
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/edit-project.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.controller.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.controller.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts
similarity index 86%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts
index a067133c758..dd3ed43df77 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.directive.ts
@@ -18,7 +18,7 @@
  */
 export class ProjectMetadata implements ng.IDirective {
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.html';
   replace: boolean = true;
 
   controller: string = 'ProjectMetadataController';
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.html
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.html
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.service.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.service.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector-action-type.enum.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector-action-type.enum.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector-action-type.enum.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector-action-type.enum.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector-editing-progress.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector-editing-progress.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector-editing-progress.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector-editing-progress.ts
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.controller.ts
similarity index 83%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector.controller.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.controller.ts
index b2e73a4805a..1afea0f07d9 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.controller.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.controller.ts
@@ -11,7 +11,7 @@
  */
 'use strict';
 import {ProjectSourceSelectorService} from './project-source-selector.service';
-import {IProjectSourceSelectorScope} from './project-source-selector.directive';
+import {IProjectSourceSelectorScope, IProjectSourceSelectorScopeBindings} from './project-source-selector.directive';
 import {ActionType} from './project-source-selector-action-type.enum';
 
 /**
@@ -20,21 +20,27 @@ import {ActionType} from './project-source-selector-action-type.enum';
  * @author Oleksii Kurinnyi
  * @author Oleksii Orel
  */
-export class ProjectSourceSelectorController {
+export class ProjectSourceSelectorController implements IProjectSourceSelectorScopeBindings {
 
-  static $inject = ['$scope', 'projectSourceSelectorService'];
+  static $inject = [
+    '$scope',
+    'projectSourceSelectorService'
+  ];
 
   /**
-   * Directive's scope.
+   * Directive scope bindings.
    */
-  private $scope: IProjectSourceSelectorScope;
-  private devfileProjectsCopy: Array<any>;
-  private devfileProjects: Array<any>;
-  private devfile: che.IWorkspaceDevfile;
+  devfile: che.IWorkspaceDevfile;
+  onChange: () => {};
+
   /**
-   * Project selector service.
+   * Injected dependencies.
    */
+  private $scope: IProjectSourceSelectorScope;
   private projectSourceSelectorService: ProjectSourceSelectorService;
+
+  private devfileProjectsCopy: Array<any>;
+  private devfileProjects: Array<any>;
   /**
    * State of a button.
    */
@@ -86,7 +92,7 @@ export class ProjectSourceSelectorController {
           this.projectSourceSelectorService.removeProjectTemplate(project.name);
         });
         this.projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
-        this.updateData({buttonState: true, actionType: ActionType.ADD_PROJECT});
+        this.updateWidget({buttonState: true, actionType: ActionType.ADD_PROJECT});
       }
 
       if (this.devfileProjects && this.devfileProjects.length > 0) {
@@ -96,10 +102,11 @@ export class ProjectSourceSelectorController {
 
         // update list of templates to redraw the projects section
         this.projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
-        this.updateData({buttonState: true, actionType: ActionType.EDIT_PROJECT, template: this.devfileProjects[0]});
+        this.updateWidget({buttonState: true, actionType: ActionType.EDIT_PROJECT, template: this.devfileProjects[0]});
       }
 
       this.devfileProjectsCopy = angular.copy(this.devfileProjects);
+      this.onChange();
     }, true);
 
     $scope.$watch('$destroy', () => {
@@ -127,7 +134,9 @@ export class ProjectSourceSelectorController {
 
     // update list of templates to redraw the projects section
     this.projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
-    this.updateData({buttonState: true, actionType: ActionType.EDIT_PROJECT, template: projectTemplate});
+    this.updateWidget({buttonState: true, actionType: ActionType.EDIT_PROJECT, template: projectTemplate});
+
+    this.onChange();
   }
 
   /**
@@ -138,7 +147,9 @@ export class ProjectSourceSelectorController {
 
     // update list of templates to redraw the projects section
     this.projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
-    this.updateData({buttonState: true, actionType: ActionType.ADD_PROJECT});
+    this.updateWidget({buttonState: true, actionType: ActionType.ADD_PROJECT});
+
+    this.onChange();
   }
 
   /**
@@ -150,7 +161,9 @@ export class ProjectSourceSelectorController {
     // update list of templates to redraw the projects section
     this.projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
 
-    this.updateData({buttonState: true, actionType: ActionType.EDIT_PROJECT, template: projectTemplate});
+    this.updateWidget({buttonState: true, actionType: ActionType.EDIT_PROJECT, template: projectTemplate});
+
+    this.onChange();
   }
 
   /**
@@ -160,7 +173,7 @@ export class ProjectSourceSelectorController {
    * @param actionType {ActionType} current action type
    * @param template {che.IProjectTemplate} the project's template
    */
-  updateData({buttonState, actionType, template = null}: { buttonState: boolean, actionType: ActionType, template?: che.IProjectTemplate }): void {
+  updateWidget({buttonState, actionType, template = null}: { buttonState: boolean, actionType: ActionType, template?: che.IProjectTemplate }): void {
 
     const buttonId = template
       ? template.name
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.directive.ts
similarity index 91%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector.directive.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.directive.ts
index 71842831c63..996a0ad5ec7 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.directive.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.directive.ts
@@ -15,6 +15,11 @@ export interface IProjectSourceSelectorScope extends ng.IScope {
   updateWidget: (activeButtonId: string, scrollWidgetInView: boolean) => void;
 }
 
+export interface IProjectSourceSelectorScopeBindings {
+  devfile: che.IWorkspaceDevfile;
+  onChange: () => void;
+}
+
 /**
  * Defines a directive for the project selector.
  *
@@ -26,7 +31,7 @@ export class ProjectSourceSelector implements ng.IDirective {
   static $inject = ['$timeout'];
 
   restrict: string = 'E';
-  templateUrl: string = 'app/workspaces/create-workspace/project-source-selector/project-source-selector.html';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.html';
   replace: boolean = true;
 
   controller: string = 'ProjectSourceSelectorController';
@@ -35,7 +40,8 @@ export class ProjectSourceSelector implements ng.IDirective {
   bindToController: boolean = true;
 
   scope = {
-    devfile: '='
+    devfile: '=',
+    onChange: '&'
   };
 
   private $timeout: ng.ITimeoutService;
@@ -51,7 +57,7 @@ export class ProjectSourceSelector implements ng.IDirective {
     $scope.updateWidget = (activeButtonId: string, scrollToBottom: boolean) => {
       let timeoutPeriod = 0;
       this.updateWidget($element, activeButtonId, scrollToBottom, timeoutPeriod);
-      
+
     };
   }
 
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.html
similarity index 91%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector.html
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.html
index da1332df492..130d04b46f0 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.html
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.html
@@ -7,14 +7,14 @@
                           che-title="Add or Import Project"
                           che-multiline-title
                           che-font-icon="material-design icon-ic_add_24px"
-                          che-on-change="projectSourceSelectorController.updateData({buttonState: state, actionType: projectSourceSelectorController.actionType.ADD_PROJECT})"
+                          che-on-change="projectSourceSelectorController.updateWidget({buttonState: state, actionType: projectSourceSelectorController.actionType.ADD_PROJECT})"
                           che-state="projectSourceSelectorController.buttonState['ADD_PROJECT']"></toggle-single-button>
     <toggle-single-button class="edit-project-toggle-button"
                           ng-repeat="projectTemplate in projectSourceSelectorController.projectTemplates"
                           id="{{projectTemplate.name}}"
                           che-title="{{projectTemplate.name}}"
                           che-font-icon="chefont cheico-project"
-                          che-on-change="projectSourceSelectorController.updateData({buttonState: state, actionType: projectSourceSelectorController.actionType.EDIT_PROJECT, template: projectTemplate})"
+                          che-on-change="projectSourceSelectorController.updateWidget({buttonState: state, actionType: projectSourceSelectorController.actionType.EDIT_PROJECT, template: projectTemplate})"
                           che-state="projectSourceSelectorController.buttonState[projectTemplate.name]"
                           uib-tooltip="{{projectTemplate.name}}"></toggle-single-button>
   </div>
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.service.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.service.ts
similarity index 98%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector.service.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.service.ts
index 0f6ace758c7..c56a00474ae 100644
--- a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.service.ts
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.service.ts
@@ -14,7 +14,7 @@ import {ActionType} from './project-source-selector-action-type.enum';
 import {editingProgress} from './project-source-selector-editing-progress';
 import {EditProjectService} from './edit-project/edit-project.service';
 import {AddImportProjectService} from './add-import-project/add-import-project.service';
-import {RandomSvc} from '../../../../components/utils/random.service';
+import {RandomSvc} from '../../../../../components/utils/random.service';
 
 /**
  * This class is handling the service for the project selector.
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source-selector.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.styl
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source-selector.styl
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.styl
diff --git a/src/app/workspaces/create-workspace/project-source-selector/project-source.enum.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source.enum.ts
similarity index 100%
rename from src/app/workspaces/create-workspace/project-source-selector/project-source.enum.ts
rename to src/app/workspaces/create-workspace/ready-to-go-stacks/project-source-selector/project-source.enum.ts
diff --git a/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts
new file mode 100644
index 00000000000..68cd4bd0b4c
--- /dev/null
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts
@@ -0,0 +1,239 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+import { CreateWorkspaceSvc } from '../create-workspace.service';
+import { NamespaceSelectorSvc } from './namespace-selector/namespace-selector.service';
+import { RandomSvc } from '../../../../components/utils/random.service';
+import { IReadyToGoStacksScopeBindings } from './ready-to-go-stacks.directive';
+import { ProjectSourceSelectorService } from './project-source-selector/project-source-selector.service';
+
+/**
+ * This class is handling the controller for predefined stacks.
+ *
+ * @author Oleksii Kurinnyi
+ */
+export class ReadyToGoStacksController implements IReadyToGoStacksScopeBindings {
+
+  static $inject = [
+    '$timeout',
+    'createWorkspaceSvc',
+    'namespaceSelectorSvc',
+    'projectSourceSelectorService',
+    'randomSvc'
+  ];
+
+  /**
+   * Directive scope bindings.
+   */
+  onChange: (eventData: { devfile: che.IWorkspaceDevfile, attrs: { [key: string]: any } }) => void;
+  /**
+   * The selected devfile.
+   */
+  selectedDevfile: che.IWorkspaceDevfile;
+  /**
+   * The workspace name model.
+   */
+  workspaceName: string;
+  /**
+   * Form name
+   */
+  WORKSPACE_NAME_FORM = 'workspaceName';
+
+  /**
+   * Injected dependencies.
+   */
+  private $timeout: ng.ITimeoutService;
+  private createWorkspaceSvc: CreateWorkspaceSvc;
+  private namespaceSelectorSvc: NamespaceSelectorSvc;
+  private projectSourceSelectorService: ProjectSourceSelectorService;
+  private randomSvc: RandomSvc;
+
+  /**
+   * The selected namespace ID.
+   */
+  private namespaceId: string;
+  /**
+   * The map of forms.
+   */
+  private forms: Map<string, ng.IFormController>;
+  /**
+   * The list of names of existing workspaces.
+   */
+  private usedNamesList: string[];
+  /**
+   * Selected stack name.
+   */
+  private stackName: string;
+  /**
+   * Workspace name provided by user.
+   */
+  private providedWorkspaceName: string;
+
+  /**
+   * Default constructor that is using resource injection
+   */
+  constructor(
+    $timeout: ng.ITimeoutService,
+    createWorkspaceSvc: CreateWorkspaceSvc,
+    namespaceSelectorSvc: NamespaceSelectorSvc,
+    projectSourceSelectorService: ProjectSourceSelectorService,
+    randomSvc: RandomSvc
+  ) {
+    this.$timeout = $timeout;
+    this.createWorkspaceSvc = createWorkspaceSvc;
+    this.namespaceSelectorSvc = namespaceSelectorSvc;
+    this.projectSourceSelectorService = projectSourceSelectorService;
+    this.randomSvc = randomSvc;
+
+    this.usedNamesList = [];
+    this.forms = new Map();
+  }
+
+  $onInit(): void {
+    this.namespaceId = this.namespaceSelectorSvc.getNamespaceId();
+    this.createWorkspaceSvc.buildListOfUsedNames(this.namespaceId).then((namesList: string[]) => {
+      this.usedNamesList = namesList;
+      this.workspaceName = this.randomSvc.getRandString({ prefix: 'wksp-', list: this.usedNamesList });
+      this.providedWorkspaceName = this.workspaceName;
+      this.reValidateName();
+    });
+  }
+
+  /**
+   * Stores forms in list.
+   *
+   * @param name a name to register form controller.
+   * @param form a form controller.
+   */
+  registerForm(name: string, form: ng.IFormController) {
+    this.forms.set(name, form);
+  }
+
+  onDevfileNameChange(newName: string): void {
+    this.providedWorkspaceName = newName;
+    this.onDevfileChange();
+  }
+
+  /**
+   * Returns `false` if workspace name is not unique in the namespace.
+   * Only member with 'manageWorkspaces' permission can definitely know whether
+   * name is unique or not.
+   *
+   * @param name workspace name
+   */
+  isNameUnique(name: string): boolean {
+    return this.usedNamesList.indexOf(name) === -1;
+  }
+
+  /**
+   * Returns a warning message in case if namespace is missed.
+   */
+  getNamespaceEmptyMessage(): string {
+    return this.namespaceSelectorSvc.getNamespaceEmptyMessage();
+  }
+
+
+  /**
+   * Returns list of namespaces.
+   */
+  getNamespaces(): Array<che.INamespace> {
+    return this.namespaceSelectorSvc.getNamespaces();
+  }
+
+  /**
+   * Returns namespaces caption.
+   */
+  getNamespaceCaption(): string {
+    return this.namespaceSelectorSvc.getNamespaceCaption();
+  }
+
+  /**
+   * Callback which is called when stack is selected.
+   */
+  onDevfileSelected(devfile: che.IWorkspaceDevfile): void {
+    this.selectedDevfile = devfile;
+    this.onDevfileChange();
+  }
+
+  /**
+   * Callback which is called when a project template is added, updated or removed.
+   */
+  onProjectSelectorChange(): void {
+    this.onDevfileChange();
+  }
+
+  onDevfileChange(): void {
+    const devfile = angular.copy(this.selectedDevfile);
+
+    this.updateDevfileProjects(devfile);
+    devfile.metadata.name = this.providedWorkspaceName;
+
+    this.onChange({
+      devfile: devfile,
+      attrs: { stackName: this.stackName }
+    });
+  }
+
+  /**
+   * Populates a devfile with chosen projects
+   */
+  updateDevfileProjects(devfile: che.IWorkspaceDevfile): che.IWorkspaceDevfile {
+    // projects to add to current devfile
+    const projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
+
+    devfile.projects = projectTemplates;
+
+    // check if some of added projects are defined in initial devfile
+    const projectDefinedInDevfile = projectTemplates.some((template: che.IProjectTemplate) =>
+      devfile.projects.some((devfileProject: any) => devfileProject.name === template.name)
+    );
+
+    // if no projects defined in devfile were added - remove the commands from devfile as well:
+    if (projectDefinedInDevfile === false) {
+      devfile.commands = [];
+    }
+
+    return devfile;
+  }
+
+  /**
+   * Callback which is called when namespace is selected.
+   */
+  onNamespaceChanged(namespaceId: string) {
+    this.namespaceId = namespaceId;
+
+    this.createWorkspaceSvc.buildListOfUsedNames(namespaceId).then((namesList: string[]) => {
+      this.usedNamesList = namesList;
+      this.reValidateName();
+    });
+  }
+
+  /**
+   * Triggers form validation on Settings tab.
+   */
+  private reValidateName(): void {
+    const form: ng.IFormController = this.forms.get('name');
+
+    if (!form) {
+      return;
+    }
+
+    ['name', 'deskname'].forEach((inputName: string) => {
+      const model = form[inputName] as ng.INgModelController;
+      if (model) {
+        model.$validate();
+      }
+    });
+  }
+
+}
diff --git a/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.directive.ts b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.directive.ts
new file mode 100644
index 00000000000..e2c2e16181e
--- /dev/null
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.directive.ts
@@ -0,0 +1,38 @@
+/*
+ * Copyright (c) 2015-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+export interface IReadyToGoStacksScopeBindings {
+  onChange: (eventData: { devfile: che.IWorkspaceDevfile, attrs?: { [key: string]: any} }) => void;
+}
+
+export class ReadyToGoStacks implements ng.IDirective {
+
+  restrict: string = 'E';
+  templateUrl: string = 'app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html';
+  controller: string = 'ReadyToGoStacksController';
+  controllerAs: string = 'readyToGoStacksController';
+  bindToController: boolean = true;
+
+  transclude: boolean = true;
+
+  scope: {
+    onChange: string;
+  };
+
+  constructor() {
+    this.scope = {
+      onChange: '&onChange'
+    };
+  }
+
+}
diff --git a/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html
new file mode 100644
index 00000000000..fe285e8fe02
--- /dev/null
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html
@@ -0,0 +1,56 @@
+<!-- Name -->
+<che-label-container che-label-name="Name" che-label-description="Define a name for your workspace.">
+  <ng-form flex layout="column" name="workspaceNameForm">
+    <che-input-box
+      ng-init="readyToGoStacksController.registerForm(readyToGoStacksController.WORKSPACE_NAME_FORM, workspaceNameForm)"
+      che-form="workspaceNameForm" che-name="workspaceName" id="workspace-name-input"
+      che-place-holder="Name of the workspace" aria-label="Name of the workspace"
+      ng-model="readyToGoStacksController.workspaceName"
+      che-on-change="readyToGoStacksController.onDevfileNameChange($value)"
+      ng-model-options="{ updateOn: 'default blur', debounce: { 'default': 200, 'blur': 0 }, allowInvalid: false }"
+      required custom-validator="readyToGoStacksController.isNameUnique($value)" ng-minlength="3" ng-maxlength="100"
+      ng-pattern="/^[a-z\d][a-z\d-.]+[a-z\d]$/i">
+      <div ng-message="required">A name is required.</div>
+      <div ng-message="minlength">
+        The name has to be more than 3 characters long.
+      </div>
+      <div ng-message="pattern">
+        The name should not contain special characters like space, dollar, etc.
+        and should start and end only with digits, latin letters or underscores.
+      </div>
+      <div ng-message="maxlength">
+        The name has to be less than 100 characters long.
+      </div>
+      <div ng-message="customValidator">
+        This workspace name is already used.
+      </div>
+    </che-input-box>
+  </ng-form>
+</che-label-container>
+
+<!-- Namespace selector -->
+<che-label-container che-label-name="{{ readyToGoStacksController.getNamespaceCaption() }}"
+  ng-if="readyToGoStacksController.getNamespaces().length > 0 || readyToGoStacksController.getNamespaceEmptyMessage()">
+  <namespace-selector
+  on-namespace-change="readyToGoStacksController.onNamespaceChanged(namespaceId)">
+  </namespace-selector>
+</che-label-container>
+
+<!-- Stack devfile selector -->
+<che-label-container che-label-name="Select Stack"
+  che-label-description="Choose your workspace runtime environment used to build and run your projects.">
+  <devfile-selector on-devfile-select="readyToGoStacksController.onDevfileSelected(devfile)"
+    stack-name="readyToGoStacksController.stackName">
+  </devfile-selector>
+</che-label-container>
+
+<!-- Project source selector -->
+<che-label-container che-label-name="Projects">
+  <project-source-selector devfile="readyToGoStacksController.selectedDevfile"
+    on-change="readyToGoStacksController.onProjectSelectorChange()"></project-source-selector>
+</che-label-container>
+
+<!-- Create Workspace Button -->
+<che-label-container>
+  <ng-transclude></ng-transclude>
+</che-label-container>
diff --git a/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl
new file mode 100644
index 00000000000..2ba4035a37b
--- /dev/null
+++ b/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl
@@ -0,0 +1,2 @@
+.ready-to-go-progress
+  z-index 2
diff --git a/src/app/workspaces/workspace-config.service.ts b/src/app/workspaces/workspace-config.service.ts
index a0607e1409d..957886b6e5f 100644
--- a/src/app/workspaces/workspace-config.service.ts
+++ b/src/app/workspaces/workspace-config.service.ts
@@ -12,10 +12,10 @@
 'use strict';
 
 import {CheWorkspace} from '../../components/api/workspace/che-workspace.factory';
-import {NamespaceSelectorSvc} from './create-workspace/namespace-selector/namespace-selector.service';
+import {NamespaceSelectorSvc} from './create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.service';
 import {CreateWorkspaceSvc} from './create-workspace/create-workspace.service';
-import {TemplateSelectorSvc} from './create-workspace/project-source-selector/add-import-project/template-selector/template-selector.service';
-import {ImportGithubProjectService} from './create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.service';
+import {TemplateSelectorSvc} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.service';
+import {ImportGithubProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.service';
 
 /**
  * This class is handling the service for routes resolving.
diff --git a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.controller.ts b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.controller.ts
index 8f8ddd1e68d..5b4657a9b51 100644
--- a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.controller.ts
+++ b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.controller.ts
@@ -10,6 +10,7 @@
  *   Red Hat, Inc. - initial API and implementation
  */
 'use strict';
+import {CheBranding} from '../../../../components/branding/che-branding.factory';
 /**
  * @ngdoc controller
  * @name workspaces.devfile-editor.controller:WorkspaceDevfileEditorController
@@ -21,34 +22,38 @@ export class WorkspaceDevfileEditorController {
   static $inject = [
     '$log',
     '$scope',
-    '$timeout'
+    '$timeout',
+    'cheBranding'
   ];
   private $log: ng.ILogService;
   private $scope: ng.IScope;
   private $timeout: ng.ITimeoutService;
+  private cheBranding: CheBranding;
 
   private isActive: boolean;
   private workspaceDevfile: che.IWorkspaceDevfile;
   private workspaceDevfileOnChange: Function;
+  private devfileDocsUrl: string;
 
-  private editorOptions: {
-    lineWrapping: boolean,
-    lineNumbers: boolean,
-    matchBrackets: boolean,
-    mode: string,
-    onLoad: Function
-  };
   private validationErrors: string[] = [];
   private devfileYaml: string;
   private saveTimeoutPromise: ng.IPromise<any>;
 
+
   /**
    * Default constructor that is using resource
    */
-  constructor($log: ng.ILogService, $scope: ng.IScope, $timeout: ng.ITimeoutService) {
+  constructor(
+    $log: ng.ILogService,
+    $scope: ng.IScope,
+    $timeout: ng.ITimeoutService,
+    cheBranding: CheBranding
+  ) {
     this.$log = $log;
     this.$scope = $scope;
     this.$timeout = $timeout;
+    this.cheBranding = cheBranding;
+    this.devfileYaml = jsyaml.dump(this.workspaceDevfile);
 
     this.$scope.$on('edit-workspace-details', (event: ng.IAngularEvent, attrs: { status: string }) => {
       if (attrs.status === 'cancelled') {
@@ -76,6 +81,7 @@ export class WorkspaceDevfileEditorController {
 
   $onInit(): void {
     this.devfileYaml = jsyaml.safeDump(this.workspaceDevfile);
+    this.devfileDocsUrl = this.cheBranding.getDocs().devfile;
   }
 
   validate() {
@@ -114,7 +120,7 @@ export class WorkspaceDevfileEditorController {
       }
 
       angular.extend(this.workspaceDevfile, jsyaml.safeLoad(this.devfileYaml));
-      this.workspaceDevfileOnChange();
+      this.workspaceDevfileOnChange({devfile: this.workspaceDevfile});
     }, 200);
   }
 
diff --git a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.directive.ts b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.directive.ts
index ea262f46028..71dee586d3a 100644
--- a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.directive.ts
+++ b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.directive.ts
@@ -35,7 +35,8 @@ export class WorkspaceDevfileEditor {
   constructor() {
     // scope values
     this.scope = {
-      isActive: '=',
+      isActive: '=?',
+      editorReadOnly: '=?',
       workspaceDevfile: '=',
       workspaceDevfileOnChange: '&'
     };
diff --git a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.html b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.html
index 0e6b49cc039..f2f46a41dbc 100644
--- a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.html
+++ b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.html
@@ -1,12 +1,10 @@
 <div layout="column" class="config-import">
-  <div class="saving-message">
-    <span ng-if="workspaceDevfileEditorController.isSaving">Saving workspace devfile...</span>
-  </div>
   <div class="config-editor">
     <che-editor editor-content="workspaceDevfileEditorController.devfileYaml"
                 editor-state="editorState"
                 on-content-change="workspaceDevfileEditorController.onChange()"
                 editor-mode="text/x-yaml"
+                editor-read-only="!!workspaceDevfileEditorController.editorReadOnly"
                 required>
       <div ng-message="required">Devfile is required.</div>
     </che-editor>
@@ -17,7 +15,8 @@
           ng-repeat="errorMessage in workspaceDevfileEditorController.devfileValidationMessages">
         {{errorMessage}}
       </div>
-    </div>   
+    </div>
   </div>
+  <a ng-href="{{workspaceDevfileEditorController.devfileDocsUrl}}" target="_blank">Docs: Devfile Structure</a>
 </div>
 
diff --git a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.styl b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.styl
index 5622486dd14..daa7990f4b3 100644
--- a/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.styl
+++ b/src/app/workspaces/workspace-details/devfile/workspace-devfile-editor.styl
@@ -18,9 +18,3 @@
 
   .error-message
     color $error-color
-
-  .saving-message
-    color $label-info-color
-    height 18px
-    top 12px
-    position absolute
\ No newline at end of file
diff --git a/src/app/workspaces/workspace-details/workspace-details-config.ts b/src/app/workspaces/workspace-details/workspace-details-config.ts
index 6362319cbe8..3b0eadf9cf2 100644
--- a/src/app/workspaces/workspace-details/workspace-details-config.ts
+++ b/src/app/workspaces/workspace-details/workspace-details-config.ts
@@ -64,7 +64,7 @@ import {WorkspaceConfigService} from '../workspace-config.service';
 import {CheRecipeService} from './che-recipe.service';
 import {CheProjectItem} from './workspace-projects/project-item/project-item.directive';
 import {ProjectItemCtrl} from './workspace-projects/project-item/project-item.controller';
-import {NoGithubOauthDialogController} from '../create-workspace/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller';
+import {NoGithubOauthDialogController} from '../create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/oauth-dialog/no-github-oauth-dialog.controller';
 import {EditMachineVolumeDialogController} from './workspace-machine-volumes/edit-volume-dialog/edit-volume-dialog.controller';
 import {MachineVolumes} from './workspace-machine-volumes/machine-volumes.directive';
 import {MachineVolumesController} from './workspace-machine-volumes/machine-volumes.controller';
diff --git a/src/app/workspaces/workspace-details/workspace-editors/workspace-editors.styl b/src/app/workspaces/workspace-details/workspace-editors/workspace-editors.styl
index 83b552d1602..26d10b041d0 100755
--- a/src/app/workspaces/workspace-details/workspace-editors/workspace-editors.styl
+++ b/src/app/workspaces/workspace-details/workspace-editors/workspace-editors.styl
@@ -2,7 +2,7 @@ md-tab-content .workspace-editors-page
   margin 0 25px
 
 md-tab-content .workspace-editors-page:first-of-type
-  margin-top 25px
+  margin-top 11px
 
 md-tab-content .plugin-page-separator
   margin-left 25px
diff --git a/src/app/workspaces/workspace-details/workspace-overview/workspace-details-overview.controller.ts b/src/app/workspaces/workspace-details/workspace-overview/workspace-details-overview.controller.ts
index eb925b0372e..5b636c283b3 100644
--- a/src/app/workspaces/workspace-details/workspace-overview/workspace-details-overview.controller.ts
+++ b/src/app/workspaces/workspace-details/workspace-overview/workspace-details-overview.controller.ts
@@ -13,9 +13,8 @@
 import {CheWorkspace, WorkspaceStatus} from '../../../../components/api/workspace/che-workspace.factory';
 import {CheNotification} from '../../../../components/notification/che-notification.factory';
 import {ConfirmDialogService} from '../../../../components/service/confirm-dialog/confirm-dialog.service';
-import {NamespaceSelectorSvc} from '../../create-workspace/namespace-selector/namespace-selector.service';
+import {NamespaceSelectorSvc} from '../../create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.service';
 import {WorkspaceDetailsService} from '../workspace-details.service';
-import {WorkspacesService} from '../../workspaces.service';
 
 const STARTING = WorkspaceStatus[WorkspaceStatus.STARTING];
 const RUNNING = WorkspaceStatus[WorkspaceStatus.RUNNING];
diff --git a/src/app/workspaces/workspaces-config.ts b/src/app/workspaces/workspaces-config.ts
index b61907db6dd..4acdc72683b 100644
--- a/src/app/workspaces/workspaces-config.ts
+++ b/src/app/workspaces/workspaces-config.ts
@@ -19,49 +19,44 @@ import {UsageChart} from './list-workspaces/workspace-item/usage-chart.directive
 import {WorkspaceItemCtrl} from './list-workspaces/workspace-item/workspace-item.controller';
 import {WorkspaceEditModeOverlay} from './workspace-edit-mode/workspace-edit-mode-overlay.directive';
 import {WorkspaceEditModeToolbarButton} from './workspace-edit-mode/workspace-edit-mode-toolbar-button.directive';
-import {RamSettingsController} from './create-workspace/ram-settings/ram-settings.controller';
-import {RamSettings} from './create-workspace/ram-settings/ram-settings.directive';
-import {RamSettingsMachineItemController} from './create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.controller';
-import {RamSettingsMachineItem} from './create-workspace/ram-settings/ram-settings-machine-item/ram-settings-machine-item.directive';
-import {NamespaceSelectorController} from './create-workspace/namespace-selector/namespace-selector.controller';
-import {NamespaceSelectorSvc} from './create-workspace/namespace-selector/namespace-selector.service';
-import {NamespaceSelector} from './create-workspace/namespace-selector/namespace-selector.directive';
-import {ProjectSourceSelectorController} from './create-workspace/project-source-selector/project-source-selector.controller';
-import {ProjectSourceSelectorService} from './create-workspace/project-source-selector/project-source-selector.service';
-import {ProjectSourceSelector} from './create-workspace/project-source-selector/project-source-selector.directive';
-import {AddImportProjectController} from './create-workspace/project-source-selector/add-import-project/add-import-project.controller';
-import {AddImportProjectService} from './create-workspace/project-source-selector/add-import-project/add-import-project.service';
-import {AddImportProject} from './create-workspace/project-source-selector/add-import-project/add-import-project.directive';
-import {ImportBlankProjectController} from './create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller';
-import {ImportBlankProjectService} from './create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.service';
-import {ImportBlankProject} from './create-workspace/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive';
-import {ImportGitProjectController} from './create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.controller';
-import {ImportGitProjectService} from './create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.service';
-import {ImportGitProject} from './create-workspace/project-source-selector/add-import-project/import-git-project/import-git-project.directive';
-import {ImportZipProjectController} from './create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller';
-import {ImportZipProjectService} from './create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.service';
-import {ImportZipProject} from './create-workspace/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive';
-import {ImportGithubProjectController} from './create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.controller';
-import {ImportGithubProjectService} from './create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.service';
-import {ImportGithubProject} from './create-workspace/project-source-selector/add-import-project/import-github-project/import-github-project.directive';
-import {GithubRepositoryItem} from './create-workspace/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive';
-import {TemplateSelectorController} from './create-workspace/project-source-selector/add-import-project/template-selector/template-selector.controller';
-import {TemplateSelectorSvc} from './create-workspace/project-source-selector/add-import-project/template-selector/template-selector.service';
-import {TemplateSelector} from './create-workspace/project-source-selector/add-import-project/template-selector/template-selector.directive';
-import {TemplateSelectorItem} from './create-workspace/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive';
-import {EditProjectController} from './create-workspace/project-source-selector/edit-project/edit-project.controller';
-import {EditProject} from './create-workspace/project-source-selector/edit-project/edit-project.directive';
-import {EditProjectService} from './create-workspace/project-source-selector/edit-project/edit-project.service';
-import {ProjectMetadataController} from './create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.controller';
-import {ProjectMetadataService} from './create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.service';
-import {ProjectMetadata} from './create-workspace/project-source-selector/edit-project/project-metadata/project-metadata.directive';
+import {NamespaceSelectorController} from './create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.controller';
+import {NamespaceSelectorSvc} from './create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.service';
+import {NamespaceSelector} from './create-workspace/ready-to-go-stacks/namespace-selector/namespace-selector.directive';
+import {ProjectSourceSelectorController} from './create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.controller';
+import {ProjectSourceSelectorService} from './create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.service';
+import {ProjectSourceSelector} from './create-workspace/ready-to-go-stacks/project-source-selector/project-source-selector.directive';
+import {AddImportProjectController} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.controller';
+import {AddImportProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.service';
+import {AddImportProject} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/add-import-project.directive';
+import {ImportBlankProjectController} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.controller';
+import {ImportBlankProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.service';
+import {ImportBlankProject} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-blank-project/import-blank-project.directive';
+import {ImportGitProjectController} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.controller';
+import {ImportGitProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.service';
+import {ImportGitProject} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-git-project/import-git-project.directive';
+import {ImportZipProjectController} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.controller';
+import {ImportZipProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.service';
+import {ImportZipProject} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-zip-project/import-zip-project.directive';
+import {ImportGithubProjectController} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.controller';
+import {ImportGithubProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.service';
+import {ImportGithubProject} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/import-github-project.directive';
+import {GithubRepositoryItem} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/import-github-project/github-repository-item/github-repository-item.directive';
+import {TemplateSelectorController} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.controller';
+import {TemplateSelectorSvc} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.service';
+import {TemplateSelector} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector.directive';
+import {TemplateSelectorItem} from './create-workspace/ready-to-go-stacks/project-source-selector/add-import-project/template-selector/template-selector-item/template-selector-item.directive';
+import {EditProjectController} from './create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.controller';
+import {EditProject} from './create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.directive';
+import {EditProjectService} from './create-workspace/ready-to-go-stacks/project-source-selector/edit-project/edit-project.service';
+import {ProjectMetadataController} from './create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.controller';
+import {ProjectMetadataService} from './create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.service';
+import {ProjectMetadata} from './create-workspace/ready-to-go-stacks/project-source-selector/edit-project/project-metadata/project-metadata.directive';
 import {CheWorkspaceRamAllocationSliderController} from './workspace-ram-slider/che-workspace-ram-allocation-slider.controller';
 import {CheWorkspaceRamAllocationSlider} from './workspace-ram-slider/che-workspace-ram-allocation-slider.directive';
 import {WorkspaceStatus} from './workspace-status/workspace-status.directive';
 import {WorkspaceStatusIndicator} from './workspace-status/workspace-status-indicator.directive';
 import {CreateWorkspaceController} from './create-workspace/create-workspace.controller';
 import {CreateWorkspaceSvc} from './create-workspace/create-workspace.service';
-import {AfterCreationDialogController} from './create-workspace/after-creation-dialog/after-creation-dialog.controller';
 import {ShareWorkspaceController} from './share-workspace/share-workspace.controller';
 import {ShareWorkspace} from './share-workspace/share-workspace.directive';
 import {AddDeveloperController} from './share-workspace/add-developers/add-developers.controller';
@@ -75,8 +70,15 @@ import {WorkspaceWarningsController} from './workspace-details/warnings/workspac
 import {WorkspacesService} from './workspaces.service';
 import {WorkspacePluginsConfig} from './workspace-details/workspace-plugins/workspace-plugins-config';
 import {WorkspaceEditorsConfig} from './workspace-details/workspace-editors/workspace-editors-config';
-import {DevfileSelector} from './create-workspace/devfile-selector/devfile-selector.directive';
-import {DevfileSelectorController} from './create-workspace/devfile-selector/devfile-selector.controller';
+import {DevfileSelector} from './create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.directive';
+import {DevfileSelectorController} from './create-workspace/ready-to-go-stacks/devfile-selector/devfile-selector.controller';
+import {ReadyToGoStacksController} from './create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller';
+import {ReadyToGoStacks} from './create-workspace/ready-to-go-stacks/ready-to-go-stacks.directive';
+import {DevfileSourceSelector} from './create-workspace/import-custom-stack/devfile-source-selector/devfile-source-selector.directive';
+import {DevfileByUrl} from './create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.directive';
+import {DevfileByUrlController} from './create-workspace/import-custom-stack/devfile-by-url/devfile-by-url.controller';
+import {ImportStackController} from './create-workspace/import-custom-stack/import-custom-stack.controller';
+import {ImportStack} from './create-workspace/import-custom-stack/import-custom-stack.directive';
 
 /**
  * @ngdoc controller
@@ -110,10 +112,6 @@ export class WorkspacesConfig {
     register.controller('WorkspaceWarningsController', WorkspaceWarningsController);
     register.directive('devfileSelector', DevfileSelector);
     register.controller('DevfileSelectorController', DevfileSelectorController);
-    register.controller('RamSettingsController', RamSettingsController);
-    register.directive('ramSettings', RamSettings);
-    register.controller('RamSettingsMachineItemController', RamSettingsMachineItemController);
-    register.directive('ramSettingsMachineItem', RamSettingsMachineItem);
     register.controller('NamespaceSelectorController', NamespaceSelectorController);
     register.service('namespaceSelectorSvc', NamespaceSelectorSvc);
     register.directive('namespaceSelector', NamespaceSelector);
@@ -148,7 +146,6 @@ export class WorkspacesConfig {
     register.directive('projectMetadata', ProjectMetadata);
     register.controller('CreateWorkspaceController', CreateWorkspaceController);
     register.service('createWorkspaceSvc', CreateWorkspaceSvc);
-    register.controller('AfterCreationDialogController', AfterCreationDialogController);
     register.controller('ShareWorkspaceController', ShareWorkspaceController);
     register.directive('shareWorkspace', ShareWorkspace);
     register.controller('AddDeveloperController', AddDeveloperController);
@@ -157,6 +154,13 @@ export class WorkspacesConfig {
     register.directive('userItem', UserItem);
     register.service('workspaceConfigService', WorkspaceConfigService);
     register.service('workspacesService', WorkspacesService);
+    register.controller('ReadyToGoStacksController', ReadyToGoStacksController);
+    register.directive('readyToGoStacks', ReadyToGoStacks);
+    register.directive('devfileSourceSelector', DevfileSourceSelector);
+    register.directive('devfileByUrl', DevfileByUrl);
+    register.controller('DevfileByUrlController', DevfileByUrlController);
+    register.controller('ImportStackController', ImportStackController);
+    register.directive('importStack', ImportStack);
 
     // config routes
     register.app.config(['$routeProvider', ($routeProvider: che.route.IRouteProvider) => {
@@ -171,6 +175,7 @@ export class WorkspacesConfig {
           templateUrl: 'app/workspaces/create-workspace/create-workspace.html',
           controller: 'CreateWorkspaceController',
           controllerAs: 'createWorkspaceController',
+          reloadOnSearch: false,
           resolve: {
             initData: ['workspaceConfigService', (workspaceConfigService: WorkspaceConfigService) => {
               return workspaceConfigService.resolveWorkspaceRoute();
diff --git a/src/components/api/che-factory.factory.ts b/src/components/api/che-factory.factory.ts
index f206210b21e..1cbe43a043d 100644
--- a/src/components/api/che-factory.factory.ts
+++ b/src/components/api/che-factory.factory.ts
@@ -42,7 +42,6 @@ export class CheFactory {
 
   private factoriesById: Map<string, che.IFactory>;
   private factoriesByName: Map<string, che.IFactory>;
-  private parametersFactories: Map<string, che.IFactory>;
   private factoryContentsByWorkspaceId: Map<string, any>;
   private pageFactories: Array<che.IFactory>;
   private factoryPagesMap: Map<number, any>;
@@ -50,6 +49,8 @@ export class CheFactory {
   private itemsPerPage: number;
   private cheUser: CheUser;
 
+  private devfilesByUrl: Map<string, che.IWorkspaceDevfile> =  new Map();
+
   /**
    * Default constructor that is using resource
    */
@@ -65,7 +66,6 @@ export class CheFactory {
     this.factoriesById = new Map();
     // factories details by key: userID:factoryName
     this.factoriesByName = new Map();
-    this.parametersFactories = new Map();
     this.factoryContentsByWorkspaceId = new Map();
     // paging
     this.pageFactories = [];
@@ -484,25 +484,40 @@ export class CheFactory {
    * Ask for getting parameter the factory in asynchronous way
    * If there are no changes, it's not updated
    * @param parameters the factory parameters
-   * @returns {ng.IPromise<any>} the promise
+   * @returns {ng.IPromise<che.IFactory>} the promise
    */
-  fetchParameterFactory(parameters: any): ng.IPromise<any> {
-    let deferred = this.$q.defer();
-
-    let promise = this.remoteFactoryAPI.getFactoryParameters({}, parameters).$promise;
-    promise.then((factory: any) => {
+  fetchParameterFactory(parameters: any): ng.IPromise<che.IFactory> {
+    return this.remoteFactoryAPI.getFactoryParameters({}, parameters).$promise.then((factory: che.IFactory) => {
       factory.name = factory.name ? factory.name : '';
-      this.parametersFactories.set(parameters, factory);
-      deferred.resolve(factory);
+      return this.$q.when(factory);
+    });
+  }
+
+  fetchDevfile(url: string): ng.IPromise<void> {
+    return this.remoteFactoryAPI.getFactoryParameters({}, {url}).$promise.then((res: che.IFactory) => {
+      if (!res || !res.devfile) {
+        return this.$q.reject({data: {message: 'The specified link does not contain a valid Devfile.'}});
+      }
+      if (res.source === 'repo') {
+        return this.$q.reject({data: {message: 'devfile.yaml not found in the specified GitHub repository root.'}});
+      }
+      const {devfile} = res;
+      this.devfilesByUrl.set(url, devfile);
+      return this.$q.when(devfile);
     }, (error: any) => {
       if (error.status === 304) {
-        deferred.resolve(this.parametersFactories.get(parameters));
-      } else {
-        deferred.reject(error);
+        return this.$q.when(this.devfilesByUrl.get(url));
       }
+      return this.$q.reject(error);
     });
+  }
 
-    return deferred.promise;
+  hasDevfile(url: string): boolean {
+    return this.devfilesByUrl.has(url);
+  }
+
+  getDevfile(url: string): che.IWorkspaceDevfile {
+    return angular.copy(this.devfilesByUrl.get(url));
   }
 
   /**
diff --git a/src/components/attribute/multi-transclude/che-multi-transclude.directive.ts b/src/components/attribute/multi-transclude/che-multi-transclude.directive.ts
index 822abd9f0f9..918fcec7598 100644
--- a/src/components/attribute/multi-transclude/che-multi-transclude.directive.ts
+++ b/src/components/attribute/multi-transclude/che-multi-transclude.directive.ts
@@ -77,7 +77,7 @@ export abstract class CheMultiTransclude implements ng.IDirective {
         }
 
         const partElementCompiled = this.$compile(angular.element($clone[i].innerHTML))($childScope);
-        targetJq.empty().append(partElementCompiled);
+        targetJq.empty().append(partElementCompiled as any);
       }
     });
   }
diff --git a/src/components/notification/che-notification.factory.ts b/src/components/notification/che-notification.factory.ts
index 0b39ba89b97..ca24a2cb1af 100644
--- a/src/components/notification/che-notification.factory.ts
+++ b/src/components/notification/che-notification.factory.ts
@@ -99,7 +99,7 @@ export class CheNotification {
     }
   }
 
-  _removeNotification(jqNotificationElement: JQuery): void {
+  _removeNotification(jqNotificationElement: ng.IAugmentedJQuery): void {
     const elementId = jqNotificationElement[0].id;
 
     jqNotificationElement.addClass('hide-notification');
diff --git a/src/components/service/injector/che-ui-elements-injector.service.ts b/src/components/service/injector/che-ui-elements-injector.service.ts
index f042450f163..7653033b0ab 100644
--- a/src/components/service/injector/che-ui-elements-injector.service.ts
+++ b/src/components/service/injector/che-ui-elements-injector.service.ts
@@ -85,12 +85,12 @@ export class CheUIElementsInjectorService {
 
   /**
    *  Inject an additional elements if it possible.
-   * @param parentElement {string | ng.IRootElementService} - the parent DOM element for injection
-   * @param additionalElement {string | ng.IRootElementService} - the jqLite additional element
+   * @param parentElement {string | ng.IAugmentedJQuery} - the parent DOM element for injection
+   * @param additionalElement {string | ng.IAugmentedJQuery} - the jqLite additional element
    * @param scope? {ng.IScope}
    * @returns {boolean} - true if successful
    */
-  injectAdditionalElement(parentElement: string | ng.IRootElementService, additionalElement: string | ng.IRootElementService, scope?: ng.IScope): boolean {
+  injectAdditionalElement(parentElement: string | ng.IAugmentedJQuery, additionalElement: string | ng.IAugmentedJQuery, scope?: ng.IScope): boolean {
     if (!additionalElement || !parentElement) {
       return false;
     }
@@ -114,7 +114,7 @@ export class CheUIElementsInjectorService {
 
     this.deleteElementById(additionalElementId);
 
-    jqParentElement.append(compileAdditionalElement);
+    jqParentElement.append(compileAdditionalElement as any);
 
     return true;
   }
diff --git a/src/components/validator/custom-async-validator.directive.ts b/src/components/validator/custom-async-validator.directive.ts
index d816050fa80..241310b5eed 100644
--- a/src/components/validator/custom-async-validator.directive.ts
+++ b/src/components/validator/custom-async-validator.directive.ts
@@ -11,6 +11,22 @@
  */
 'use strict';
 
+interface IModelValidators extends ng.IAsyncModelValidators {
+  customAsyncValidator: (modelValue: string) => ng.IPromise<boolean>;
+}
+
+interface INgModelController extends ng.INgModelController {
+  $asyncValidators: IModelValidators;
+}
+
+interface IAttributes extends ng.IAttributes {
+  customAsyncValidator: string;
+}
+
+/**
+ * Defines a directive for custom asynchronous validation
+ * @author Oleksii Orel
+ */
 export class CustomAsyncValidator implements ng.IDirective {
   restrict = 'A';
   require = 'ngModel';
@@ -18,21 +34,18 @@ export class CustomAsyncValidator implements ng.IDirective {
   /**
    * Check that the name of workspace is unique
    */
-  link($scope: ng.IScope, element: ng.IAugmentedJQuery, attributes: ng.IAttributes, ngModel: any) {
-
-    // validate only input element
-    if ('input' === element[0].localName) {
+  link($scope: ng.IScope, element: ng.IAugmentedJQuery, attrs: IAttributes, ctrl: INgModelController) {
+    const elementLocalName = element[0].localName;
+    // validate only input or textarea elements
+    if ('input' !== elementLocalName && 'textarea' !== elementLocalName) {
+      return;
+    }
 
-      ngModel.$asyncValidators.customAsyncValidator = (modelValue: string) => {
-        // parent scope ?
-        let scopingTest = $scope.$parent;
-        if (!scopingTest) {
-          scopingTest = $scope;
-        }
+    const $testScope = $scope.$parent ? $scope.$parent : $scope;
 
-        return scopingTest.$eval((<any>attributes).customAsyncValidator, {$value: modelValue});
-      };
-    }
+    ctrl.$asyncValidators.customAsyncValidator = modelValue => {
+      return $testScope.$eval(attrs.customAsyncValidator, {$value: modelValue});
+    };
   }
 
 }
diff --git a/src/components/widget/popover/che-toggle-button-popover.directive.ts b/src/components/widget/popover/che-toggle-button-popover.directive.ts
index d0668ff148b..6681617f17c 100644
--- a/src/components/widget/popover/che-toggle-button-popover.directive.ts
+++ b/src/components/widget/popover/che-toggle-button-popover.directive.ts
@@ -97,7 +97,7 @@ export class CheToggleButtonPopover implements ng.IDirective {
         }
         if (state) {
           $transclude((clonedElement: ng.IAugmentedJQuery) => {
-            $element.find('.che-transclude').replaceWith(clonedElement);
+            $element.find('.che-transclude').replaceWith(clonedElement as any);
           });
         }
       });
diff --git a/src/components/widget/popover/che-toggle-popover.directive.ts b/src/components/widget/popover/che-toggle-popover.directive.ts
index 6ea911d1584..6a22812d280 100644
--- a/src/components/widget/popover/che-toggle-popover.directive.ts
+++ b/src/components/widget/popover/che-toggle-popover.directive.ts
@@ -144,9 +144,9 @@ export class CheTogglePopover implements ng.IDirective {
         if (isOpen) {
           $transclude(($clonedElement: ng.IAugmentedJQuery, $clonedScope: ng.IScope) => {
             childScope = $clonedScope;
-            const popover = angular.element('<div></div>').append($clonedElement).find('[che-multi-transclude-part="popover"]'),
+            const popover = angular.element('<div></div>').append($clonedElement as any).find('[che-multi-transclude-part="popover"]'),
                   popoverCompiled = this.$compile(angular.element(popover.html()))($clonedScope);
-            $element.find('.che-transclude').replaceWith(popoverCompiled);
+            $element.find('.che-transclude').replaceWith(popoverCompiled as any);
           });
         } else {
           if (childScope) {
diff --git a/src/components/widget/show-area/che-show-area.directive.ts b/src/components/widget/show-area/che-show-area.directive.ts
index 12b3df10a0f..6e8cb3eccc3 100644
--- a/src/components/widget/show-area/che-show-area.directive.ts
+++ b/src/components/widget/show-area/che-show-area.directive.ts
@@ -11,6 +11,14 @@
  */
 'use strict';
 
+interface IShowAreaScope extends ng.IScope {
+  toggleVisibility: () => void;
+  getButtonTitle: () => string;
+  isHide: boolean;
+  showTitle?: string;
+  hideTitle?: string;
+}
+
 /**
  * @ngdoc directive
  * @name components.directive:cheShowArea
@@ -23,21 +31,37 @@
  *
  * @author Oleksii Orel
  */
-export class CheShowArea {
-  restrict: string;
-  templateUrl: string;
-  transclude: boolean;
-  scope: Object;
+export class CheShowArea implements ng.IDirective {
+  restrict: string = 'E';
+  templateUrl: string = 'components/widget/show-area/che-show-area.html';
+
+  transclude: boolean = true;
+
+  scope: {
+    showTitle: string;
+    hideTitle: string;
+  };
 
   /**
    * Default constructor that is using resource
    */
   constructor() {
-    this.restrict = 'E';
-    this.transclude = true;
-    this.templateUrl = 'components/widget/show-area/che-show-area.html';
+    this.scope = {
+      showTitle: '@?',
+      hideTitle: '@?'
+    };
+  }
+
+  link($scope: IShowAreaScope) {
+    $scope.isHide = true;
+    $scope.toggleVisibility = () => {
+      $scope.isHide = !$scope.isHide;
+    };
 
-    // scope values
-    this.scope = {};
+    const showTitle = $scope.showTitle ? $scope.showTitle : 'Show';
+    const hideTitle = $scope.hideTitle ? $scope.hideTitle : 'Cancel';
+    $scope.getButtonTitle = () => {
+      return $scope.isHide ? showTitle : hideTitle;
+    }
   }
 }
diff --git a/src/components/widget/show-area/che-show-area.html b/src/components/widget/show-area/che-show-area.html
index f6bff7886bc..eb3c39e84ed 100644
--- a/src/components/widget/show-area/che-show-area.html
+++ b/src/components/widget/show-area/che-show-area.html
@@ -1,11 +1,8 @@
-<div layout="column" class="che-show-area" ng-init="isHide = true" flex>
-  <div layout="row" flex="100"
-       layout-align="start center"
-       class="transclude-area"
-       ng-class="{'hide-area' : isHide}"
-       ng-transclude></div>
+<div layout="column" class="che-show-area" flex>
+  <div class="transclude-area" layout="row" flex="100" layout-align="start center"
+       ng-class="{'hide-area' : isHide}" ng-transclude></div>
   <div layout="row" flex="100" layout-align="start center">
-    <che-button-primary che-button-title="{{isHide ? 'Show' : 'Cancel'}}" name="showArea"
-                        ng-click="isHide=!isHide"></che-button-primary>
+    <che-button-primary che-button-title="{{getButtonTitle()}}" name="showArea"
+                        ng-click="toggleVisibility()"></che-button-primary>
   </div>
 </div>
diff --git a/src/components/widget/show-area/che-show-area.styl b/src/components/widget/show-area/che-show-area.styl
index 40c0b7da4eb..ee29035e9bc 100644
--- a/src/components/widget/show-area/che-show-area.styl
+++ b/src/components/widget/show-area/che-show-area.styl
@@ -9,4 +9,3 @@
     height 0
     max-height 0
     overflow hidden
-
diff --git a/src/components/widget/tab/che-tab.styl b/src/components/widget/tab/che-tab.styl
index 8b97f0d18b9..6ebc18c7b89 100644
--- a/src/components/widget/tab/che-tab.styl
+++ b/src/components/widget/tab/che-tab.styl
@@ -48,11 +48,10 @@ md-tab-content
   background-color $background-color
 
 /* selected tab color changes */
-md-tabs-canvas md-tab-item.md-tab.md-active,
-md-tabs-canvas md-tab-item.md-tab.md-active md-icon.che-tab-label-icon::before
-  color $primary-color !important
-
-/* either !important or preprend md-tabs.md-maincontent-theme-theme  to selector */
+md-tabs.md-default-theme md-tabs-canvas md-tab-item.md-tab.md-active
+  color $primary-color
+  .che-tab-label-icon::before
+    color inherit
 
 md-tabs md-tab-item:not(.md-active)
   border-bottom 1px solid $disabled-color