You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ri...@apache.org on 2020/07/31 21:29:05 UTC

[incubator-streampipes] branch STREAMPIPES-145 updated (9a86406 -> 54ffc86)

This is an automated email from the ASF dual-hosted git repository.

riemer pushed a change to branch STREAMPIPES-145
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git.


    from 9a86406  [STREAMPIPES-145] Improve CSS theming
     new dda5f01  [STREAMPIPES-145] Modify dialog text of mixed source alert
     new 54ffc86  [STREAMPIPES-145] Remove old editor module

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 ui/deployment/modules.yml                          |   8 +-
 .../pipeline-assembly.component.ts                 | 245 -------------
 .../pipeline-element-documentation.component.ts    |  52 ---
 .../pipeline-element-icon-stand.component.ts       | 171 ---------
 .../pipeline-element-options.component.ts          | 191 ----------
 .../pipeline-element-recommendation.component.ts   | 144 --------
 .../pipeline-element/pipeline-element.component.ts |  93 -----
 .../components/pipeline/pipeline.component.ts      | 398 ---------------------
 ui/src/app/editor-v2/editor.module.ts              | 148 --------
 ui/src/app/editor/capitalize.filter.ts             |  39 --
 .../alternative/alternative.component.ts           |  33 --
 .../alternative/alternative.controller.ts          |  38 --
 .../components/alternative/alternative.tmpl.html   |  30 --
 .../components/any-remote/any-remote.component.ts  |  31 --
 .../components/any-remote/any-remote.controller.ts | 101 ------
 .../components/any-remote/any-remote.tmpl.html     |  38 --
 ui/src/app/editor/components/any/any.component.ts  |  30 --
 ui/src/app/editor/components/any/any.controller.ts |  25 --
 ui/src/app/editor/components/any/any.tmpl.html     |  23 --
 .../components/code/code-editor.directive.ts       |  91 -----
 .../app/editor/components/code/code.component.ts   |  33 --
 .../app/editor/components/code/code.controller.ts  |  44 ---
 ui/src/app/editor/components/code/code.tmpl.html   |  33 --
 .../components/collection/collection.component.ts  |  30 --
 .../components/collection/collection.controller.ts |  51 ---
 .../components/collection/collection.tmpl.html     |  60 ----
 .../customize/customize-dialog.component.ts        |  34 --
 .../customize/customize-dialog.controller.ts       |  43 ---
 .../customize/customize-dialog.tmpl.html           |  96 -----
 .../customoutput/customoutput.component.ts         |  33 --
 .../customoutput/customoutput.controller.ts        |  57 ---
 .../components/customoutput/customoutput.tmpl.html |  49 ---
 .../property-selection.component.ts                |  34 --
 .../property-selection.controller.ts               |  46 ---
 .../propertyselection/property-selection.tmpl.html |  33 --
 .../domainconcept/domainconcept.component.ts       |  31 --
 .../domainconcept/domainconcept.controller.ts      |  99 -----
 .../domainconcept/domainconcept.tmpl.html          |  49 ---
 ui/src/app/editor/components/draggable-icon.html   |  25 --
 .../components/fileupload/fileupload.component.ts  |  34 --
 .../components/fileupload/fileupload.controller.ts |  75 ----
 .../components/fileupload/fileupload.tmpl.html     |  39 --
 .../components/freetext/freetext.component.ts      |  33 --
 .../components/freetext/freetext.controller.ts     |  96 -----
 .../editor/components/freetext/freetext.tmpl.html  |  98 -----
 .../app/editor/components/group/group.component.ts |  34 --
 .../editor/components/group/group.controller.ts    |  33 --
 ui/src/app/editor/components/group/group.tmpl.html |  26 --
 .../mappingnary/mappingnary.component.ts           |  33 --
 .../mappingnary/mappingnary.controller.ts          |  86 -----
 .../components/mappingnary/mappingnary.tmpl.html   |  35 --
 .../mappingunary/mappingunary.component.ts         |  33 --
 .../mappingunary/mappingunary.controller.ts        |  65 ----
 .../components/mappingunary/mappingunary.tmpl.html |  26 --
 .../matchingproperty/matchingproperty.component.ts |  30 --
 .../matchingproperty.controller.ts                 |  24 --
 .../matchingproperty/matchingproperty.tmpl.html    |  28 --
 .../multivalue/multiple-value-input.component.ts   |  30 --
 .../multivalue/multiple-value-input.controller.ts  |  54 ---
 .../multivalue/multiple-value-input.tmpl.html      |  50 ---
 .../oneof-remote/oneof-remote.component.ts         |  31 --
 .../oneof-remote/oneof-remote.controller.ts        | 115 ------
 .../components/oneof-remote/oneof-remote.tmpl.html |  38 --
 .../app/editor/components/oneof/oneof.component.ts |  30 --
 .../editor/components/oneof/oneof.controller.ts    |  45 ---
 ui/src/app/editor/components/oneof/oneof.tmpl.html |  25 --
 .../output-strategy/base/BaseOutputStrategy.ts     |   0
 .../custom-output-strategy.component.html          |   0
 .../custom-output-strategy.component.scss          |   0
 .../custom-output-strategy.component.ts            |   0
 .../output-strategy/output-strategy.component.html |   0
 .../output-strategy/output-strategy.component.scss |   0
 .../output-strategy/output-strategy.component.ts   |   0
 .../property-selection.component.html              |   0
 .../property-selection.component.scss              |   0
 .../property-selection.component.ts                |   0
 .../user-defined-output.component.html             |   0
 .../user-defined-output.component.scss             |   0
 .../user-defined-output.component.ts               |   0
 .../pipeline-assembly.component.html               |   0
 .../pipeline-assembly.component.scss               |   0
 .../pipeline-assembly.component.ts                 | 241 ++++++++++++-
 .../pipeline-assembly.controller.ts                | 246 -------------
 .../pipeline-assembly/pipeline-assembly.tmpl.html  | 118 ------
 .../pipeline-element-documentation.component.html  |   0
 .../pipeline-element-documentation.component.scss  |   0
 .../pipeline-element-documentation.component.ts    |  47 ++-
 .../pipeline-element-documentation.controller.ts   |  43 ---
 .../pipeline-element-documentation.tmpl.html       |  24 --
 .../pipeline-element-icon-stand.component.html     |   0
 .../pipeline-element-icon-stand.component.scss     |   0
 .../pipeline-element-icon-stand.component.ts       | 167 ++++++++-
 .../pipeline-element-icon-stand.controller.ts      | 110 ------
 .../pipeline-element-icon-stand.tmpl.html          |  87 -----
 .../pipeline-element-options.component.css         |   0
 .../pipeline-element-options.component.html        |   0
 .../pipeline-element-options.component.ts          | 192 +++++++++-
 .../pipeline-element-options.controller.ts         | 148 --------
 .../pipeline-element-options.tmpl.html             |  92 -----
 .../pipeline-element-recommendation.component.html |   0
 .../pipeline-element-recommendation.component.scss |   0
 .../pipeline-element-recommendation.component.ts   | 141 +++++++-
 .../pipeline-element-recommendation.controller.ts  | 101 ------
 .../pipeline-element-recommendation.tmpl.html      |  30 --
 .../pipeline-element.component.css                 |   0
 .../pipeline-element.component.html                |   0
 .../pipeline-element/pipeline-element.component.ts |  90 ++++-
 .../pipeline-element.controller.ts                 |  77 ----
 .../pipeline-element/pipeline-element.tmpl.html    |  22 --
 .../components/pipeline/pipeline.component.css     |   0
 .../components/pipeline/pipeline.component.html    |   0
 .../components/pipeline/pipeline.component.ts      | 398 ++++++++++++++++++++-
 .../components/pipeline/pipeline.controller.ts     | 350 ------------------
 .../editor/components/pipeline/pipeline.tmpl.html  |  45 ---
 ui/src/app/editor/components/popup.html            |  25 --
 .../replaceoutput/replaceoutput.component.ts       |  31 --
 .../replaceoutput/replaceoutput.controller.ts      |  25 --
 .../replaceoutput/replaceoutput.tmpl.html          |  30 --
 .../editor/components/secret/secret.component.ts   |  31 --
 .../editor/components/secret/secret.controller.ts  |  49 ---
 .../app/editor/components/secret/secret.tmpl.html  |  28 --
 .../topic/topic-selection-dialog.component.ts      |  32 --
 .../topic/topic-selection-dialog.controller.ts     |  76 ----
 .../topic/topic-selection-dialog.tmpl.html         |  42 ---
 .../user-defined-output.component.ts               |  33 --
 .../user-defined-output.controller.ts              |  87 -----
 .../user-defined-output.tmpl.html                  |  55 ---
 .../constants/editor.constants.ts                  |   0
 .../compatible-elements.component.html             |   0
 .../compatible-elements.component.scss             |   0
 .../compatible-elements.component.ts               |   0
 .../customize.controller.ts                        | 151 --------
 .../customizeElementDialog.tmpl.html               | 161 ---------
 .../dialog/customize/customize.component.html      |   0
 .../dialog/customize/customize.component.scss      |   0
 .../dialog/customize/customize.component.ts        |   9 +-
 .../editor/dialog/help/help-dialog.controller.ts   | 130 -------
 .../app/editor/dialog/help/help-dialog.tmpl.html   | 103 ------
 .../dialog/help/help.component.html                |   0
 .../dialog/help/help.component.scss                |   0
 .../dialog/help/help.component.ts                  |   0
 .../matching-error/matching-error.component.html   |   0
 .../matching-error/matching-error.component.scss   |   0
 .../matching-error/matching-error.component.ts     |   0
 .../matching-error/matching-error.controller.ts    |  45 ---
 .../dialog/matching-error/matching-error.tmpl.html |  64 ----
 ...sing-elements-for-tutorial-dialog.controller.ts |  38 --
 .../missing-elements-for-tutorial-dialog.tmpl.html |  46 ---
 .../missing-elements-for-tutorial.component.html   |   0
 .../missing-elements-for-tutorial.component.scss   |   0
 .../missing-elements-for-tutorial.component.ts     |   0
 .../possible-elements-dialog.controller.ts         |  55 ---
 .../possible-elements-dialog.tmpl.html             |  50 ---
 .../save-pipeline/save-pipeline.component.html     |   0
 .../save-pipeline/save-pipeline.component.scss     |   0
 .../save-pipeline/save-pipeline.component.ts       |   0
 .../save-pipeline/save-pipeline.controller.ts      | 151 --------
 .../save-pipeline/submitPipelineModal.tmpl.html    |  74 ----
 .../topic/topic-selection-modal.controller.ts      |  89 -----
 .../dialog/topic/topic-selection-modal.tmpl.html   |  54 ---
 .../welcome-tour/welcome-tour-dialog.controller.ts |  54 ---
 .../welcome-tour/welcome-tour-dialog.tmpl.html     |  54 ---
 .../welcome-tour/welcome-tour.component.html       |   0
 .../welcome-tour/welcome-tour.component.scss       |   0
 .../dialog/welcome-tour/welcome-tour.component.ts  |   0
 .../{editor-v2 => editor}/editor.component.html    |   0
 .../{editor-v2 => editor}/editor.component.scss    |   0
 .../app/{editor-v2 => editor}/editor.component.ts  |  16 +-
 ui/src/app/editor/editor.controller.ts             | 282 ---------------
 ui/src/app/editor/editor.html                      |  72 ----
 ui/src/app/editor/editor.module.ts                 | 223 +++++++-----
 .../editor/filter/display-recommended.filter.ts    |  48 ---
 ui/src/app/editor/filter/element-name.filter.ts    |  41 ---
 ui/src/app/editor/filter/select.filter.ts          |  42 ---
 ui/src/app/editor/image-bind.directive.ts          |  33 --
 .../{editor-v2 => editor}/model/editor.model.ts    |   0
 ui/src/app/editor/my-data-bind.directive.ts        |  33 --
 .../services/editor-dialog-manager.service.ts      |   0
 .../services/editor.service.ts                     |   8 +-
 .../services/jsplumb-bridge.service.ts             |   0
 .../services/jsplumb-config.service.ts             |   0
 .../services/jsplumb.service.ts                    |   0
 .../services/object-provider.service.ts            |   0
 .../services/pipeline-editor.service.ts            |   0
 .../pipeline-element-recommendation.service.ts     |   0
 .../services/pipeline-positioning.service.ts       |   0
 .../services/pipeline-validation.service.ts        |   0
 .../{editor-v2 => editor}/utils/editor.utils.ts    |   0
 .../{editor-v2 => editor}/utils/style-sanitizer.ts |   0
 .../text/custom-output-validator.directive.ts      |  38 --
 .../validator/text/text-validator.directive.ts     |  66 ----
 .../components/edit/quickedit.component.ts         |   2 +-
 .../elements/pipeline-elements-row.component.ts    |   4 +-
 .../elements/pipeline-elements.component.ts        |   2 +-
 .../preview/pipeline-preview.component.ts          |  10 +-
 .../pipeline-details/pipeline-details.component.ts |   2 +-
 .../pipeline-details/pipeline-details.module.ts    |  13 +-
 ui/src/app/services/services.module.ts             |  12 +-
 198 files changed, 1328 insertions(+), 8315 deletions(-)
 delete mode 100644 ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.ts
 delete mode 100644 ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.ts
 delete mode 100644 ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts
 delete mode 100644 ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.ts
 delete mode 100644 ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts
 delete mode 100644 ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.ts
 delete mode 100644 ui/src/app/editor-v2/components/pipeline/pipeline.component.ts
 delete mode 100644 ui/src/app/editor-v2/editor.module.ts
 delete mode 100644 ui/src/app/editor/capitalize.filter.ts
 delete mode 100644 ui/src/app/editor/components/alternative/alternative.component.ts
 delete mode 100644 ui/src/app/editor/components/alternative/alternative.controller.ts
 delete mode 100644 ui/src/app/editor/components/alternative/alternative.tmpl.html
 delete mode 100644 ui/src/app/editor/components/any-remote/any-remote.component.ts
 delete mode 100644 ui/src/app/editor/components/any-remote/any-remote.controller.ts
 delete mode 100644 ui/src/app/editor/components/any-remote/any-remote.tmpl.html
 delete mode 100644 ui/src/app/editor/components/any/any.component.ts
 delete mode 100644 ui/src/app/editor/components/any/any.controller.ts
 delete mode 100644 ui/src/app/editor/components/any/any.tmpl.html
 delete mode 100644 ui/src/app/editor/components/code/code-editor.directive.ts
 delete mode 100644 ui/src/app/editor/components/code/code.component.ts
 delete mode 100644 ui/src/app/editor/components/code/code.controller.ts
 delete mode 100644 ui/src/app/editor/components/code/code.tmpl.html
 delete mode 100644 ui/src/app/editor/components/collection/collection.component.ts
 delete mode 100644 ui/src/app/editor/components/collection/collection.controller.ts
 delete mode 100644 ui/src/app/editor/components/collection/collection.tmpl.html
 delete mode 100644 ui/src/app/editor/components/customize/customize-dialog.component.ts
 delete mode 100644 ui/src/app/editor/components/customize/customize-dialog.controller.ts
 delete mode 100644 ui/src/app/editor/components/customize/customize-dialog.tmpl.html
 delete mode 100644 ui/src/app/editor/components/customoutput/customoutput.component.ts
 delete mode 100644 ui/src/app/editor/components/customoutput/customoutput.controller.ts
 delete mode 100644 ui/src/app/editor/components/customoutput/customoutput.tmpl.html
 delete mode 100644 ui/src/app/editor/components/customoutput/propertyselection/property-selection.component.ts
 delete mode 100644 ui/src/app/editor/components/customoutput/propertyselection/property-selection.controller.ts
 delete mode 100644 ui/src/app/editor/components/customoutput/propertyselection/property-selection.tmpl.html
 delete mode 100644 ui/src/app/editor/components/domainconcept/domainconcept.component.ts
 delete mode 100644 ui/src/app/editor/components/domainconcept/domainconcept.controller.ts
 delete mode 100644 ui/src/app/editor/components/domainconcept/domainconcept.tmpl.html
 delete mode 100644 ui/src/app/editor/components/draggable-icon.html
 delete mode 100644 ui/src/app/editor/components/fileupload/fileupload.component.ts
 delete mode 100644 ui/src/app/editor/components/fileupload/fileupload.controller.ts
 delete mode 100644 ui/src/app/editor/components/fileupload/fileupload.tmpl.html
 delete mode 100644 ui/src/app/editor/components/freetext/freetext.component.ts
 delete mode 100644 ui/src/app/editor/components/freetext/freetext.controller.ts
 delete mode 100644 ui/src/app/editor/components/freetext/freetext.tmpl.html
 delete mode 100644 ui/src/app/editor/components/group/group.component.ts
 delete mode 100644 ui/src/app/editor/components/group/group.controller.ts
 delete mode 100644 ui/src/app/editor/components/group/group.tmpl.html
 delete mode 100644 ui/src/app/editor/components/mappingnary/mappingnary.component.ts
 delete mode 100644 ui/src/app/editor/components/mappingnary/mappingnary.controller.ts
 delete mode 100644 ui/src/app/editor/components/mappingnary/mappingnary.tmpl.html
 delete mode 100644 ui/src/app/editor/components/mappingunary/mappingunary.component.ts
 delete mode 100644 ui/src/app/editor/components/mappingunary/mappingunary.controller.ts
 delete mode 100644 ui/src/app/editor/components/mappingunary/mappingunary.tmpl.html
 delete mode 100644 ui/src/app/editor/components/matchingproperty/matchingproperty.component.ts
 delete mode 100644 ui/src/app/editor/components/matchingproperty/matchingproperty.controller.ts
 delete mode 100644 ui/src/app/editor/components/matchingproperty/matchingproperty.tmpl.html
 delete mode 100644 ui/src/app/editor/components/multivalue/multiple-value-input.component.ts
 delete mode 100644 ui/src/app/editor/components/multivalue/multiple-value-input.controller.ts
 delete mode 100644 ui/src/app/editor/components/multivalue/multiple-value-input.tmpl.html
 delete mode 100644 ui/src/app/editor/components/oneof-remote/oneof-remote.component.ts
 delete mode 100644 ui/src/app/editor/components/oneof-remote/oneof-remote.controller.ts
 delete mode 100644 ui/src/app/editor/components/oneof-remote/oneof-remote.tmpl.html
 delete mode 100644 ui/src/app/editor/components/oneof/oneof.component.ts
 delete mode 100644 ui/src/app/editor/components/oneof/oneof.controller.ts
 delete mode 100644 ui/src/app/editor/components/oneof/oneof.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/base/BaseOutputStrategy.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/custom-output/custom-output-strategy.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/custom-output/custom-output-strategy.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/custom-output/custom-output-strategy.component.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/output-strategy.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/output-strategy.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/output-strategy.component.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/property-selection/property-selection.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/property-selection/property-selection.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/property-selection/property-selection.component.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/user-defined-output/user-defined-output.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/user-defined-output/user-defined-output.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/components/output-strategy/user-defined-output/user-defined-output.component.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-assembly/pipeline-assembly.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-assembly/pipeline-assembly.component.scss (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-documentation/pipeline-element-documentation.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-documentation/pipeline-element-documentation.component.scss (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.scss (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-options/pipeline-element-options.component.css (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-options/pipeline-element-options.component.html (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-recommendation/pipeline-element-recommendation.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element-recommendation/pipeline-element-recommendation.component.scss (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element/pipeline-element.component.css (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline-element/pipeline-element.component.html (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline-element/pipeline-element.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline-element/pipeline-element.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/components/pipeline/pipeline.component.css (100%)
 rename ui/src/app/{editor-v2 => editor}/components/pipeline/pipeline.component.html (100%)
 delete mode 100644 ui/src/app/editor/components/pipeline/pipeline.controller.ts
 delete mode 100644 ui/src/app/editor/components/pipeline/pipeline.tmpl.html
 delete mode 100644 ui/src/app/editor/components/popup.html
 delete mode 100644 ui/src/app/editor/components/replaceoutput/replaceoutput.component.ts
 delete mode 100644 ui/src/app/editor/components/replaceoutput/replaceoutput.controller.ts
 delete mode 100644 ui/src/app/editor/components/replaceoutput/replaceoutput.tmpl.html
 delete mode 100644 ui/src/app/editor/components/secret/secret.component.ts
 delete mode 100644 ui/src/app/editor/components/secret/secret.controller.ts
 delete mode 100644 ui/src/app/editor/components/secret/secret.tmpl.html
 delete mode 100644 ui/src/app/editor/components/topic/topic-selection-dialog.component.ts
 delete mode 100644 ui/src/app/editor/components/topic/topic-selection-dialog.controller.ts
 delete mode 100644 ui/src/app/editor/components/topic/topic-selection-dialog.tmpl.html
 delete mode 100644 ui/src/app/editor/components/userdefinedoutput/user-defined-output.component.ts
 delete mode 100644 ui/src/app/editor/components/userdefinedoutput/user-defined-output.controller.ts
 delete mode 100644 ui/src/app/editor/components/userdefinedoutput/user-defined-output.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/constants/editor.constants.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/compatible-elements/compatible-elements.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/compatible-elements/compatible-elements.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/compatible-elements/compatible-elements.component.ts (100%)
 delete mode 100644 ui/src/app/editor/dialog/customize-pipeline-element/customize.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/customize-pipeline-element/customizeElementDialog.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/dialog/customize/customize.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/customize/customize.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/customize/customize.component.ts (96%)
 delete mode 100644 ui/src/app/editor/dialog/help/help-dialog.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/help/help-dialog.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/dialog/help/help.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/help/help.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/help/help.component.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/matching-error/matching-error.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/matching-error/matching-error.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/matching-error/matching-error.component.ts (100%)
 delete mode 100644 ui/src/app/editor/dialog/matching-error/matching-error.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/matching-error/matching-error.tmpl.html
 delete mode 100644 ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.ts (100%)
 delete mode 100644 ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/dialog/save-pipeline/save-pipeline.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/save-pipeline/save-pipeline.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/save-pipeline/save-pipeline.component.ts (100%)
 delete mode 100644 ui/src/app/editor/dialog/save-pipeline/save-pipeline.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/save-pipeline/submitPipelineModal.tmpl.html
 delete mode 100644 ui/src/app/editor/dialog/topic/topic-selection-modal.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/topic/topic-selection-modal.tmpl.html
 delete mode 100644 ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.controller.ts
 delete mode 100644 ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.tmpl.html
 rename ui/src/app/{editor-v2 => editor}/dialog/welcome-tour/welcome-tour.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/welcome-tour/welcome-tour.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/dialog/welcome-tour/welcome-tour.component.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/editor.component.html (100%)
 rename ui/src/app/{editor-v2 => editor}/editor.component.scss (100%)
 rename ui/src/app/{editor-v2 => editor}/editor.component.ts (97%)
 delete mode 100644 ui/src/app/editor/editor.controller.ts
 delete mode 100644 ui/src/app/editor/editor.html
 delete mode 100644 ui/src/app/editor/filter/display-recommended.filter.ts
 delete mode 100644 ui/src/app/editor/filter/element-name.filter.ts
 delete mode 100644 ui/src/app/editor/filter/select.filter.ts
 delete mode 100644 ui/src/app/editor/image-bind.directive.ts
 rename ui/src/app/{editor-v2 => editor}/model/editor.model.ts (100%)
 delete mode 100644 ui/src/app/editor/my-data-bind.directive.ts
 rename ui/src/app/{editor-v2 => editor}/services/editor-dialog-manager.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/editor.service.ts (97%)
 rename ui/src/app/{editor-v2 => editor}/services/jsplumb-bridge.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/jsplumb-config.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/jsplumb.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/object-provider.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/pipeline-editor.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/pipeline-element-recommendation.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/pipeline-positioning.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/services/pipeline-validation.service.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/utils/editor.utils.ts (100%)
 rename ui/src/app/{editor-v2 => editor}/utils/style-sanitizer.ts (100%)
 delete mode 100644 ui/src/app/editor/validator/text/custom-output-validator.directive.ts
 delete mode 100644 ui/src/app/editor/validator/text/text-validator.directive.ts


[incubator-streampipes] 01/02: [STREAMPIPES-145] Modify dialog text of mixed source alert

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

riemer pushed a commit to branch STREAMPIPES-145
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git

commit dda5f0191f1b2f725a3394918817aa3709866512
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Fri Jul 31 22:52:55 2020 +0200

    [STREAMPIPES-145] Modify dialog text of mixed source alert
---
 ui/src/app/editor-v2/components/pipeline/pipeline.component.ts | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts b/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts
index bcdfcb6..c963452 100644
--- a/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts
+++ b/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts
@@ -165,10 +165,9 @@ export class PipelineComponent implements OnInit {
     this.dialog.open(ConfirmDialogComponent, {
       width: '500px',
       data: {
-        "title": "Do you really want to delete the current pipeline?",
-        "subtitle": "This cannot be undone.",
+        "title": "Currently, it is not possible to mix data streams and data sets in a single pipeline.",
         "confirmAndCancel": false,
-        "okTitle": "Close",
+        "okTitle": "Ok",
       },
     });
   }


[incubator-streampipes] 02/02: [STREAMPIPES-145] Remove old editor module

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

riemer pushed a commit to branch STREAMPIPES-145
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git

commit 54ffc8677e06af660df66af5b13cf9be458b5a71
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Fri Jul 31 23:28:46 2020 +0200

    [STREAMPIPES-145] Remove old editor module
---
 ui/deployment/modules.yml                          |   8 +-
 .../pipeline-assembly.component.ts                 | 245 -------------
 .../pipeline-element-documentation.component.ts    |  52 ---
 .../pipeline-element-icon-stand.component.ts       | 171 ---------
 .../pipeline-element-options.component.ts          | 191 ----------
 .../pipeline-element-recommendation.component.ts   | 144 --------
 .../pipeline-element/pipeline-element.component.ts |  93 -----
 .../components/pipeline/pipeline.component.ts      | 397 --------------------
 ui/src/app/editor-v2/editor.module.ts              | 148 --------
 ui/src/app/editor/capitalize.filter.ts             |  39 --
 .../alternative/alternative.component.ts           |  33 --
 .../alternative/alternative.controller.ts          |  38 --
 .../components/alternative/alternative.tmpl.html   |  30 --
 .../components/any-remote/any-remote.component.ts  |  31 --
 .../components/any-remote/any-remote.controller.ts | 101 ------
 .../components/any-remote/any-remote.tmpl.html     |  38 --
 ui/src/app/editor/components/any/any.component.ts  |  30 --
 ui/src/app/editor/components/any/any.controller.ts |  25 --
 ui/src/app/editor/components/any/any.tmpl.html     |  23 --
 .../components/code/code-editor.directive.ts       |  91 -----
 .../app/editor/components/code/code.component.ts   |  33 --
 .../app/editor/components/code/code.controller.ts  |  44 ---
 ui/src/app/editor/components/code/code.tmpl.html   |  33 --
 .../components/collection/collection.component.ts  |  30 --
 .../components/collection/collection.controller.ts |  51 ---
 .../components/collection/collection.tmpl.html     |  60 ----
 .../customize/customize-dialog.component.ts        |  34 --
 .../customize/customize-dialog.controller.ts       |  43 ---
 .../customize/customize-dialog.tmpl.html           |  96 -----
 .../customoutput/customoutput.component.ts         |  33 --
 .../customoutput/customoutput.controller.ts        |  57 ---
 .../components/customoutput/customoutput.tmpl.html |  49 ---
 .../property-selection.component.ts                |  34 --
 .../property-selection.controller.ts               |  46 ---
 .../propertyselection/property-selection.tmpl.html |  33 --
 .../domainconcept/domainconcept.component.ts       |  31 --
 .../domainconcept/domainconcept.controller.ts      |  99 -----
 .../domainconcept/domainconcept.tmpl.html          |  49 ---
 ui/src/app/editor/components/draggable-icon.html   |  25 --
 .../components/fileupload/fileupload.component.ts  |  34 --
 .../components/fileupload/fileupload.controller.ts |  75 ----
 .../components/fileupload/fileupload.tmpl.html     |  39 --
 .../components/freetext/freetext.component.ts      |  33 --
 .../components/freetext/freetext.controller.ts     |  96 -----
 .../editor/components/freetext/freetext.tmpl.html  |  98 -----
 .../app/editor/components/group/group.component.ts |  34 --
 .../editor/components/group/group.controller.ts    |  33 --
 ui/src/app/editor/components/group/group.tmpl.html |  26 --
 .../mappingnary/mappingnary.component.ts           |  33 --
 .../mappingnary/mappingnary.controller.ts          |  86 -----
 .../components/mappingnary/mappingnary.tmpl.html   |  35 --
 .../mappingunary/mappingunary.component.ts         |  33 --
 .../mappingunary/mappingunary.controller.ts        |  65 ----
 .../components/mappingunary/mappingunary.tmpl.html |  26 --
 .../matchingproperty/matchingproperty.component.ts |  30 --
 .../matchingproperty.controller.ts                 |  24 --
 .../matchingproperty/matchingproperty.tmpl.html    |  28 --
 .../multivalue/multiple-value-input.component.ts   |  30 --
 .../multivalue/multiple-value-input.controller.ts  |  54 ---
 .../multivalue/multiple-value-input.tmpl.html      |  50 ---
 .../oneof-remote/oneof-remote.component.ts         |  31 --
 .../oneof-remote/oneof-remote.controller.ts        | 115 ------
 .../components/oneof-remote/oneof-remote.tmpl.html |  38 --
 .../app/editor/components/oneof/oneof.component.ts |  30 --
 .../editor/components/oneof/oneof.controller.ts    |  45 ---
 ui/src/app/editor/components/oneof/oneof.tmpl.html |  25 --
 .../output-strategy/base/BaseOutputStrategy.ts     |   0
 .../custom-output-strategy.component.html          |   0
 .../custom-output-strategy.component.scss          |   0
 .../custom-output-strategy.component.ts            |   0
 .../output-strategy/output-strategy.component.html |   0
 .../output-strategy/output-strategy.component.scss |   0
 .../output-strategy/output-strategy.component.ts   |   0
 .../property-selection.component.html              |   0
 .../property-selection.component.scss              |   0
 .../property-selection.component.ts                |   0
 .../user-defined-output.component.html             |   0
 .../user-defined-output.component.scss             |   0
 .../user-defined-output.component.ts               |   0
 .../pipeline-assembly.component.html               |   0
 .../pipeline-assembly.component.scss               |   0
 .../pipeline-assembly.component.ts                 | 241 ++++++++++++-
 .../pipeline-assembly.controller.ts                | 246 -------------
 .../pipeline-assembly/pipeline-assembly.tmpl.html  | 118 ------
 .../pipeline-element-documentation.component.html  |   0
 .../pipeline-element-documentation.component.scss  |   0
 .../pipeline-element-documentation.component.ts    |  47 ++-
 .../pipeline-element-documentation.controller.ts   |  43 ---
 .../pipeline-element-documentation.tmpl.html       |  24 --
 .../pipeline-element-icon-stand.component.html     |   0
 .../pipeline-element-icon-stand.component.scss     |   0
 .../pipeline-element-icon-stand.component.ts       | 167 ++++++++-
 .../pipeline-element-icon-stand.controller.ts      | 110 ------
 .../pipeline-element-icon-stand.tmpl.html          |  87 -----
 .../pipeline-element-options.component.css         |   0
 .../pipeline-element-options.component.html        |   0
 .../pipeline-element-options.component.ts          | 192 +++++++++-
 .../pipeline-element-options.controller.ts         | 148 --------
 .../pipeline-element-options.tmpl.html             |  92 -----
 .../pipeline-element-recommendation.component.html |   0
 .../pipeline-element-recommendation.component.scss |   0
 .../pipeline-element-recommendation.component.ts   | 141 +++++++-
 .../pipeline-element-recommendation.controller.ts  | 101 ------
 .../pipeline-element-recommendation.tmpl.html      |  30 --
 .../pipeline-element.component.css                 |   0
 .../pipeline-element.component.html                |   0
 .../pipeline-element/pipeline-element.component.ts |  90 ++++-
 .../pipeline-element.controller.ts                 |  77 ----
 .../pipeline-element/pipeline-element.tmpl.html    |  22 --
 .../components/pipeline/pipeline.component.css     |   0
 .../components/pipeline/pipeline.component.html    |   0
 .../components/pipeline/pipeline.component.ts      | 398 ++++++++++++++++++++-
 .../components/pipeline/pipeline.controller.ts     | 350 ------------------
 .../editor/components/pipeline/pipeline.tmpl.html  |  45 ---
 ui/src/app/editor/components/popup.html            |  25 --
 .../replaceoutput/replaceoutput.component.ts       |  31 --
 .../replaceoutput/replaceoutput.controller.ts      |  25 --
 .../replaceoutput/replaceoutput.tmpl.html          |  30 --
 .../editor/components/secret/secret.component.ts   |  31 --
 .../editor/components/secret/secret.controller.ts  |  49 ---
 .../app/editor/components/secret/secret.tmpl.html  |  28 --
 .../topic/topic-selection-dialog.component.ts      |  32 --
 .../topic/topic-selection-dialog.controller.ts     |  76 ----
 .../topic/topic-selection-dialog.tmpl.html         |  42 ---
 .../user-defined-output.component.ts               |  33 --
 .../user-defined-output.controller.ts              |  87 -----
 .../user-defined-output.tmpl.html                  |  55 ---
 .../constants/editor.constants.ts                  |   0
 .../compatible-elements.component.html             |   0
 .../compatible-elements.component.scss             |   0
 .../compatible-elements.component.ts               |   0
 .../customize.controller.ts                        | 151 --------
 .../customizeElementDialog.tmpl.html               | 161 ---------
 .../dialog/customize/customize.component.html      |   0
 .../dialog/customize/customize.component.scss      |   0
 .../dialog/customize/customize.component.ts        |   9 +-
 .../editor/dialog/help/help-dialog.controller.ts   | 130 -------
 .../app/editor/dialog/help/help-dialog.tmpl.html   | 103 ------
 .../dialog/help/help.component.html                |   0
 .../dialog/help/help.component.scss                |   0
 .../dialog/help/help.component.ts                  |   0
 .../matching-error/matching-error.component.html   |   0
 .../matching-error/matching-error.component.scss   |   0
 .../matching-error/matching-error.component.ts     |   0
 .../matching-error/matching-error.controller.ts    |  45 ---
 .../dialog/matching-error/matching-error.tmpl.html |  64 ----
 ...sing-elements-for-tutorial-dialog.controller.ts |  38 --
 .../missing-elements-for-tutorial-dialog.tmpl.html |  46 ---
 .../missing-elements-for-tutorial.component.html   |   0
 .../missing-elements-for-tutorial.component.scss   |   0
 .../missing-elements-for-tutorial.component.ts     |   0
 .../possible-elements-dialog.controller.ts         |  55 ---
 .../possible-elements-dialog.tmpl.html             |  50 ---
 .../save-pipeline/save-pipeline.component.html     |   0
 .../save-pipeline/save-pipeline.component.scss     |   0
 .../save-pipeline/save-pipeline.component.ts       |   0
 .../save-pipeline/save-pipeline.controller.ts      | 151 --------
 .../save-pipeline/submitPipelineModal.tmpl.html    |  74 ----
 .../topic/topic-selection-modal.controller.ts      |  89 -----
 .../dialog/topic/topic-selection-modal.tmpl.html   |  54 ---
 .../welcome-tour/welcome-tour-dialog.controller.ts |  54 ---
 .../welcome-tour/welcome-tour-dialog.tmpl.html     |  54 ---
 .../welcome-tour/welcome-tour.component.html       |   0
 .../welcome-tour/welcome-tour.component.scss       |   0
 .../dialog/welcome-tour/welcome-tour.component.ts  |   0
 .../{editor-v2 => editor}/editor.component.html    |   0
 .../{editor-v2 => editor}/editor.component.scss    |   0
 .../app/{editor-v2 => editor}/editor.component.ts  |  16 +-
 ui/src/app/editor/editor.controller.ts             | 282 ---------------
 ui/src/app/editor/editor.html                      |  72 ----
 ui/src/app/editor/editor.module.ts                 | 223 +++++++-----
 .../editor/filter/display-recommended.filter.ts    |  48 ---
 ui/src/app/editor/filter/element-name.filter.ts    |  41 ---
 ui/src/app/editor/filter/select.filter.ts          |  42 ---
 ui/src/app/editor/image-bind.directive.ts          |  33 --
 .../{editor-v2 => editor}/model/editor.model.ts    |   0
 ui/src/app/editor/my-data-bind.directive.ts        |  33 --
 .../services/editor-dialog-manager.service.ts      |   0
 .../services/editor.service.ts                     |   8 +-
 .../services/jsplumb-bridge.service.ts             |   0
 .../services/jsplumb-config.service.ts             |   0
 .../services/jsplumb.service.ts                    |   0
 .../services/object-provider.service.ts            |   0
 .../services/pipeline-editor.service.ts            |   0
 .../pipeline-element-recommendation.service.ts     |   0
 .../services/pipeline-positioning.service.ts       |   0
 .../services/pipeline-validation.service.ts        |   0
 .../{editor-v2 => editor}/utils/editor.utils.ts    |   0
 .../{editor-v2 => editor}/utils/style-sanitizer.ts |   0
 .../text/custom-output-validator.directive.ts      |  38 --
 .../validator/text/text-validator.directive.ts     |  66 ----
 .../components/edit/quickedit.component.ts         |   2 +-
 .../elements/pipeline-elements-row.component.ts    |   4 +-
 .../elements/pipeline-elements.component.ts        |   2 +-
 .../preview/pipeline-preview.component.ts          |  10 +-
 .../pipeline-details/pipeline-details.component.ts |   2 +-
 .../pipeline-details/pipeline-details.module.ts    |  13 +-
 ui/src/app/services/services.module.ts             |  12 +-
 198 files changed, 1328 insertions(+), 8314 deletions(-)

diff --git a/ui/deployment/modules.yml b/ui/deployment/modules.yml
index ef08be6..811b149 100644
--- a/ui/deployment/modules.yml
+++ b/ui/deployment/modules.yml
@@ -19,14 +19,14 @@ spEditor:
   ng1_controller: ''
   ng5_moduleName: 'EditorModule'
   ng5_component: 'EditorComponent'
-  ng5_componentPath: '../editor-v2/editor.component'
-  path: './editor-v2/editor.module'
+  ng5_componentPath: '../editor/editor.component'
+  path: './editor/editor.module'
   link: 'streampipes.editor'
   url: '/editor/:pipeline'
   title: 'Editor'
-  description: 'editor-v2'
+  description: 'editor'
   icon: 'action:ic_dashboard_24px'
-  homeImage: '/assets/img/home/configuration.png'
+  homeImage: '/assets/img/home/editor.png'
   admin: false
 spConnect:
   ng5: True
diff --git a/ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.ts b/ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.ts
deleted file mode 100644
index 709d512..0000000
--- a/ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.ts
+++ /dev/null
@@ -1,245 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {Component, Input, OnInit,} from "@angular/core";
-import {JsplumbBridge} from "../../services/jsplumb-bridge.service";
-import {PipelinePositioningService} from "../../services/pipeline-positioning.service";
-import {PipelineValidationService} from "../../services/pipeline-validation.service";
-import {JsplumbService} from "../../services/jsplumb.service";
-import {ShepherdService} from "../../../services/tour/shepherd.service";
-import {PipelineElementConfig, PipelineElementUnion} from "../../model/editor.model";
-import {ObjectProvider} from "../../services/object-provider.service";
-import {PanelType} from "../../../core-ui/dialog/base-dialog/base-dialog.model";
-import {SavePipelineComponent} from "../../dialog/save-pipeline/save-pipeline.component";
-import {DialogService} from "../../../core-ui/dialog/base-dialog/base-dialog.service";
-import {ConfirmDialogComponent} from "../../../core-ui/dialog/confirm-dialog/confirm-dialog.component";
-import {MatDialog} from "@angular/material/dialog";
-import {EditorService} from "../../services/editor.service";
-import {PipelineService} from "../../../platform-services/apis/pipeline.service";
-
-
-@Component({
-    selector: 'pipeline-assembly',
-    templateUrl: './pipeline-assembly.component.html',
-    styleUrls: ['./pipeline-assembly.component.scss']
-})
-export class PipelineAssemblyComponent implements OnInit {
-
-    PipelineEditorService: any;
-    DialogBuilder: any;
-    currentMouseOverElement: any;
-    currentZoomLevel: any;
-    preview: any;
-
-    @Input()
-    rawPipelineModel: PipelineElementConfig[];
-    selectMode: any;
-    currentPipelineName: any;
-    currentPipelineDescription: any;
-
-    @Input()
-    currentModifiedPipelineId: any;
-
-    @Input()
-    allElements: PipelineElementUnion[];
-
-    errorMessagesDisplayed: any = false;
-
-    pipelineValid: boolean = false;
-
-    pipelineCacheRunning: boolean = false;
-    pipelineCached: boolean = false;
-
-
-    constructor(private JsplumbBridge: JsplumbBridge,
-                private PipelinePositioningService: PipelinePositioningService,
-                private ObjectProvider: ObjectProvider,
-                public EditorService: EditorService,
-                public PipelineValidationService: PipelineValidationService,
-                private PipelineService: PipelineService,
-                private JsplumbService: JsplumbService,
-                private ShepherdService: ShepherdService,
-                private dialogService: DialogService,
-                private dialog: MatDialog) {
-
-        this.selectMode = true;
-        this.currentZoomLevel = 1;
-
-    }
-
-    ngOnInit(): void {
-        if (this.currentModifiedPipelineId) {
-            this.displayPipelineById();
-        } else {
-            this.checkAndDisplayCachedPipeline();
-        }
-
-        // this.$rootScope.$on("pipeline.validate", () => {
-        //     this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
-        // });
-    }
-
-    ngAfterViewInit() {
-        ($("#assembly") as any).panzoom({
-            disablePan: true,
-            increment: 0.25,
-            minScale: 0.5,
-            maxScale: 1.5,
-            contain: 'invert'
-        });
-
-        $("#assembly").on('panzoomzoom', (e, panzoom, scale) => {
-            this.currentZoomLevel = scale;
-            this.JsplumbBridge.setZoom(scale);
-            this.JsplumbBridge.repaintEverything();
-        });
-    }
-
-    autoLayout() {
-        this.PipelinePositioningService.layoutGraph("#assembly", "span[id^='jsplumb']", 110, false);
-        this.JsplumbBridge.repaintEverything();
-    }
-
-    toggleSelectMode() {
-        if (this.selectMode) {
-            ($("#assembly") as any).panzoom("option", "disablePan", false);
-            this.selectMode = false;
-        }
-        else {
-            ($("#assembly") as any).panzoom("option", "disablePan", true);
-            this.selectMode = true;
-        }
-    }
-
-    zoomOut() {
-        this.doZoom(true);
-    }
-
-    zoomIn() {
-        this.doZoom(false);
-    }
-
-    doZoom(zoomOut) {
-        ($("#assembly") as any).panzoom("zoom", zoomOut);
-    }
-
-    showClearAssemblyConfirmDialog(event: any) {
-        let dialogRef = this.dialog.open(ConfirmDialogComponent, {
-            width: '500px',
-            data: {
-                "title": "Do you really want to delete the current pipeline?",
-                "subtitle": "This cannot be undone.",
-                "cancelTitle": "No",
-                "okTitle": "Yes",
-                "confirmAndCancel": true
-            },
-        });
-        dialogRef.afterClosed().subscribe(ev => {
-            if (ev) {
-                if (this.currentModifiedPipelineId) {
-                    this.currentModifiedPipelineId = undefined;
-                }
-                this.clearAssembly();
-                this.EditorService.makePipelineAssemblyEmpty(true);
-            }
-        });
-    };
-
-    /**
-     * clears the Assembly of all elements
-     */
-    clearAssembly() {
-        //$('#assembly').children().not('#clear, #submit').remove();
-        this.JsplumbBridge.deleteEveryEndpoint();
-        this.rawPipelineModel = [];
-        ($("#assembly") as any).panzoom("reset", {
-            disablePan: true,
-            increment: 0.25,
-            minScale: 0.5,
-            maxScale: 1.5,
-            contain: 'invert'
-        });
-        this.currentZoomLevel = 1;
-        this.JsplumbBridge.setZoom(this.currentZoomLevel);
-        this.JsplumbBridge.repaintEverything();
-        this.EditorService.removePipelineFromCache().subscribe(msg => {
-            this.pipelineCached = false;
-            this.pipelineCacheRunning = false;
-        });
-    };
-
-    /**
-     * Sends the pipeline to the server
-     */
-    submit() {
-        var pipeline = this.ObjectProvider.makeFinalPipeline(this.rawPipelineModel);
-
-        pipeline.name = this.currentPipelineName;
-        pipeline.description = this.currentPipelineDescription;
-        if (this.currentModifiedPipelineId) {
-            pipeline._id = this.currentModifiedPipelineId;
-        }
-
-        const dialogRef = this.dialogService.open(SavePipelineComponent,{
-            panelType: PanelType.SLIDE_IN_PANEL,
-            title: "Save pipeline",
-            data: {
-                "pipeline": pipeline,
-                "currentModifiedPipelineId": this.currentModifiedPipelineId
-            }
-        });
-    }
-
-    checkAndDisplayCachedPipeline() {
-        this.EditorService.getCachedPipeline().subscribe(msg => {
-            if (msg) {
-                this.rawPipelineModel = msg;
-                this.displayPipelineInEditor(true);
-            }
-        });
-    }
-
-    displayPipelineById() {
-        this.PipelineService.getPipelineById(this.currentModifiedPipelineId)
-            .subscribe((msg) => {
-                let pipeline = msg;
-                this.currentPipelineName = pipeline.name;
-                this.currentPipelineDescription = pipeline.description;
-                this.rawPipelineModel = this.JsplumbService.makeRawPipeline(pipeline, false);
-                console.log(this.rawPipelineModel);
-                this.displayPipelineInEditor(true);
-            });
-    };
-
-    displayPipelineInEditor(autoLayout) {
-        setTimeout(() => {
-            this.PipelinePositioningService.displayPipeline(this.rawPipelineModel, "#assembly", false, autoLayout);
-            this.EditorService.makePipelineAssemblyEmpty(false);
-            this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
-        });
-    }
-
-    toggleErrorMessagesDisplayed() {
-        this.errorMessagesDisplayed = !(this.errorMessagesDisplayed);
-    }
-
-    isPipelineAssemblyEmpty() {
-        return this.rawPipelineModel.length === 0 || this.rawPipelineModel.every(pe => pe.settings.disabled);
-    }
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.ts b/ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.ts
deleted file mode 100644
index 42271ce..0000000
--- a/ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {Component, Input, OnInit} from "@angular/core";
-import {PipelineElementService} from "../../../platform-services/apis/pipeline-element.service";
-
-@Component({
-  selector: 'pipeline-element-documentation',
-  templateUrl: './pipeline-element-documentation.component.html',
-  styleUrls: ['./pipeline-element-documentation.component.scss']
-})
-export class PipelineElementDocumentationComponent implements OnInit {
-
-  @Input()
-  appId: string;
-
-  @Input()
-  useStyling: boolean;
-
-  documentationMarkdown: any;
-  error: any;
-
-  constructor(private PipelineElementService: PipelineElementService) {
-
-  }
-
-  ngOnInit(): void {
-    this.PipelineElementService.getDocumentation(this.appId).subscribe(msg => {
-      this.error = false;
-      this.documentationMarkdown = msg;
-    }, error => {
-      this.error = true;
-    });
-  }
-
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts b/ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts
deleted file mode 100644
index 21dc89d..0000000
--- a/ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts
+++ /dev/null
@@ -1,171 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {Component, Input, OnInit,} from "@angular/core";
-import {RestApi} from "../../../services/rest-api.service";
-import {PipelineElementType, PipelineElementUnion} from "../../model/editor.model";
-import {PipelineElementTypeUtils} from "../../utils/editor.utils";
-import {EditorService} from "../../services/editor.service";
-import {zip} from "rxjs";
-
-
-@Component({
-    selector: 'pipeline-element-icon-stand',
-    templateUrl: './pipeline-element-icon-stand.component.html',
-    styleUrls: ['./pipeline-element-icon-stand.component.scss']
-})
-export class PipelineElementIconStandComponent implements OnInit {
-
-
-    _currentElements: PipelineElementUnion[];
-
-    currentlyFilteredElements: PipelineElementUnion[];
-
-    elementFilter: string = "";
-    allCategories: any = [];
-    currentCategories: any = [];
-    selectedOptions: any = [];
-
-    _activeType: PipelineElementType;
-    activeCssClass: string;
-
-    currentElementName: string;
-
-    constructor(private RestApi: RestApi,
-                private EditorService: EditorService) {
-
-    }
-
-    ngOnInit(): void {
-        this.loadOptions();
-    }
-
-    ngAfterViewInit() {
-        this.makeDraggable();
-    }
-
-    openHelpDialog(pipelineElement) {
-        this.EditorService.openHelpDialog(pipelineElement);
-    }
-
-    updateMouseOver(elementAppId: string) {
-        this.currentElementName = elementAppId;
-    }
-
-    loadOptions() {
-        zip(this.EditorService.getEpCategories(),
-            this.EditorService.getEpaCategories(),
-            this.EditorService.getEcCategories()).subscribe((results) => {
-                this.allCategories[PipelineElementType.DataStream] = results[0];
-                this.allCategories[PipelineElementType.DataSet] = results[0];
-                this.allCategories[PipelineElementType.DataProcessor] = results[1];
-                this.allCategories[PipelineElementType.DataSink] = results[2];
-                this.currentCategories = this.allCategories[0];
-                this.selectedOptions = [...this.currentCategories];
-            });
-    };
-
-    applyFilter() {
-        this.currentlyFilteredElements = this.currentElements.filter(el => {
-            return this.matchesText(el) && this.matchesCategory(el);
-        })
-        this.makeDraggable();
-    }
-
-    matchesText(el: PipelineElementUnion): boolean {
-        return this.elementFilter === "" || el.name.includes(this.elementFilter);
-    }
-
-    matchesCategory(el: PipelineElementUnion): boolean {
-        return this._activeType === PipelineElementType.DataStream ||
-            this._activeType === PipelineElementType.DataSet ?
-            this.selectedOptions.some(c => el.category.some(cg => c.type === cg)) :
-            this.selectedOptions.some(c => el.category.some(cg => c.code === cg));
-    }
-
-    toggleOption(option) {
-        if (this.optionSelected(option)) {
-            this.selectedOptions.splice(option, 1);
-        } else {
-            this.selectedOptions.push(option);
-        }
-        this.applyFilter();
-    }
-
-    optionSelected(option) {
-        return this._activeType === PipelineElementType.DataStream ||
-        this._activeType === PipelineElementType.DataSet ?
-            this.selectedOptions.map(o => o.type).indexOf(option.type) > -1 :
-            this.selectedOptions.map(o => o.code).indexOf(option.code) > -1;
-    }
-
-    selectAllOptions() {
-        this.selectedOptions = [...this.currentCategories];
-        this.applyFilter();
-    }
-
-    deselectAllOptions() {
-        this.selectedOptions = [];
-        this.applyFilter();
-    }
-
-    @Input()
-    set activeType(value: PipelineElementType) {
-        this._activeType = value;
-        if (this.allCategories.length > 0) {
-            this.currentCategories = this.allCategories[this._activeType];
-            this.selectedOptions = [...this.currentCategories];
-        }
-        this.activeCssClass = this.makeActiveCssClass(value);
-        setTimeout(() => {
-            this.makeDraggable();
-        })
-    };
-
-    @Input()
-    set currentElements(value: PipelineElementUnion[]) {
-        this._currentElements = value;
-        this.currentlyFilteredElements = this._currentElements;
-    }
-
-    get currentElements() {
-        return this._currentElements;
-    }
-
-    makeActiveCssClass(elementType: PipelineElementType): string {
-        return PipelineElementTypeUtils.toCssShortHand(elementType);
-    }
-
-    makeDraggable() {
-       setTimeout(() => {
-           (<any>$('.draggable-icon')).draggable({
-               revert: 'invalid',
-               helper: 'clone',
-               stack: '.draggable-icon',
-               start: function (el, ui) {
-                   ui.helper.appendTo('#content');
-                   $('#outerAssemblyArea').css('border', '3px dashed #39b54a');
-               },
-               stop: function (el, ui) {
-                   $('#outerAssemblyArea').css('border', '3px solid rgb(156, 156, 156)');
-               }
-           });
-       });
-    };
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.ts b/ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.ts
deleted file mode 100644
index ef118e9..0000000
--- a/ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.ts
+++ /dev/null
@@ -1,191 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-import {JsplumbBridge} from "../../services/jsplumb-bridge.service";
-import {JsplumbService} from "../../services/jsplumb.service";
-import {PipelineValidationService} from "../../services/pipeline-validation.service";
-import {RestApi} from "../../../services/rest-api.service";
-import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core";
-import {PipelineElementRecommendationService} from "../../services/pipeline-element-recommendation.service";
-import {ObjectProvider} from "../../services/object-provider.service";
-import {
-  InvocablePipelineElementUnion,
-  PipelineElementConfig,
-  PipelineElementUnion
-} from "../../model/editor.model";
-import {SpDataStream, WildcardTopicDefinition} from "../../../core-model/gen/streampipes-model";
-import {EditorService} from "../../services/editor.service";
-import {PanelType} from "../../../core-ui/dialog/base-dialog/base-dialog.model";
-import {DialogService} from "../../../core-ui/dialog/base-dialog/base-dialog.service";
-import {CompatibleElementsComponent} from "../../dialog/compatible-elements/compatible-elements.component";
-import {Tuple2} from "../../../core-model/base/Tuple2";
-
-@Component({
-  selector: 'pipeline-element-options',
-  templateUrl: './pipeline-element-options.component.html',
-  styleUrls: ['./pipeline-element-options.component.css']
-})
-export class PipelineElementOptionsComponent implements OnInit{
-
-  recommendationsAvailable: any;
-  possibleElements: PipelineElementUnion[];
-  recommendedElements: PipelineElementUnion[];
-  recommendationsShown: any;
-  pipelineElementCssType: string;
-
-  @Input()
-  currentMouseOverElement: string;
-
-  @Input()
-  pipelineElementId: string;
-
-  @Input()
-  pipelineValid: boolean;
-
-  @Input()
-  internalId: string;
-
-  @Input()
-  pipelineElement: PipelineElementConfig;
-
-  @Input()
-  rawPipelineModel: PipelineElementConfig[];
-
-  @Input()
-  allElements: PipelineElementUnion[];
-
-  @Output()
-  delete: EventEmitter<PipelineElementConfig> = new EventEmitter<PipelineElementConfig>();
-
-  @Output()
-  customize: EventEmitter<Tuple2<Boolean, PipelineElementConfig>> = new EventEmitter<Tuple2<Boolean, PipelineElementConfig>>();
-
-  constructor(private ObjectProvider: ObjectProvider,
-              private PipelineElementRecommendationService: PipelineElementRecommendationService,
-              private DialogService: DialogService,
-              private EditorService: EditorService,
-              //private InitTooltips: InitTooltips,
-              private JsplumbBridge: JsplumbBridge,
-              private JsplumbService: JsplumbService,
-              //private TransitionService: TransitionService,
-              private PipelineValidationService: PipelineValidationService,
-              private RestApi: RestApi) {
-    this.recommendationsAvailable = false;
-    this.possibleElements = [];
-    this.recommendedElements = [];
-    this.recommendationsShown = false;
-
-  }
-
-  ngOnInit() {
-    this.EditorService.pipelineElementConfigured$.subscribe(pipelineElementDomId => {
-      this.pipelineElement.settings.openCustomize = false;
-      this.RestApi.updateCachedPipeline(this.rawPipelineModel);
-      if (pipelineElementDomId === this.pipelineElement.payload.dom) {
-        this.initRecs(this.pipelineElement.payload.dom);
-      }
-    });
-    this.pipelineElementCssType = this.pipelineElement.type;
-
-    if (this.pipelineElement.type === 'stream') {
-      this.initRecs(this.pipelineElement.payload.dom);
-    }
-  }
-
-  removeElement(pipelineElement: PipelineElementConfig) {
-    this.delete.emit(pipelineElement);
-    //this.$rootScope.$broadcast("pipeline.validate");
-  }
-
-  customizeElement(pipelineElement: PipelineElementConfig) {
-    let restrictedEditMode = ! (this.isRootElement());
-    let customizeInfo = {a: restrictedEditMode, b: pipelineElement} as Tuple2<Boolean, PipelineElementConfig>;
-    this.customize.emit(customizeInfo);
-  }
-
-  openCustomizeDialog() {
-    let restrictedEditMode = ! (this.isRootElement());
-    // this.EditorDialogManager.showCustomizeDialog($("#" + this.pipelineElement.payload.dom), "", this.pipelineElement.payload, restrictedEditMode)
-    //     .then(() => {
-    //       this.JsplumbService.activateEndpoint(this.pipelineElement.payload.dom, !this.pipelineElement.payload.uncompleted);
-    //     }, () => {
-    //       this.JsplumbService.activateEndpoint(this.pipelineElement.payload.dom, !this.pipelineElement.payload.uncompleted);
-    //     });
-  }
-
-  openHelpDialog() {
-    this.EditorService.openHelpDialog(this.pipelineElement.payload);
-  }
-
-  openCustomizeStreamDialog() {
-    //this.EditorDialogManager.showCustomizeStreamDialog(this.pipelineElement.payload);
-  }
-
-  initRecs(elementId) {
-    var currentPipeline = this.ObjectProvider.makePipeline(angular.copy(this.rawPipelineModel));
-    this.EditorService.recommendPipelineElement(currentPipeline).subscribe((result) => {
-      if (result.success) {
-        this.possibleElements = this.PipelineElementRecommendationService.collectPossibleElements(this.allElements, result.possibleElements);
-        this.recommendedElements = this.PipelineElementRecommendationService.populateRecommendedList(this.allElements, result.recommendedElements);
-        this.recommendationsAvailable = true;
-        //this.InitTooltips.initTooltips();
-      }
-    });
-  }
-
-  openPossibleElementsDialog() {
-    const dialogRef = this.DialogService.open(CompatibleElementsComponent,{
-      panelType: PanelType.SLIDE_IN_PANEL,
-      title: "Compatible Elements",
-      data: {
-        "rawPipelineModel": this.rawPipelineModel,
-        "possibleElements": this.possibleElements,
-        "pipelineElementDomId": this.pipelineElement.payload.dom
-      }
-    });
-
-    dialogRef.afterClosed().subscribe(c => {
-
-    });
-  }
-
-  showRecommendations(e) {
-    this.recommendationsShown = !this.recommendationsShown;
-    e.stopPropagation();
-  }
-
-  isRootElement() {
-    return this.JsplumbBridge.getConnections({source: this.pipelineElement.payload.dom}).length === 0;
-  }
-
-  isConfigured() {
-    if (this.pipelineElement.type == 'stream') return true;
-    else {
-      return (this.pipelineElement.payload as InvocablePipelineElementUnion).configured;
-    }
-  }
-
-  isWildcardTopic() {
-    return (this.pipelineElement
-        .payload as SpDataStream)
-        .eventGrounding
-        .transportProtocols[0]
-        .topicDefinition instanceof WildcardTopicDefinition;
-  }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts b/ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts
deleted file mode 100644
index 17ba75e..0000000
--- a/ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts
+++ /dev/null
@@ -1,144 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {JsplumbService} from "../../services/jsplumb.service";
-import {Component, Input, OnInit} from "@angular/core";
-import {PipelineElementConfig} from "../../model/editor.model";
-import {DataProcessorInvocation} from "../../../core-model/gen/streampipes-model";
-import {SafeCss} from "../../utils/style-sanitizer";
-
-@Component({
-  selector: 'pipeline-element-recommendation',
-  templateUrl: './pipeline-element-recommendation.component.html',
-  styleUrls: ['./pipeline-element-recommendation.component.scss']
-})
-export class PipelineElementRecommendationComponent implements OnInit {
-
-  @Input()
-  recommendationsShown: boolean;
-
-  @Input()
-  rawPipelineModel: PipelineElementConfig[];
-
-  @Input()
-  pipelineElementDomId: string;
-
-  @Input()
-  recommendedElements: any;
-
-  recommendationsPrepared: boolean = false;
-
-  constructor(private JsplumbService: JsplumbService,
-              public safeCss: SafeCss) {
-
-  }
-
-  ngOnInit() {
-    this.prepareStyles();
-  }
-
-  prepareStyles() {
-    this.recommendedElements.forEach((element, index) => {
-      this.setLayoutSettings(element, index);
-    });
-    this.recommendationsPrepared = true;
-  }
-
-  setLayoutSettings(element, index) {
-    element.layoutSettings = {
-      skewStyle: element.name ? this.getSkewStyle(index) : {'opacity': 0},
-      unskewStyle: this.getUnskewStyle(element, index),
-      unskewStyleLabel: this.getUnskewStyleLabel(index),
-      type: element instanceof DataProcessorInvocation ? "sepa" : "action"
-    };
-  }
-
-  create(recommendedElement) {
-    this.recommendationsShown = false;
-    this.JsplumbService.createElement(this.rawPipelineModel, recommendedElement, this.pipelineElementDomId);
-  }
-
-  getUnskewStyle(recommendedElement, index) {
-    var unskew = -(this.getSkew());
-    var rotate = -(90 - (this.getSkew() / 2));
-
-    return "transform: skew(" + unskew + "deg)" + " rotate(" + rotate + "deg)" + " scale(1);"
-       +"background-color: " +this.getBackgroundColor(recommendedElement, index);
-  }
-
-  getBackgroundColor(recommendedElement, index) {
-    var alpha = recommendedElement.weight < 0.2 ? 0.2 : (recommendedElement.weight - 0.2);
-    var rgb = recommendedElement instanceof DataProcessorInvocation ? this.getSepaColor(index) : this.getActionColor(index);
-
-    return "rgba(" +rgb +"," +alpha +")";
-  }
-
-  getSepaColor(index) {
-    return (index % 2 === 0) ? "0, 150, 136" : "0, 164, 150";
-  }
-
-  getActionColor(index) {
-    return (index % 2 === 0) ? "63, 81, 181" : "79, 101, 230";
-  }
-
-  getSkewStyle(index) {
-    this.fillRemainingItems();
-    // transform: rotate(72deg) skew(18deg);
-    var skew = this.getSkew();
-    var rotate = (index + 1) * this.getAngle();
-
-    return "transform: rotate(" + rotate + "deg) skew(" + skew + "deg);";
-  }
-
-  getUnskewStyleLabel(index) {
-    var unskew = -(this.getSkew());
-    var rotate =  (index + 1) * this.getAngle();
-    var unrotate = -360 + (rotate*-1);
-
-    return "transform: skew(" + unskew + "deg)" + " rotate(" + unrotate + "deg)" + " scale(1);"
-      +"z-index: -1;"
-      +"margin-left: 50%;"
-      +"margin-top: 50%;"
-      +"position: absolute;"
-      +"background: white;"
-      +"height: 50px;"
-      +"width: 50px;"
-      +"font-size: 16px;"
-      +"text-align: center;"
-      +"line-height: 50px;"
-      +"top: 0px;";
-  }
-
-  getSkew() {
-    return (90 - this.getAngle());
-  }
-
-  getAngle() {
-    return (360 / this.recommendedElements.length);
-  }
-
-  fillRemainingItems() {
-    if (this.recommendedElements.length < 6) {
-      for (var i = this.recommendedElements.length; i < 6; i++) {
-        let element = {fakeElement: true};
-        this.setLayoutSettings(element, i);
-        this.recommendedElements.push(element);
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.ts b/ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.ts
deleted file mode 100644
index f065d86..0000000
--- a/ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.ts
+++ /dev/null
@@ -1,93 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {Component, Input, OnInit,} from "@angular/core";
-import {RestApi} from "../../../services/rest-api.service";
-import {ElementIconText} from "../../../services/get-element-icon-text.service";
-import {ImageChecker} from "../../../services/image-checker.service";
-import {PipelineElementUnion} from "../../model/editor.model";
-
-
-@Component({
-    selector: 'pipeline-element',
-    templateUrl: './pipeline-element.component.html',
-    styleUrls: ['./pipeline-element.component.css']
-})
-export class PipelineElementComponent implements OnInit {
-
-    showImage: any;
-    iconText: any;
-
-    @Input()
-    pipelineElement: PipelineElementUnion;
-
-    @Input()
-    preview: any;
-
-    @Input()
-    iconSize: any;
-
-    @Input()
-    iconStandSize: any;
-
-    iconUrl: any;
-
-    constructor(private ImageChecker: ImageChecker,
-                private RestApi: RestApi,
-                private ElementIconText: ElementIconText) {
-
-    }
-
-    ngOnInit(): void {
-        this.iconText =  this.ElementIconText.getElementIconText(this.pipelineElement.name);
-        this.checkImageAvailable();
-    }
-
-    checkImageAvailable() {
-        if (this.pipelineElement.includesAssets) {
-            this.fetchImage(this.makeAssetIconUrl())
-        } else {
-            this.fetchImage(this.pipelineElement.iconUrl);
-        }
-    }
-
-    fetchImage(imageUrl) {
-        this.ImageChecker.imageExists(imageUrl, (exists) => {
-            this.iconUrl = imageUrl;
-            this.showImage = exists;
-        })
-    }
-
-    makeAssetIconUrl() {
-        return this.RestApi.getAssetUrl(this.pipelineElement.appId) +"/icon";
-    }
-
-    iconSizeCss() {
-        if (this.iconSize) {
-            return 'width:35px;height:35px;';
-        }
-        else if (this.preview) {
-            return 'width:50px;height:50px;';
-        } else if (this.iconStandSize) {
-            return 'width:50px;height:50px;margin-top:-5px;'
-        } else {
-            return 'width:70px;height:70px;';
-        }
-    }
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts b/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts
deleted file mode 100644
index c963452..0000000
--- a/ui/src/app/editor-v2/components/pipeline/pipeline.component.ts
+++ /dev/null
@@ -1,397 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from "angular";
-
-import {PipelineValidationService} from "../../../editor-v2/services/pipeline-validation.service";
-import {JsplumbService} from "../../services/jsplumb.service";
-import {PipelineEditorService} from "../../services/pipeline-editor.service";
-import {JsplumbBridge} from "../../services/jsplumb-bridge.service";
-import {ShepherdService} from "../../../services/tour/shepherd.service";
-import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core";
-import {
-  InvocablePipelineElementUnion,
-  PipelineElementConfig,
-  PipelineElementUnion
-} from "../../model/editor.model";
-import {
-  CustomOutputStrategy,
-  DataProcessorInvocation,
-  Pipeline,
-  SpDataStream
-} from "../../../core-model/gen/streampipes-model";
-import {ObjectProvider} from "../../services/object-provider.service";
-import {CustomizeComponent} from "../../dialog/customize/customize.component";
-import {PanelType} from "../../../core-ui/dialog/base-dialog/base-dialog.model";
-import {DialogService} from "../../../core-ui/dialog/base-dialog/base-dialog.service";
-import {EditorService} from "../../services/editor.service";
-import {MatchingResultMessage} from "../../../core-model/gen/streampipes-model-client";
-import {MatchingErrorComponent} from "../../dialog/matching-error/matching-error.component";
-import {Tuple2} from "../../../core-model/base/Tuple2";
-import {ConfirmDialogComponent} from "../../../core-ui/dialog/confirm-dialog/confirm-dialog.component";
-import {MatDialog} from "@angular/material/dialog";
-
-@Component({
-  selector: 'pipeline',
-  templateUrl: './pipeline.component.html',
-  styleUrls: ['./pipeline.component.css']
-})
-export class PipelineComponent implements OnInit {
-
-  @Input()
-  pipelineValid: boolean;
-
-  @Input()
-  canvasId: string;
-
-  @Input()
-  rawPipelineModel: PipelineElementConfig[];
-
-  @Input()
-  allElements: PipelineElementUnion[];
-
-  @Input()
-  preview: boolean;
-
-  @Input()
-  pipelineCached: boolean;
-
-  @Output()
-  pipelineCachedChanged: EventEmitter<boolean> = new EventEmitter<boolean>();
-
-  @Input()
-  pipelineCacheRunning: boolean;
-
-  @Output()
-  pipelineCacheRunningChanged: EventEmitter<boolean> = new EventEmitter<boolean>();
-
-  availablePipelineElementCache: PipelineElementUnion[];
-
-  plumbReady: any;
-  currentMouseOverElement: string;
-  currentPipelineModel: Pipeline;
-  idCounter: any;
-  currentZoomLevel: any;
-  TransitionService: any;
-
-  // remove later
-
-  constructor(private JsplumbService: JsplumbService,
-              private PipelineEditorService: PipelineEditorService,
-              private JsplumbBridge: JsplumbBridge,
-              private ObjectProvider: ObjectProvider,
-              private EditorService: EditorService,
-              private ShepherdService: ShepherdService,
-              private PipelineValidationService: PipelineValidationService,
-              private dialogService: DialogService,
-              private dialog: MatDialog) {
-    this.plumbReady = false;
-    this.currentMouseOverElement = "";
-    this.currentPipelineModel = new Pipeline();
-    this.idCounter = 0;
-
-    this.currentZoomLevel = 1;
-  }
-
-  ngOnInit() {
-    this.JsplumbBridge.setContainer(this.canvasId);
-    this.initAssembly();
-    this.initPlumb();
-  }
-
-  validatePipeline() {
-      this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
-  }
-
-  ngOnDestroy() {
-    this.JsplumbBridge.deleteEveryEndpoint();
-    this.plumbReady = false;
-  }
-
-  updateMouseover(elementId) {
-    this.currentMouseOverElement = elementId;
-  }
-
-  updateOptionsClick(elementId) {
-    if (this.currentMouseOverElement == elementId) {
-      this.currentMouseOverElement = "";
-    } else {
-      this.currentMouseOverElement = elementId;
-    }
-  }
-
-  getElementCss(currentPipelineElementSettings) {
-    return "position:absolute;"
-        + (this.preview ? "width:75px;" : "width:110px;")
-        + (this.preview ? "height:75px;" : "height:110px;")
-        + "left: " + currentPipelineElementSettings.position.x + "px; "
-        + "top: " + currentPipelineElementSettings.position.y + "px; "
-  }
-
-  getElementCssClasses(currentPipelineElement) {
-    return currentPipelineElement.type + " " + (currentPipelineElement.settings.openCustomize ? "" : "")
-        + currentPipelineElement.settings.connectable + " "
-        + currentPipelineElement.settings.displaySettings;
-  }
-
-  isStreamInPipeline() {
-    return this.isInPipeline('stream');
-  }
-
-  isSetInPipeline() {
-    return this.isInPipeline('set');
-  }
-
-  isInPipeline(type) {
-    return this.rawPipelineModel.some(x => (x.type == type && !(x.settings.disabled)));
-  }
-
-  showMixedStreamAlert() {
-    this.dialog.open(ConfirmDialogComponent, {
-      width: '500px',
-      data: {
-        "title": "Currently, it is not possible to mix data streams and data sets in a single pipeline.",
-        "confirmAndCancel": false,
-        "okTitle": "Ok",
-      },
-    });
-  }
-
-  findPipelineElementByElementId(elementId: string) {
-    return this.allElements.find(a => a.elementId === elementId);
-  }
-
-
-  initAssembly() {
-    ($('#assembly') as any).droppable({
-      tolerance: "fit",
-      drop: (element, ui) => {
-        let pipelineElementId = ui.draggable.data("pe");
-        let pipelineElement: PipelineElementUnion = this.findPipelineElementByElementId(pipelineElementId);
-        if (ui.draggable.hasClass('draggable-icon')) {
-          this.EditorService.makePipelineAssemblyEmpty(false);
-          var pipelineElementConfig = this.JsplumbService.createNewPipelineElementConfig(pipelineElement, this.PipelineEditorService.getCoordinates(ui, this.currentZoomLevel), false, false);
-          if ((this.isStreamInPipeline() && pipelineElementConfig.type == 'set') ||
-              this.isSetInPipeline() && pipelineElementConfig.type == 'stream') {
-            this.showMixedStreamAlert();
-          } else {
-            this.rawPipelineModel.push(pipelineElementConfig);
-            if (ui.draggable.hasClass('set')) {
-              setTimeout(() => {
-                this.JsplumbService.setDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
-              }, 10);
-            }
-            else if (ui.draggable.hasClass('stream')) {
-              this.checkTopicModel(pipelineElementConfig);
-            } else if (ui.draggable.hasClass('sepa')) {
-                setTimeout(() => {
-                  this.JsplumbService.sepaDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
-                }, 10);
-            } else if (ui.draggable.hasClass('action')) {
-                setTimeout(() => {
-                  this.JsplumbService.actionDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
-                }, 10);
-            }
-            if (this.ShepherdService.isTourActive()) {
-              this.ShepherdService.trigger("drop-" +pipelineElementConfig.type);
-            }
-          }
-        }
-        this.JsplumbBridge.repaintEverything();
-        this.validatePipeline();
-        this.triggerPipelineCacheUpdate();
-      }
-
-    }); //End #assembly.droppable()
-  }
-
-  checkTopicModel(pipelineElementConfig: PipelineElementConfig) {
-      setTimeout(() => {
-        this.JsplumbService.streamDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
-      }, 10);
-
-    var streamDescription = pipelineElementConfig.payload as SpDataStream;
-    if (streamDescription
-        .eventGrounding
-        .transportProtocols[0]
-        .topicDefinition["@class"] === "org.apache.streampipes.model.grounding.WildcardTopicDefinition") {
-      //this.EditorDialogManager.showCustomizeStreamDialog(streamDescription);
-    }
-  }
-
-  handleDeleteOption(pipelineElement: PipelineElementConfig) {
-    this.JsplumbBridge.removeAllEndpoints(pipelineElement.payload.dom);
-    angular.forEach(this.rawPipelineModel, pe => {
-      if (pe.payload.dom == pipelineElement.payload.dom) {
-        pe.settings.disabled = true;
-      }
-    });
-    if (this.rawPipelineModel.every(pe => pe.settings.disabled)) {
-      this.EditorService.makePipelineAssemblyEmpty(true);
-    }
-    this.JsplumbBridge.repaintEverything();
-    this.triggerPipelineCacheUpdate();
-  }
-
-  initPlumb() {
-
-    this.JsplumbService.prepareJsplumb();
-
-    this.JsplumbBridge.unbind("connection");
-
-    this.JsplumbBridge.bind("connectionMoved", (info, originalEvent) => {
-      var pe = this.ObjectProvider.findElement(info.newTargetEndpoint.elementId, this.rawPipelineModel);
-      var oldPe = this.ObjectProvider.findElement(info.originalTargetEndpoint.elementId, this.rawPipelineModel);
-      (oldPe.payload as InvocablePipelineElementUnion).configured = false;
-      (pe.payload as InvocablePipelineElementUnion).configured = false;
-    });
-
-    this.JsplumbBridge.bind("connectionDetached", (info, originalEvent) => {
-      var pe = this.ObjectProvider.findElement(info.targetEndpoint.elementId, this.rawPipelineModel);
-      (pe.payload as InvocablePipelineElementUnion).configured = false;
-      pe.settings.openCustomize = true;
-      info.targetEndpoint.setType("empty");
-      this.validatePipeline();
-    });
-
-    this.JsplumbBridge.bind("connectionDrag", connection => {
-      this.JsplumbBridge.selectEndpoints().each(function (endpoint) {
-        if (endpoint.isTarget && endpoint.connections.length === 0) {
-          endpoint.setType("highlight");
-        }
-      });
-
-    });
-    this.JsplumbBridge.bind("connectionAborted", connection => {
-      this.JsplumbBridge.selectEndpoints().each(endpoint => {
-        if (endpoint.isTarget && endpoint.connections.length === 0) {
-          endpoint.setType("empty");
-        }
-      });
-    })
-
-    this.JsplumbBridge.bind("connection", (info, originalEvent) => {
-      var pe = this.ObjectProvider.findElement(info.target.id, this.rawPipelineModel);
-      if (pe.settings.openCustomize) {
-        this.currentPipelineModel = this.ObjectProvider.makePipeline(this.rawPipelineModel);
-        pe.settings.loadingStatus = true;
-        this.ObjectProvider.updatePipeline(this.currentPipelineModel)
-            .subscribe(pipelineModificationMessage => {
-              pe.settings.loadingStatus = false;
-              info.targetEndpoint.setType("token");
-              this.validatePipeline();
-              this.modifyPipeline(pipelineModificationMessage.pipelineModifications);
-              var sourceEndpoint = this.JsplumbBridge.selectEndpoints({element: info.targetEndpoint.elementId});
-              if (this.PipelineEditorService.isFullyConnected(pe)) {
-                let payload = pe.payload as InvocablePipelineElementUnion;
-                if ((payload.staticProperties && payload.staticProperties.length > 0) || this.isCustomOutput(pe)) {
-                  this.showCustomizeDialog({a: false, b: pe});
-                } else {
-                  this.announceConfiguredElement(pe);
-                  //this.$rootScope.$broadcast("SepaElementConfigured", pe.payload.DOM);
-                  (pe.payload as InvocablePipelineElementUnion).configured = true;
-                }
-              }
-            }, status => {
-              pe.settings.loadingStatus = false;
-              this.JsplumbBridge.detach(info.connection);
-              let matchingResultMessage = (status.error as any[]).map(e => MatchingResultMessage.fromData(e as MatchingResultMessage));
-              this.showMatchingErrorDialog(matchingResultMessage);
-            });
-      }
-    });
-
-    window.onresize = (event) => {
-      this.JsplumbBridge.repaintEverything();
-    };
-
-    setTimeout(() => {
-      this.plumbReady = true;
-    }, 100);
-  }
-
-  modifyPipeline(pipelineModifications) {
-    for (var i = 0, modification; modification = pipelineModifications[i]; i++) {
-      var id = modification.domId;
-      if (id !== "undefined") {
-        var pe = this.ObjectProvider.findElement(id, this.rawPipelineModel);
-        (pe.payload as InvocablePipelineElementUnion).staticProperties = modification.staticProperties;
-        (pe.payload as DataProcessorInvocation).outputStrategies = modification.outputStrategies;
-        (pe.payload as InvocablePipelineElementUnion).inputStreams = modification.inputStreams;
-      }
-    }
-  }
-
-  isCustomOutput(pe) {
-    var custom = false;
-    angular.forEach(pe.payload.outputStrategies, strategy => {
-      if (strategy instanceof CustomOutputStrategy) {
-        custom = true;
-      }
-    });
-    return custom;
-  }
-
-  triggerPipelineCacheUpdate() {
-    this.pipelineCacheRunning = true;
-    this.pipelineCacheRunningChanged.emit(this.pipelineCacheRunning);
-    this.EditorService.updateCachedPipeline(this.rawPipelineModel).subscribe(msg => {
-      this.pipelineCacheRunning = false;
-      this.pipelineCacheRunningChanged.emit(this.pipelineCacheRunning)
-      this.pipelineCached = true;
-      this.pipelineCachedChanged.emit(this.pipelineCached);
-    });
-  }
-
-  showMatchingErrorDialog(matchingResultMessage: MatchingResultMessage[]) {
-    this.dialogService.open(MatchingErrorComponent, {
-      panelType: PanelType.STANDARD_PANEL,
-      title: "Invalid Connection",
-      data: {
-        "matchingResultMessage": matchingResultMessage
-      }
-    });
-  }
-
-  showCustomizeDialog(pipelineElementInfo: Tuple2<Boolean, PipelineElementConfig>) {
-    const dialogRef = this.dialogService.open(CustomizeComponent,{
-      panelType: PanelType.SLIDE_IN_PANEL,
-      title: "Customize " + pipelineElementInfo.b.payload.name,
-      width: "50vw",
-      data: {
-        "pipelineElement": pipelineElementInfo.b,
-        "restrictedEditMode": pipelineElementInfo.a
-      }
-    });
-
-    dialogRef.afterClosed().subscribe(c => {
-      if (c) {
-        pipelineElementInfo.b.settings.openCustomize = false;
-        this.JsplumbService.activateEndpoint(pipelineElementInfo.b.payload.dom, pipelineElementInfo.b.settings.completed);
-        this.JsplumbBridge.getSourceEndpoint(pipelineElementInfo.b.payload.dom).setType("token");
-        this.triggerPipelineCacheUpdate();
-      }
-    });
-  }
-
-  announceConfiguredElement(pe: PipelineElementConfig) {
-    this.EditorService.announceConfiguredElement(pe.payload.dom);
-  }
-
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/editor.module.ts b/ui/src/app/editor-v2/editor.module.ts
deleted file mode 100644
index a005f27..0000000
--- a/ui/src/app/editor-v2/editor.module.ts
+++ /dev/null
@@ -1,148 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {FlexLayoutModule} from '@angular/flex-layout';
-import {GridsterModule} from 'angular-gridster2';
-import {MatTabsModule} from "@angular/material/tabs";
-import {CustomMaterialModule} from "../CustomMaterial/custom-material.module";
-import {FormsModule, ReactiveFormsModule} from "@angular/forms";
-import {ElementIconText} from "../services/get-element-icon-text.service";
-import {SemanticTypeUtilsService} from '../core-services/semantic-type/semantic-type-utils.service';
-import {EditorComponent} from "./editor.component";
-import {ConnectModule} from "../connect/connect.module";
-import {EditorService} from "./services/editor.service";
-import {PipelineElementIconStandComponent} from "./components/pipeline-element-icon-stand/pipeline-element-icon-stand.component";
-import {PipelineAssemblyComponent} from "./components/pipeline-assembly/pipeline-assembly.component";
-import {ImageChecker} from "../services/image-checker.service";
-import {PipelineElementComponent} from "./components/pipeline-element/pipeline-element.component";
-import {JsplumbBridge} from "./services/jsplumb-bridge.service";
-import {PipelinePositioningService} from "./services/pipeline-positioning.service";
-import {JsplumbService} from "./services/jsplumb.service";
-import {JsplumbConfigService} from "./services/jsplumb-config.service";
-import {PipelineEditorService} from "./services/pipeline-editor.service";
-import {PipelineValidationService} from "./services/pipeline-validation.service";
-import {PipelineComponent} from "./components/pipeline/pipeline.component";
-import {ObjectProvider} from "./services/object-provider.service";
-import {PipelineElementOptionsComponent} from "./components/pipeline-element-options/pipeline-element-options.component";
-import {PipelineElementRecommendationService} from "./services/pipeline-element-recommendation.service";
-import {CustomizeComponent} from "./dialog/customize/customize.component";
-import {MatProgressSpinnerModule} from "@angular/material/progress-spinner";
-import {CoreUiModule} from "../core-ui/core-ui.module";
-import {SavePipelineComponent} from "./dialog/save-pipeline/save-pipeline.component";
-import {PipelineElementRecommendationComponent} from "./components/pipeline-element-recommendation/pipeline-element-recommendation.component";
-import {CompatibleElementsComponent} from "./dialog/compatible-elements/compatible-elements.component";
-import {MatListModule} from "@angular/material/list";
-import {HelpComponent} from "./dialog/help/help.component";
-import {PipelineElementDocumentationComponent} from "./components/pipeline-element-documentation/pipeline-element-documentation.component";
-import {ShowdownModule} from 'ngx-showdown';
-import {SafeCss} from "./utils/style-sanitizer";
-import {MatchingErrorComponent} from "./dialog/matching-error/matching-error.component";
-import {WelcomeTourComponent} from "./dialog/welcome-tour/welcome-tour.component";
-import {MissingElementsForTutorialComponent} from "./dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component";
-import {OutputStrategyComponent} from "./components/output-strategy/output-strategy.component";
-import {CustomOutputStrategyComponent} from "./components/output-strategy/custom-output/custom-output-strategy.component";
-import {PropertySelectionComponent} from "./components/output-strategy/property-selection/property-selection.component";
-import {UserDefinedOutputComponent} from "../editor/components/userdefinedoutput/user-defined-output.component";
-import {UserDefinedOutputStrategyComponent} from "./components/output-strategy/user-defined-output/user-defined-output.component";
-
-@NgModule({
-    imports: [
-        CoreUiModule,
-        CommonModule,
-        MatTabsModule,
-        MatListModule,
-        FlexLayoutModule,
-        GridsterModule,
-        CommonModule,
-        FlexLayoutModule,
-        CustomMaterialModule,
-        FormsModule,
-        ConnectModule,
-        MatProgressSpinnerModule,
-        ShowdownModule,
-        ReactiveFormsModule
-    ],
-    declarations: [
-        CompatibleElementsComponent,
-        CustomizeComponent,
-        CustomOutputStrategyComponent,
-        EditorComponent,
-        HelpComponent,
-        MatchingErrorComponent,
-        MissingElementsForTutorialComponent,
-        OutputStrategyComponent,
-        UserDefinedOutputStrategyComponent,
-        PipelineAssemblyComponent,
-        PipelineElementComponent,
-        PipelineElementDocumentationComponent,
-        PipelineElementIconStandComponent,
-        PipelineElementOptionsComponent,
-        PipelineElementRecommendationComponent,
-        PipelineComponent,
-        PropertySelectionComponent,
-        SavePipelineComponent,
-        SafeCss,
-        WelcomeTourComponent
-    ],
-    providers: [
-        EditorService,
-        SemanticTypeUtilsService,
-        {
-            provide: 'RestApi',
-            useFactory: ($injector: any) => $injector.get('RestApi'),
-            deps: ['$injector'],
-        },
-        JsplumbBridge,
-        JsplumbService,
-        JsplumbConfigService,
-        ObjectProvider,
-        PipelineEditorService,
-        PipelinePositioningService,
-        PipelineValidationService,
-        PipelineElementRecommendationService,
-        ElementIconText,
-        ImageChecker,
-        {
-            provide: '$state',
-            useFactory: ($injector: any) => $injector.get('$state'),
-            deps: ['$injector']
-        },
-        {
-            provide: '$timeout',
-            useFactory: ($injector: any) => $injector.get('$timeout'),
-            deps: ['$injector']
-        },
-        SafeCss
-    ],
-  exports: [
-    EditorComponent,
-    PipelineComponent,
-    PipelineElementComponent
-  ],
-    entryComponents: [
-        EditorComponent
-    ]
-})
-export class EditorModule {
-
-    constructor() {
-    }
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/capitalize.filter.ts b/ui/src/app/editor/capitalize.filter.ts
deleted file mode 100644
index 95db2fa..0000000
--- a/ui/src/app/editor/capitalize.filter.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-capitalize.$inject = [];
-
-export default function capitalize() {
-	return function(input) {
-		if (input!=null) {
-			input = input.replace(/_/g, " ");
-			var stringArr = input.split(" ");
-			var result = "";
-			var cap = stringArr.length;
-			for(var x = 0; x < cap; x++) {
-				stringArr[x] = stringArr[x].toLowerCase();
-				if(x === cap - 1) {
-					result += stringArr[x].substring(0,1).toUpperCase() + stringArr[x].substring(1);
-				} else {
-					result += stringArr[x].substring(0,1).toUpperCase() + stringArr[x].substring(1) + " ";
-				}
-			}
-			return result;
-		}
-	}
-};
diff --git a/ui/src/app/editor/components/alternative/alternative.component.ts b/ui/src/app/editor/components/alternative/alternative.component.ts
deleted file mode 100644
index 7bf1dca..0000000
--- a/ui/src/app/editor/components/alternative/alternative.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {AlternativeController} from "./alternative.controller";
-
-declare const require: any;
-
-export let AlternativeComponent = {
-    template: require('./alternative.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        selectedElement: "=",
-        displayRecommended: "=",
-        customizeForm: "="
-    },
-    controller: AlternativeController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/alternative/alternative.controller.ts b/ui/src/app/editor/components/alternative/alternative.controller.ts
deleted file mode 100644
index 1b6f8e5..0000000
--- a/ui/src/app/editor/components/alternative/alternative.controller.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class AlternativeController {
-
-    staticProperty: any;
-
-    constructor() {
-    }
-
-    $onInit() {
-    }
-
-    toggle() {
-        this.staticProperty.properties.alternatives.forEach(sp => {
-           if (sp.internalName === this.staticProperty.properties.currentSelection) {
-               sp.selected = true;
-           }  else {
-               sp.selected = false;
-           }
-        });
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/alternative/alternative.tmpl.html b/ui/src/app/editor/components/alternative/alternative.tmpl.html
deleted file mode 100644
index 2843820..0000000
--- a/ui/src/app/editor/components/alternative/alternative.tmpl.html
+++ /dev/null
@@ -1,30 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-input-container flex="100" layout="column">
-    <md-radio-group required class="md-accent" ng-repeat="alternative in ctrl.staticProperty.properties.alternatives" name="{{ctrl.staticProperty.properties.elementId}}" ng-model="ctrl.staticProperty.properties.currentSelection" ng-change='ctrl.toggle()'>
-        <md-radio-button ng-value="alternative.internalName" >
-            <b>{{alternative.label}}</b><br/>
-        </md-radio-button>
-    </md-radio-group>
-</md-input-container>
-<div ng-repeat="alternative in ctrl.staticProperty.properties.alternatives">
-    <div ng-if="alternative.selected">
-        <customize-dialog customize-form="ctrl.customizeForm" display-recommended="ctrl.displayRecommended" static-property="alternative.staticProperty" selected-element="ctrl.selectedElement"></customize-dialog>
-    </div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/any-remote/any-remote.component.ts b/ui/src/app/editor/components/any-remote/any-remote.component.ts
deleted file mode 100644
index 2a95535..0000000
--- a/ui/src/app/editor/components/any-remote/any-remote.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {AnyRemoteController} from "./any-remote.controller";
-
-declare const require: any;
-
-export let AnyRemoteComponent = {
-    template: require('./any-remote.tmpl.html'),
-    bindings: {
-        staticProperty : "=",
-        selectedElement: "="
-    },
-    controller: AnyRemoteController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/any-remote/any-remote.controller.ts b/ui/src/app/editor/components/any-remote/any-remote.controller.ts
deleted file mode 100644
index dc6ec7c..0000000
--- a/ui/src/app/editor/components/any-remote/any-remote.controller.ts
+++ /dev/null
@@ -1,101 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class AnyRemoteController {
-
-    RestApi: any;
-    $rootScope: any;
-    $scope: any;
-    $timeout;
-    staticProperty: any;
-    selectedElement: any;
-    currentlyLinkedProperty: any;
-
-    showOptions: boolean;
-
-    dependentStaticProperties: any = new Map();
-    loading: boolean;
-
-    constructor(RestApi, $rootScope, $scope, $timeout) {
-        this.RestApi = RestApi;
-        this.$rootScope = $rootScope;
-        this.$scope = $scope;
-        this.$timeout = $timeout;
-    }
-
-    $onInit() {
-        this.showOptions = false;
-        this.loading = false;
-        if (this.staticProperty.properties.options.length == 0) {
-            if ((!this.staticProperty.properties.dependsOn) || (this.staticProperty.properties.dependsOn.length == 0)) {
-                this.loadOptionsFromRestApi();
-            }
-        } else {
-            this.loadSavedProperty();
-
-        }
-
-        angular.forEach(this.selectedElement.staticProperties, sp => {
-            if (sp.properties.internalName === this.staticProperty.properties.linkedMappingPropertyId) {
-                this.currentlyLinkedProperty = sp.properties.mapsTo;
-            }
-        });
-
-        if (this.staticProperty.properties.dependsOn && this.staticProperty.properties.dependsOn.length > 0) {
-            angular.forEach(this.staticProperty.properties.dependsOn, dp => {
-                this.dependentStaticProperties.set(dp, false);
-                this.$rootScope.$on(dp, (valid) => {
-                    this.dependentStaticProperties.set(dp, true);
-                    if (Array.from(this.dependentStaticProperties.values()).every(v => v === true)) {
-                        this.loadOptionsFromRestApi();
-                    }
-                });
-            });
-        }
-    }
-
-    loadOptionsFromRestApi() {
-        var resolvableOptionsParameterRequest = {};
-        resolvableOptionsParameterRequest['staticProperties'] = this.selectedElement.staticProperties;
-        resolvableOptionsParameterRequest['inputStreams'] = this.selectedElement.inputStreams;
-        resolvableOptionsParameterRequest['belongsTo'] = this.selectedElement.belongsTo;
-        resolvableOptionsParameterRequest['appId'] = this.selectedElement.appId;
-        resolvableOptionsParameterRequest['runtimeResolvableInternalId'] = this.staticProperty.properties.internalName;
-
-        this.showOptions = false;
-        this.loading = true;
-        this.RestApi.fetchRemoteOptions(resolvableOptionsParameterRequest).then(msg => {
-            this.staticProperty.properties.options = [];
-            this.staticProperty.properties.options = msg.data;
-            if (this.staticProperty.properties.options.length > 0) {
-                this.staticProperty.properties.options[0].selected = true;
-            }
-            this.loadSavedProperty();
-        });
-    }
-
-
-    loadSavedProperty() {
-        this.loading = false;
-        this.showOptions = true;
-    }
-}
-
-AnyRemoteController.$inject = ['RestApi', '$rootScope', '$scope', '$timeout'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/any-remote/any-remote.tmpl.html b/ui/src/app/editor/components/any-remote/any-remote.tmpl.html
deleted file mode 100644
index 119b711..0000000
--- a/ui/src/app/editor/components/any-remote/any-remote.tmpl.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-if="ctrl.loading" flex="100" layout="column" layout-align="center center">
-    <md-progress-circular md-mode="indeterminate"></md-progress-circular>
-</div>
-<div ng-if="!ctrl.loading">
-    <div flex="100" layout="column" layout-align="center start" ng-if="ctrl.showOptions">
-        <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.loadOptionsFromRestApi()">
-            <i class="material-icons" style="font-size:18px;">refresh</i>
-            <md-tooltip md-direction="top">
-                Reload
-            </md-tooltip>
-            Reload</sp-button>&nbsp;&nbsp;
-    </div>
-    <md-input-container flex="100" layout="column">
-        <div ng-repeat="option in ctrl.staticProperty.properties.options">
-            <md-checkbox ng-model="option.selected">
-                {{option.name}}
-            </md-checkbox>
-        </div>
-    </md-input-container>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/any/any.component.ts b/ui/src/app/editor/components/any/any.component.ts
deleted file mode 100644
index edde4c2..0000000
--- a/ui/src/app/editor/components/any/any.component.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {AnyController} from "./any.controller";
-
-declare const require: any;
-
-export let AnyComponent = {
-    template: require('./any.tmpl.html'),
-    bindings: {
-        staticProperty: "="
-    },
-    controller: AnyController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/any/any.controller.ts b/ui/src/app/editor/components/any/any.controller.ts
deleted file mode 100644
index 7999386..0000000
--- a/ui/src/app/editor/components/any/any.controller.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class AnyController {
-
-    staticProperty: any;
-
-    constructor() {
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/any/any.tmpl.html b/ui/src/app/editor/components/any/any.tmpl.html
deleted file mode 100644
index 211ccf7..0000000
--- a/ui/src/app/editor/components/any/any.tmpl.html
+++ /dev/null
@@ -1,23 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-repeat="option in ctrl.staticProperty.properties.options">
-    <md-checkbox ng-model="option.selected">
-        {{option.name}}
-    </md-checkbox>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/code/code-editor.directive.ts b/ui/src/app/editor/components/code/code-editor.directive.ts
deleted file mode 100644
index c239888..0000000
--- a/ui/src/app/editor/components/code/code-editor.directive.ts
+++ /dev/null
@@ -1,91 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import CodeMirror from 'codemirror';
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/addon/edit/closebrackets';
-import 'codemirror/addon/hint/show-hint';
-import 'codemirror/addon/hint/javascript-hint';
-import 'codemirror/addon/lint/lint';
-import 'codemirror/addon/lint/javascript-lint';
-import {JSHINT} from 'jshint';
-
-export class CodeEditorDirective {
-
-    require: string = "?ngModel";
-    replace: boolean = true;
-    transclude: boolean = true;
-    template: string = '<div class="code-editor"></div>';
-
-    constructor() {
-        (<any>window).JSHINT = JSHINT;
-    }
-
-    link(scope, element, attrs, ngModelCtrl, transclude) {
-
-        let selectedElement = scope.$eval(attrs.inputStreams);
-        let codeTemplate = attrs.codeTemplate;
-        scope.editor = CodeMirror(element[0], {
-            mode: "javascript",
-            autoRefresh: true,
-            theme: 'dracula',
-            autoCloseBrackets: true,
-            lineNumbers: true,
-            lineWrapping: true,
-            gutters: ["CodeMirror-lint-markers"],
-            lint: true,
-            extraKeys: {
-                "Ctrl-Space": "autocomplete"
-            }
-        });
-        this.enableCodeHints(selectedElement);
-
-        if (ngModelCtrl) {
-            ngModelCtrl.$render = () => {
-                setTimeout(() => {
-                    scope.editor.setValue(ngModelCtrl.$viewValue);
-                    scope.editor.refresh();
-                },200);
-            }
-        }
-        scope.editor.on('change', () => {
-            ngModelCtrl.$setViewValue(scope.editor.getValue());
-            scope.$emit('editor-change')
-        })
-
-    }
-
-    enableCodeHints(selectedElement: any) {
-        var jsHint = CodeMirror.hint.javascript;
-        CodeMirror.hint.javascript = (cm) => {
-            let cursor = cm.getCursor();
-            let token = cm.getTokenAt(cursor);
-            let inner = {from: cm.getCursor(), to: cm.getCursor(), list: []};
-            let previousCursor = {line: cursor.line, ch: (cursor.ch - 1), sticky: null}
-            let previousToken = cm.getTokenAt(previousCursor);
-            if (token.string === "." && previousToken.string === "event") {
-                selectedElement.inputStreams[0].eventSchema.eventProperties.forEach(ep => {
-                    inner.list.unshift(ep.properties.runtimeName);
-                })
-            } else {
-                inner = jsHint(cm);
-            }
-            return inner;
-        };
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/code/code.component.ts b/ui/src/app/editor/components/code/code.component.ts
deleted file mode 100644
index f3fdaec..0000000
--- a/ui/src/app/editor/components/code/code.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {CodeInputController} from "./code.controller";
-
-declare const require: any;
-
-export let CodeInputComponent = {
-    template: require('./code.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        displayRecommended: "=",
-        customizeForm: "=",
-        selectedElement: "="
-    },
-    controller: CodeInputController,
-    controllerAs: 'ctrl'
-};
\ No newline at end of file
diff --git a/ui/src/app/editor/components/code/code.controller.ts b/ui/src/app/editor/components/code/code.controller.ts
deleted file mode 100644
index 19f014e..0000000
--- a/ui/src/app/editor/components/code/code.controller.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class CodeInputController {
-
-    staticProperty: any;
-    displayRecommended: boolean;
-    customizeForm: any;
-    selectedElement: any;
-
-    showEditor: boolean = false;
-
-    $onInit() {
-        if (this.staticProperty.properties.value == undefined ||
-            this.staticProperty.properties.value == "") {
-            this.resetCode();
-        }
-    }
-
-    $postLink() {
-        this.showEditor = true;
-    }
-
-    resetCode() {
-        this.staticProperty.properties.value = this.staticProperty.properties.codeTemplate;
-    };
-
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/code/code.tmpl.html b/ui/src/app/editor/components/code/code.tmpl.html
deleted file mode 100644
index 2d21712..0000000
--- a/ui/src/app/editor/components/code/code.tmpl.html
+++ /dev/null
@@ -1,33 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div flex="100" layout="row" layout-align="start center">
-    <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.resetCode()">Reset template
-    </sp-button>&nbsp;&nbsp;
-</div>
-<div layout="row" layout-align="end center" flex="100">
-<div layout="column" layout-align="start center">
-<i class="material-icons">info</i>
-</div>
-    <div layout="column" layout-align="center center">Use Ctrl-Space to get code hints.</div>
-</div>
-
-<code-editor ng-model="ctrl.staticProperty.properties.value"
-             ng-if="ctrl.showEditor" code-template="{{ctrl.staticProperty.properties.codeTemplate}}"
-             input-streams="{{ctrl.selectedElement}}">
-</code-editor>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/collection/collection.component.ts b/ui/src/app/editor/components/collection/collection.component.ts
deleted file mode 100644
index 4701737..0000000
--- a/ui/src/app/editor/components/collection/collection.component.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {CollectionController} from "./collection.controller";
-
-declare const require: any;
-
-export let CollectionComponent = {
-    template: require('./collection.tmpl.html'),
-    bindings: {
-        staticProperty: "="
-    },
-    controller: CollectionController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/collection/collection.controller.ts b/ui/src/app/editor/components/collection/collection.controller.ts
deleted file mode 100644
index 8966986..0000000
--- a/ui/src/app/editor/components/collection/collection.controller.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class CollectionController {
-
-    staticProperty: any;
-
-    constructor() {
-
-    }
-
-    $onInit() {
-    }
-
-    addMember(sp) {
-        let newMember = angular.copy(this.staticProperty.properties.staticPropertyTemplate);
-        newMember.properties.elementId = newMember.properties.elementId.concat(this.makeId());
-        sp.properties.members.push(newMember);
-    }
-
-    removeMember(sp, index) {
-        sp.properties.members.splice(index, 1);
-    }
-
-    makeId() {
-        var text = "";
-        var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
-
-        for (var i = 0; i < 5; i++)
-            text += possible.charAt(Math.floor(Math.random() * possible.length));
-
-        return text;
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/collection/collection.tmpl.html b/ui/src/app/editor/components/collection/collection.tmpl.html
deleted file mode 100644
index 5d3eb56..0000000
--- a/ui/src/app/editor/components/collection/collection.tmpl.html
+++ /dev/null
@@ -1,60 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div class="customize-item-content sp-blue-border-nopadding"
-     ng-repeat="sp in ctrl.staticProperty.properties.members track by $index">
-    <div flex="100" layout="row" layout-align="end center">
-        <md-button ng-click="ctrl.removeMember(ctrl.staticProperty, $index)" class="md-icon-button"
-                   ng-disabled="ctrl.staticProperty.properties.members.length == 1">
-            <i class="material-icons">clear</i>
-            <md-tooltip md-direction="top">
-                Remove
-            </md-tooltip>
-        </md-button>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'OneOfStaticProperty'">
-        <oneof static-property="sp"></oneof>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'FreeTextStaticProperty'">
-        <freetext input-streams="selectedElement.inputStreams" static-property="sp"></freetext>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'AnyStaticProperty'">
-        <any static-property="sp"></any>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'DomainStaticProperty'">
-        <domain-concept-input static-property="sp"
-                              auto-complete-static-property="sp"></domain-concept-input>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'MappingPropertyUnary'">
-        <mapping-property-unary static-property="sp"></mapping-property-unary>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'MappingPropertyNary'">
-        <mapping-property-nary static-property="sp"></mapping-property-nary>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'MatchingProperty'">
-        <matching-property static-property="sp"></matching-property>
-    </div>
-    <div ng-if="sp.properties.staticPropertyType == 'CollectionStaticProperty'">
-        <collection-property static-property="sp"></collection-property>
-    </div>
-</div>
-<div flex="100" layout="row" layout-align="end center">
-    <md-button ng-click="ctrl.addMember(ctrl.staticProperty)">
-        Add
-    </md-button>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customize/customize-dialog.component.ts b/ui/src/app/editor/components/customize/customize-dialog.component.ts
deleted file mode 100644
index f7b4a3f..0000000
--- a/ui/src/app/editor/components/customize/customize-dialog.component.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {CustomizeDialogController} from "./customize-dialog.controller";
-
-declare const require: any;
-
-export let CustomizeDialogComponent = {
-    template: require('./customize-dialog.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        selectedElement: "=",
-        displayRecommended: "=",
-        customizeForm: "=",
-        restrictedEditMode: "<"
-    },
-    controller: CustomizeDialogController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/customize/customize-dialog.controller.ts b/ui/src/app/editor/components/customize/customize-dialog.controller.ts
deleted file mode 100644
index ce7de09..0000000
--- a/ui/src/app/editor/components/customize/customize-dialog.controller.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class CustomizeDialogController {
-
-    selectedElement: any;
-    staticProperty: any;
-    customizeForm: any;
-    displayRecommended: boolean;
-
-    constructor() {
-    }
-
-    $onInit() {
-    }
-
-    getMappingProperty(mapsTo) {
-        var sps;
-        angular.forEach(this.selectedElement.staticProperties, sp => {
-            if (sp.properties.internalName == mapsTo) {
-                sps = sp;
-            }
-        });
-        return sps;
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customize/customize-dialog.tmpl.html b/ui/src/app/editor/components/customize/customize-dialog.tmpl.html
deleted file mode 100644
index 6c48606..0000000
--- a/ui/src/app/editor/components/customize/customize-dialog.tmpl.html
+++ /dev/null
@@ -1,96 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div layout="column" ng-class="(ctrl.staticProperty.properties.staticPropertyType === 'StaticPropertyGroup') ? '' : 'customize-item-main sp-blue-border-nopadding'">
-    <div class="customize-item-title sp-blue-bg" layout="row" flex="100"
-         layout-align="space-between center" ng-if="(ctrl.staticProperty.properties.staticPropertyType !== 'StaticPropertyGroup')">
-        <div>
-            {{ctrl.staticProperty.properties.label}}
-        </div>
-        <div style="padding-left:10px;">
-            <md-icon md-svg-icon="action:ic_help_24px" aria-label="Description">
-                <md-tooltip md-direction="left">{{ctrl.staticProperty.properties.description}}
-                </md-tooltip>
-            </md-icon>
-        </div>
-    </div>
-    <div ng-class="(ctrl.staticProperty.properties.staticPropertyType === 'StaticPropertyGroup') ? '' : 'customize-item-content'">
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'OneOfStaticProperty'">
-            <oneof static-property="ctrl.staticProperty"></oneof>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'FreeTextStaticProperty'">
-            <freetext customize-form="ctrl.customizeForm" input-streams="ctrl.selectedElement.inputStreams"
-                      static-property="ctrl.staticProperty"
-                      mapping-property="ctrl.getMappingProperty(ctrl.staticProperty.properties.mapsTo)"></freetext>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'SecretStaticProperty'">
-            <secret customize-form="ctrl.customizeForm"
-                      static-property="ctrl.staticProperty"></secret>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'AnyStaticProperty'">
-            <any static-property="ctrl.staticProperty"></any>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'DomainStaticProperty'">
-            <domain-concept-input static-property="ctrl.staticProperty"
-                                  auto-complete-static-property="ctrl.staticProperty"></domain-concept-input>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'MappingPropertyUnary'">
-            <mapping-property-unary selected-element="ctrl.selectedElement" static-property="ctrl.staticProperty"
-                                    display-recommended="ctrl.displayRecommended"
-                                    restricted-edit-mode="ctrl.restrictedEditMode">
-            </mapping-property-unary>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'MappingPropertyNary'">
-            <mapping-property-nary selected-element="ctrl.selectedElement" static-property="ctrl.staticProperty"
-                                   display-recommended="ctrl.displayRecommended"
-                                   restricted-edit-mode="ctrl.restrictedEditMode">
-            </mapping-property-nary>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'MatchingProperty'">
-            <matching-property static-property="ctrl.staticProperty"></matching-property>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'CollectionStaticProperty'">
-            <collection-static-property static-property="ctrl.staticProperty"></collection-static-property>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'RuntimeResolvableOneOfStaticProperty'">
-            <oneof-remote static-property="ctrl.staticProperty" selected-element="ctrl.selectedElement"></oneof-remote>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'RuntimeResolvableAnyStaticProperty'">
-            <any-remote static-property="ctrl.staticProperty" selected-element="ctrl.selectedElement"></any-remote>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'StaticPropertyAlternatives'">
-            <alternative customize-form="ctrl.customizeForm" display-recommended="ctrl.displayRecommended"
-                         static-property="ctrl.staticProperty" selected-element="ctrl.selectedElement"></alternative>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'StaticPropertyGroup'">
-            <group customize-form="ctrl.customizeForm" display-recommended="ctrl.displayRecommended"
-                   static-property="ctrl.staticProperty" selected-element="ctrl.selectedElement"></group>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'FileStaticProperty'">
-            <file-static-property customize-form="ctrl.customizeForm" display-recommended="ctrl.displayRecommended"
-                   static-property="ctrl.staticProperty" selected-element="ctrl.selectedElement"
-                                  restricted-edit-mode="ctrl.restrictedEditMode">
-            </file-static-property>
-        </div>
-        <div ng-if="ctrl.staticProperty.properties.staticPropertyType == 'CodeInputStaticProperty'">
-            <code-input customize-form="ctrl.customizeForm" display-recommended="ctrl.displayRecommended"
-                                  static-property="ctrl.staticProperty" selected-element="ctrl.selectedElement">
-            </code-input>
-        </div>
-    </div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customoutput/customoutput.component.ts b/ui/src/app/editor/components/customoutput/customoutput.component.ts
deleted file mode 100644
index 720c583..0000000
--- a/ui/src/app/editor/components/customoutput/customoutput.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {CustomOutputController} from "./customoutput.controller";
-
-declare const require: any;
-
-export let CustomOutputComponent = {
-    template: require('./customoutput.tmpl.html'),
-    bindings: {
-        outputStrategy: "=",
-        selectedElement: "=",
-        customizeForm: "=",
-        restrictedEditMode: "<"
-    },
-    controller: CustomOutputController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/customoutput/customoutput.controller.ts b/ui/src/app/editor/components/customoutput/customoutput.controller.ts
deleted file mode 100644
index 2f2a999..0000000
--- a/ui/src/app/editor/components/customoutput/customoutput.controller.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class CustomOutputController {
-
-    outputStrategy: any;
-    selectedElement: any;
-    collectedPropertiesFirstStream: any;
-    collectedPropertiesSecondStream: any;
-    customizeForm: any;
-
-    PropertySelectorService: any;
-
-    constructor(PropertySelectorService) {
-        this.PropertySelectorService = PropertySelectorService;
-    }
-
-    $onInit() {
-        this.collectedPropertiesFirstStream = this.PropertySelectorService
-            .makeProperties(this.getProperties(0), this.outputStrategy.properties.availablePropertyKeys, this.PropertySelectorService.firstStreamPrefix);
-        this.collectedPropertiesSecondStream = this.PropertySelectorService
-            .makeProperties(this.getProperties(1), this.outputStrategy.properties.availablePropertyKeys, this.PropertySelectorService.secondStreamPrefix);
-    }
-
-    getProperties(streamIndex) {
-        return this.selectedElement.inputStreams[streamIndex] === undefined ? [] : this.selectedElement.inputStreams[streamIndex].eventSchema.eventProperties;
-    }
-
-    selectAll(collectedProperties) {
-        collectedProperties.forEach(ep => this.outputStrategy.properties.selectedPropertyKeys.push(ep.properties.runtimeId));
-        // This is needed to trigger update of scope
-        this.outputStrategy.properties.selectedPropertyKeys = this.outputStrategy.properties.selectedPropertyKeys.filter(el => {return true;});
-    }
-
-    deselectAll(collectedProperties) {
-        collectedProperties.forEach(ep => this.outputStrategy.properties.selectedPropertyKeys =
-            this.outputStrategy.properties.selectedPropertyKeys.filter(item => item !== ep.properties.runtimeId));
-
-    }
-}
-
-CustomOutputController.$inject = ['PropertySelectorService']
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customoutput/customoutput.tmpl.html b/ui/src/app/editor/components/customoutput/customoutput.tmpl.html
deleted file mode 100644
index c2af3cf..0000000
--- a/ui/src/app/editor/components/customoutput/customoutput.tmpl.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div flex="100" layout="row" layout-align="start center">
-    <h5 style="margin-right:10px;">{{ctrl.selectedElement.inputStreams[0].name}}</h5>
-    <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.selectAll(ctrl.collectedPropertiesFirstStream)"
-               ng-disabled="ctrl.restrictedEditMode">Select all
-    </sp-button>&nbsp;&nbsp;
-    <sp-button sp-button-gray sp-button-small-padding
-               ng-click="ctrl.deselectAll(ctrl.collectedPropertiesFirstStream)" ng-disabled="ctrl.restrictedEditMode">Select
-        none
-    </sp-button>
-</div>
-<div ng-repeat="(index, property) in ctrl.collectedPropertiesFirstStream track by $index">
-    <property-selection output-strategy="ctrl.outputStrategy" event-property="property"
-                        layer="0" restricted-edit-mode="ctrl.restrictedEditMode"></property-selection>
-</div>
-<div ng-if="ctrl.collectedPropertiesSecondStream.length > 0">
-    <div flex="100" layout="row" layout-align="start center">
-        <h5 style="margin-right:10px;">{{ctrl.selectedElement.inputStreams[1].name}}</h5>
-        <sp-button sp-button-blue sp-button-small-padding
-                   ng-click="ctrl.selectAll(ctrl.collectedPropertiesSecondStream)" ng-disabled="ctrl.restrictedEditMode">Select
-            all</sp-button>&nbsp;&nbsp;
-        <sp-button sp-button-gray sp-button-small-padding
-                   ng-click="ctrl.deselectAll(ctrl.collectedPropertiesSecondStream)" ng-disabled="ctrl.restrictedEditMode">Select
-            none</sp-button>
-    </div>
-    <div ng-repeat="(index, property) in ctrl.collectedPropertiesSecondStream track by $index">
-        <property-selection output-strategy="ctrl.outputStrategy" event-property="property"
-                            layer="0" restricted-edit-mode="ctrl.restrictedEditMode"></property-selection>
-    </div>
-</div>
-<input type="hidden" name="{{ctrl.outputStrategy.properties.elementId}}" ng-model="ctrl.outputStrategy.properties.selectedPropertyKeys" custom-output-validator>
-<span ng-show="ctrl.customizeForm[ctrl.outputStrategy.properties.elementId].$invalid">Select at least one property.</span>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customoutput/propertyselection/property-selection.component.ts b/ui/src/app/editor/components/customoutput/propertyselection/property-selection.component.ts
deleted file mode 100644
index 4cf6dd5..0000000
--- a/ui/src/app/editor/components/customoutput/propertyselection/property-selection.component.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {PropertySelectionController} from "./property-selection.controller";
-
-declare const require: any;
-
-export let PropertySelectionComponent = {
-    template: require('./property-selection.tmpl.html'),
-    bindings: {
-        outputStrategy: "=",
-        eventProperty: "=",
-        layer: "@",
-        togglePropertyKey: "&",
-        restrictedEditMode: "<"
-    },
-    controller: PropertySelectionController,
-    controllerAs: 'ctrl'
-};
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customoutput/propertyselection/property-selection.controller.ts b/ui/src/app/editor/components/customoutput/propertyselection/property-selection.controller.ts
deleted file mode 100644
index cf6a664..0000000
--- a/ui/src/app/editor/components/customoutput/propertyselection/property-selection.controller.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class PropertySelectionController {
-
-    outputStrategy: any;
-    eventProperty: any;
-    layer: any;
-
-    toggle(runtimeId) {
-        if (this.exists(runtimeId)) {
-            this.remove(runtimeId);
-        } else {
-            this.add(runtimeId);
-        }
-    }
-
-    exists(runtimeId) {
-        return this.outputStrategy.properties.selectedPropertyKeys.some(e => e === runtimeId);
-    }
-
-    add(runtimeId) {
-        this.outputStrategy.properties.selectedPropertyKeys.push(runtimeId);
-        // This is needed to trigger update of scope
-        this.outputStrategy.properties.selectedPropertyKeys = this.outputStrategy.properties.selectedPropertyKeys.filter(el => {return true;});
-    }
-
-    remove(runtimeId) {
-        this.outputStrategy.properties.selectedPropertyKeys =  this.outputStrategy.properties.selectedPropertyKeys.filter(el => { return el != runtimeId; });
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/customoutput/propertyselection/property-selection.tmpl.html b/ui/src/app/editor/components/customoutput/propertyselection/property-selection.tmpl.html
deleted file mode 100644
index 2cbf1b5..0000000
--- a/ui/src/app/editor/components/customoutput/propertyselection/property-selection.tmpl.html
+++ /dev/null
@@ -1,33 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div class="property-selection" style="margin-left:{{ctrl.layer*5}}%">
-    <md-checkbox style="margin-bottom:0px;" ng-checked="ctrl.exists(ctrl.eventProperty.properties.runtimeId)"
-                 ng-click="ctrl.toggle(ctrl.eventProperty.properties.runtimeId)" ng-disabled="ctrl.restrictedEditMode">
-        <div ng-if="ctrl.eventProperty.properties.label"><b>{{ctrl.eventProperty.properties.label}}</b> <i>({{ctrl.eventProperty.properties.description}},
-            field name: {{ctrl.eventProperty.properties.runtimeName}})</i><br/></div>
-        <div ng-if="!ctrl.eventProperty.properties.label"><b>{{ctrl.eventProperty.properties.runtimeName}}</b><br/>
-        </div>
-    </md-checkbox>
-</div>
-<div ng-if="(ctrl.eventProperty.type==='org.apache.streampipes.model.schema.EventPropertyNested')">
-    <div ng-repeat="nestedProperty in ctrl.eventProperty.properties.eventProperties">
-        <property-selection output-strategy="ctrl.outputStrategy" event-property="nestedProperty"
-                            layer="{{(ctrl.layer + 1)}}"></property-selection>
-    </div>
-</div>
diff --git a/ui/src/app/editor/components/domainconcept/domainconcept.component.ts b/ui/src/app/editor/components/domainconcept/domainconcept.component.ts
deleted file mode 100644
index 4273eb6..0000000
--- a/ui/src/app/editor/components/domainconcept/domainconcept.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {DomainConceptController} from "./domainconcept.controller";
-
-declare const require: any;
-
-export let DomainConceptComponent = {
-    template: require('./domainconcept.tmpl.html'),
-    bindings: {
-        staticProperty : "=",
-        autoCompleteStaticProperty : "="
-    },
-    controller: DomainConceptController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/domainconcept/domainconcept.controller.ts b/ui/src/app/editor/components/domainconcept/domainconcept.controller.ts
deleted file mode 100644
index f568555..0000000
--- a/ui/src/app/editor/components/domainconcept/domainconcept.controller.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class DomainConceptController {
-
-    RestApi: any;
-    availableDomainProperties: any;
-    autoCompleteStaticProperty: any;
-
-    constructor(RestApi) {
-        this.RestApi = RestApi;
-        this.availableDomainProperties = {};
-    }
-
-    $onInit() {
-        this.loadDomainConcepts(this.autoCompleteStaticProperty);
-    }
-
-    loadDomainConcepts(item) {
-        var query = {};
-        query['requiredClass'] = item.properties.requiredClass;
-        query['requiredProperties'] = [];
-        angular.forEach(item.properties.supportedProperties, function (p) {
-            var propertyObj = {};
-            propertyObj['propertyId'] = p.propertyId;
-            query['requiredProperties'].push(propertyObj);
-        });
-
-        this.RestApi.getDomainKnowledgeItems(query)
-            .then(msg => {
-                let queryResponse = msg.data;
-                if (!this.availableDomainProperties[item.elementId]) {
-                    this.availableDomainProperties[item.elementId] = {};
-                }
-                angular.forEach(queryResponse.requiredProperties, resp => {
-                    angular.forEach(resp.queryResponse, instanceResult => {
-                        if (!this.availableDomainProperties[item.elementId][resp.propertyId])
-                            this.availableDomainProperties[item.elementId][resp.propertyId] = [];
-                        var instanceData = {
-                            label: instanceResult.label,
-                            description: instanceResult.description,
-                            propertyValue: instanceResult.propertyValue
-                        };
-                        this.availableDomainProperties[item.elementId][resp.propertyId].push(instanceData);
-                    });
-                });
-            });
-    }
-
-    querySearch(query, staticPropertyId) {
-        var result = [];
-        var i = 0;
-        angular.forEach(this.availableDomainProperties[staticPropertyId], function (values) {
-            if (values.length > 0 && i == 0) {
-                var position = 0;
-                angular.forEach(values, value => {
-                    if (query == undefined || value.label.substring(0, query.length) === query) result.push({
-                        label: value.label,
-                        description: value.description,
-                        position: position
-                    });
-                    position++;
-                })
-                i++;
-            }
-        });
-        return result;
-    }
-
-    searchTextChange(text) {
-
-    }
-
-    selectedItemChange(item, staticPropertyId, supportedProperties) {
-        angular.forEach(supportedProperties, supportedProperty => {
-            supportedProperty.value = this.availableDomainProperties[staticPropertyId][supportedProperty.propertyId][item.position].propertyValue;
-        });
-    }
-
-}
-
-DomainConceptController.$inject = ['RestApi'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/domainconcept/domainconcept.tmpl.html b/ui/src/app/editor/components/domainconcept/domainconcept.tmpl.html
deleted file mode 100644
index a6718ed..0000000
--- a/ui/src/app/editor/components/domainconcept/domainconcept.tmpl.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<b>Required type: {{staticProperty.properties.requiredClass}}</b>
-<div layout="column">
-    <div>
-        Instance search:
-    </div>
-    <div>
-        <md-autocomplete
-                ng-disabled="false"
-                md-no-cache="false"
-                md-selected-item="ctrl.selectedItem"
-                md-search-text-change="ctrl.searchTextChange(searchText)"
-                md-search-text="ctrl.searchText"
-                md-selected-item-change="ctrl.selectedItemChange(item, autoCompleteStaticProperty.elementId, staticProperty.properties.supportedProperties)"
-                md-items="item in ctrl.querySearch(searchText, autoCompleteStaticProperty.elementId)"
-                md-item-text="item.label"
-                md-min-length="0"
-                placeholder="Label">
-            <md-item-template>
-                <span md-highlight-text="ctrl.searchText" md-highlight-flags="^i">{{item.label}}</span>
-            </md-item-template>
-            <md-not-found>
-                No instances matching "{{ctrl.searchText}}" were found.
-            </md-not-found>
-        </md-autocomplete>
-    </div>
-</div>
-<div ng-repeat="supportedProperty in ctrl.staticProperty.properties.supportedProperties">
-    <md-input-container flex="100" layout="column"> <label>{{supportedProperty.propertyId}}</label>
-        <input name="{{supportedProperty.elementId}}" ng-model="supportedProperty.value"/>
-    </md-input-container>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/draggable-icon.html b/ui/src/app/editor/components/draggable-icon.html
deleted file mode 100644
index bea1753..0000000
--- a/ui/src/app/editor/components/draggable-icon.html
+++ /dev/null
@@ -1,25 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<span class="draggable-icon tt" ng-class="element.type" data-toggle="tooltip" data-placement="top" title="{{element.name}}" >
-    <img class="draggable-img"
-         ng-show="(element.iconUrl != null && element.iconUrl != 'http://localhost:8080/img')" ng-src="{{element.iconUrl}}">
-    <span class="element-text-icon" ng-show="(element.iconUrl == null || item.iconUrl == 'http://localhost:8080/img')">
-        {{elementTextIcon(element.name)}}
-    </span>
-</span>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/fileupload/fileupload.component.ts b/ui/src/app/editor/components/fileupload/fileupload.component.ts
deleted file mode 100644
index 006c1d2..0000000
--- a/ui/src/app/editor/components/fileupload/fileupload.component.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {FileUploadController} from "./fileupload.controller";
-
-declare const require: any;
-
-export let FileUploadComponent = {
-    template: require('./fileupload.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        inputStreams : "=",
-        selectedElement: "=",
-        customizeForm: "=",
-        restrictedEditMode: "="
-    },
-    controller: FileUploadController,
-    controllerAs: 'ctrl'
-};
\ No newline at end of file
diff --git a/ui/src/app/editor/components/fileupload/fileupload.controller.ts b/ui/src/app/editor/components/fileupload/fileupload.controller.ts
deleted file mode 100644
index c025eb3..0000000
--- a/ui/src/app/editor/components/fileupload/fileupload.controller.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {RestApi} from "../../../services/rest-api.service";
-
-export class FileUploadController {
-
-    file: any;
-    restApi: RestApi;
-    selectedElement: any;
-    staticProperty: any;
-
-    fileMetadataDescriptions: any = [];
-    showFiles: boolean;
-
-    $scope: any;
-    $rootScope: any;
-
-    constructor(restApi: RestApi, $scope, $rootScope) {
-        this.restApi = restApi;
-        this.$scope = $scope;
-        this.$rootScope = $rootScope;
-    }
-
-    $onInit() {
-        this.showFiles = false;
-        this.getFileMetadata();
-
-
-        this.$scope.$watch(() => this.staticProperty.properties.locationPath, (newValue, oldValue) => {
-            if (this.staticProperty.properties.locationPath !== "" && this.staticProperty.properties.locationPath != undefined) {
-                if (newValue !== oldValue) {
-                    this.$rootScope.$emit(this.staticProperty.properties.internalName);
-                }
-            }
-        });
-    }
-
-    uploadFile() {
-        let fileInput: any = document.getElementById('file');
-        let file = fileInput.files[0];
-        let filename = fileInput.files[0].name;
-
-        const data: FormData = new FormData();
-        data.append('file_upload', file, filename);
-
-        this.restApi.uploadFile(data).then(result => {
-            this.getFileMetadata();
-        });
-    }
-
-    getFileMetadata() {
-        this.restApi.getFileMetadata().then(fm => {
-            this.fileMetadataDescriptions = fm.data;
-            this.showFiles = true;
-        })
-    }
-}
-
-FileUploadController.$inject = ['RestApi', '$scope', '$rootScope'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/fileupload/fileupload.tmpl.html b/ui/src/app/editor/components/fileupload/fileupload.tmpl.html
deleted file mode 100644
index 1967f47..0000000
--- a/ui/src/app/editor/components/fileupload/fileupload.tmpl.html
+++ /dev/null
@@ -1,39 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div>
-    <h5>Select File</h5>
-    <md-input-container flex="100" layout="column">
-        <md-select required class="md-accent" name="{{ctrl.staticProperty.properties.elementId}}"
-                   ng-model="ctrl.staticProperty.properties.locationPath" ng-disabled="ctrl.restrictedEditMode">
-            <md-option ng-repeat="fileMetadata in ctrl.fileMetadataDescriptions track by $index" ng-value="fileMetadata.internalFilename" ng-selected="fileMetadata.internalFilename == ctrl.staticProperty.properties.locationPath">
-                <b>{{fileMetadata.originalFilename}}</b><br/>
-            </md-option>
-        </md-select>
-    </md-input-container>
-    <hr/>
-    <h5>Upload new file</h5>
-    <input ng-model="ctrl.file" type="file" name="file" id="file" ng-disabled="ctrl.restrictedEditMode">
-    <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.uploadFile()" style="margin-top:10px;"
-               ng-disabled="ctrl.restrictedEditMode">
-        <i class="material-icons" style="font-size:18px;">file_upload</i>
-        <md-tooltip md-direction="top">
-            Upload
-        </md-tooltip>
-        Upload File</sp-button>&nbsp;&nbsp;
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/freetext/freetext.component.ts b/ui/src/app/editor/components/freetext/freetext.component.ts
deleted file mode 100644
index f0c178c..0000000
--- a/ui/src/app/editor/components/freetext/freetext.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {FreeTextController} from "./freetext.controller";
-
-declare const require: any;
-
-export let FreeTextComponent = {
-    template: require('./freetext.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        inputStreams : "=",
-        mappingProperty: "=",
-        customizeForm: "="
-    },
-    controller: FreeTextController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/freetext/freetext.controller.ts b/ui/src/app/editor/components/freetext/freetext.controller.ts
deleted file mode 100644
index dfe7257..0000000
--- a/ui/src/app/editor/components/freetext/freetext.controller.ts
+++ /dev/null
@@ -1,96 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class FreeTextController {
-
-    staticProperty: any;
-    mappingProperty: any;
-    selectedEventProperty: any;
-    inputStreams: any;
-    customizeForm: any;
-
-    $scope: any;
-    $rootScope: any;
-
-    primitiveClasses = [{"id": "http://www.w3.org/2001/XMLSchema#string"},
-        {"id": "http://www.w3.org/2001/XMLSchema#boolean"},
-        {"id": "http://www.w3.org/2001/XMLSchema#integer"},
-        {"id": "http://www.w3.org/2001/XMLSchema#long"},
-        {"id": "http://www.w3.org/2001/XMLSchema#double"},
-        {"id": "http://www.w3.org/2001/XMLSchema#float"}];
-
-    constructor($scope, $rootScope) {
-        this.$scope = $scope;
-        this.$rootScope = $rootScope;
-    }
-
-    $onInit() {
-        if (this.staticProperty.properties.valueSpecification) {
-            this.staticProperty.properties.value = (this.staticProperty.properties.value * 1);
-        }
-
-        if (this.mappingProperty) {
-            this.selectedEventProperty = this.updateCurrentEventProperty(this.mappingProperty.properties.mapsTo);
-        }
-    }
-
-    notifyListeners() {
-        this.$rootScope.$emit(
-            this.staticProperty.properties.internalName,
-            this.customizeForm[this.staticProperty.properties.internalName].$valid);
-    }
-
-    updateCurrentEventProperty(mapsTo) {
-        var eventProperty;
-        angular.forEach(this.inputStreams, stream => {
-            angular.forEach(stream.eventSchema.eventProperties, property => {
-                if (this.mappingProperty.properties.mapsTo == property.properties.elementId) {
-                    eventProperty = property;
-                }
-            });
-        });
-        return eventProperty;
-    }
-
-    applyPlaceholder(runtimeName) {
-        if (!this.staticProperty.properties.value) {
-            this.staticProperty.properties.value = "";
-        }
-        this.staticProperty.properties.value = this.staticProperty.properties.value + "#" + runtimeName + "#" + " ";
-    }
-
-    getFriendlyDatatype() {
-        if (this.staticProperty.properties.requiredDatatype == this.primitiveClasses[2].id ||
-            this.staticProperty.properties.requiredDatatype == this.primitiveClasses[3].id ||
-            this.staticProperty.properties.requiredDomainProperty == this.primitiveClasses[2].id ||
-            this.staticProperty.properties.requiredDomainProperty == this.primitiveClasses[3].id) {
-            return "The value should be a number (e.g., '1', '10'";
-        } else if (this.staticProperty.properties.requiredDatatype == this.primitiveClasses[4].id ||
-            this.staticProperty.properties.requiredDatatype == this.primitiveClasses[4].id ||
-            this.staticProperty.properties.requiredDomainProperty == this.primitiveClasses[4].id) {
-            return "The value should be a floating-point number (e.g., '1.0, '20.5')";
-        } else {
-            return "This value is not valid.";
-        }
-    }
-
-}
-
-FreeTextController.$inject = ['$scope', '$rootScope'];
diff --git a/ui/src/app/editor/components/freetext/freetext.tmpl.html b/ui/src/app/editor/components/freetext/freetext.tmpl.html
deleted file mode 100644
index 7d2dd1e..0000000
--- a/ui/src/app/editor/components/freetext/freetext.tmpl.html
+++ /dev/null
@@ -1,98 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-if="!ctrl.staticProperty.properties.valueSpecification && !ctrl.staticProperty.properties.mapsTo" flex="100" layout="column">
-    <div flex="100" layout="column" ng-if="ctrl.staticProperty.properties.placeholdersSupported">
-        <h5>{{ctrl.staticProperty.properties.description}}</h5>
-        <h5>Possible placeholders: </h5>
-        <div flex="100" layout="row" style="background:white;">
-            <div ng-click="ctrl.applyPlaceholder(property.properties.runtimeName)" class="sp-accent-bg"
-                 style="color:white;padding:5px;margin:5px;"
-                 ng-repeat="property in ctrl.inputStreams[0].eventSchema.eventProperties">
-                #{{property.properties.runtimeName}}#
-            </div>
-        </div>
-        &nbsp;&nbsp;
-    </div>
-    <md-input-container ng-if="!ctrl.staticProperty.properties.multiLine"><label>{{ctrl.staticProperty.properties.description}}</label>
-        <input name="{{ctrl.staticProperty.properties.internalName}}" ng-model="ctrl.staticProperty.properties.value"
-               text-validator="ctrl.staticProperty" ng-blur="ctrl.notifyListeners($event)" required/>
-        <span ng-show="ctrl.customizeForm[ctrl.staticProperty.properties.internalName].$touched && ctrl.customizeForm[ctrl.staticProperty.properties.internalName].$error.textValidator">{{ctrl.getFriendlyDatatype()}}</span>
-    </md-input-container>
-    <div ng-if="ctrl.staticProperty.properties.multiLine">
-        <trix-editor ng-if="true" ng-model-options="{ updateOn: 'blur' }"
-                     spellcheck="false" class="trix-content"
-                     ng-model="ctrl.staticProperty.properties.value"
-                     angular-trix
-                     trix-initialize="trixInitialize(e, editor);"
-                     trix-change="trixChange(e, editor);"
-                     trix-selection-change="trixSelectionChange(e, editor);"
-                     trix-focus="trixFocus(e, editor);"
-                     trix-blur="trixBlur(e, editor);"
-                     trix-file-accept="trixFileAccept(e, editor);"
-                     trix-attachment-add="trixAttachmentAdd(e, editor);"
-                     trix-attachment-remove="trixAttachmentRemove(e, editor);"
-                     placeholder="Write something.."></trix-editor>
-    </div>
-</div>
-<div ng-if="ctrl.staticProperty.properties.valueSpecification" style="margin-top:20px;">
-    <div layout="column">
-        <span>{{ctrl.staticProperty.properties.description}}</span>
-        <md-slider md-discrete flex min="{{ctrl.staticProperty.properties.valueSpecification.minValue}}"
-                   max="{{ctrl.staticProperty.properties.valueSpecification.maxValue}}"
-                   step="{{ctrl.staticProperty.properties.valueSpecification.step}}"
-                   ng-model="ctrl.staticProperty.properties.value">
-        </md-slider>
-        <md-input-container flex="100">
-            <input name="{{ctrl.staticProperty.properties.internalName}}"
-                   ng-model="ctrl.staticProperty.properties.value" ng-blur="ctrl.notifyListeners($event)" >
-        </md-input-container>
-    </div>
-</div>
-<div ng-if="!ctrl.staticProperty.properties.valueSpecification && ctrl.staticProperty.properties.mapsTo"
-     style="margin-top:20px;">
-    <div layout="column">
-        <div ng-if="!ctrl.selectedEventProperty.properties.valueSpecification" flex="100" layout="column">
-            <md-input-container>
-                <label>{{ctrl.staticProperty.properties.description}}</label>
-                <input name="{{ctrl.staticProperty.properties.internalName}}"
-                       ng-model="ctrl.staticProperty.properties.value" text-validator="ctrl.staticProperty"  ng-blur="ctrl.notifyListeners($event)" required/>
-                <span ng-show="ctrl.customizeForm[ctrl.staticProperty.properties.internalName].$touched && ctrl.customizeForm[ctrl.staticProperty.properties.internalName].$error.textValidator">{{ctrl.getFriendlyDatatype()}}</span>
-            </md-input-container>
-        </div>
-        <div ng-if="ctrl.selectedEventProperty.properties.valueSpecification.type=='org.apache.streampipes.model.schema.QuantitativeValue'">
-            <md-slider md-discrete flex
-                       min="{{ctrl.selectedEventProperty.properties.valueSpecification.properties.minValue}}"
-                       max="{{ctrl.selectedEventProperty.properties.valueSpecification.properties.maxValue}}"
-                       step="{{ctrl.selectedEventProperty.properties.valueSpecification.properties.step}}"
-                       ng-model="ctrl.staticProperty.properties.value">
-            </md-slider>
-            <md-input-container flex="100">
-                <input name="{{ctrl.staticProperty.properties.internalName}}"
-                       ng-model="ctrl.staticProperty.properties.value" ng-blur="ctrl.notifyListeners($event)">
-            </md-input-container>
-        </div>
-        <div ng-if="ctrl.selectedEventProperty.properties.valueSpecification.type=='org.apache.streampipes.model.schema.Enumeration'">
-            <md-autocomplete md-no-cache="true" md-selected-item="ctrl.staticProperty.properties.value"
-                             md-items="item in ctrl.selectedEventProperty.properties.valueSpecification.properties.runtimeValues"
-                             md-search-text="ctrl.searchText" md-item-text="item" placeholder="Enter value">
-                <span>{{ item }}</span>
-            </md-autocomplete>
-        </div>
-    </div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/group/group.component.ts b/ui/src/app/editor/components/group/group.component.ts
deleted file mode 100644
index f2beae7..0000000
--- a/ui/src/app/editor/components/group/group.component.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {GroupController} from "./group.controller";
-
-declare const require: any;
-
-export let GroupComponent = {
-    template: require('./group.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        inputStreams : "=",
-        selectedElement: "=",
-        customizeForm: "="
-    },
-    controller: GroupController,
-    controllerAs: 'ctrl'
-
-};
diff --git a/ui/src/app/editor/components/group/group.controller.ts b/ui/src/app/editor/components/group/group.controller.ts
deleted file mode 100644
index 6e0fd76..0000000
--- a/ui/src/app/editor/components/group/group.controller.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class GroupController {
-
-    staticProperty: any;
-    selectedElement: any;
-
-    constructor() {
-    }
-
-    $onInit() {
-        console.log("group");
-        console.log(this.selectedElement);
-        console.log(this.staticProperty);
-    }
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/group/group.tmpl.html b/ui/src/app/editor/components/group/group.tmpl.html
deleted file mode 100644
index 513cb3e..0000000
--- a/ui/src/app/editor/components/group/group.tmpl.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-repeat="staticProperty in ctrl.staticProperty.properties.staticProperties">
-
-    <customize-dialog customize-form="ctrl.customizeForm"
-                      selected-element="ctrl.selectedElement"
-                      static-property="staticProperty"
-                      display-recommended="ctrl.displayRecommended"></customize-dialog>
-
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/mappingnary/mappingnary.component.ts b/ui/src/app/editor/components/mappingnary/mappingnary.component.ts
deleted file mode 100644
index df10b8c..0000000
--- a/ui/src/app/editor/components/mappingnary/mappingnary.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {MappingNaryController} from "./mappingnary.controller";
-
-declare const require: any;
-
-export let MappingNaryComponent = {
-    template: require('./mappingnary.tmpl.html'),
-    bindings: {
-        staticProperty : "=",
-        displayRecommended: "=",
-        selectedElement: "<",
-        restrictedEditMode: "<"
-    },
-    controller: MappingNaryController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/mappingnary/mappingnary.controller.ts b/ui/src/app/editor/components/mappingnary/mappingnary.controller.ts
deleted file mode 100644
index 3507393..0000000
--- a/ui/src/app/editor/components/mappingnary/mappingnary.controller.ts
+++ /dev/null
@@ -1,86 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-
-export class MappingNaryController {
-
-    staticProperty: any;
-    selectedElement: any;
-    availableProperties: any;
-    PropertySelectorService: any;
-    displayRecommended: boolean;
-    $filter: any;
-
-    constructor(PropertySelectorService, $filter) {
-        this.PropertySelectorService = PropertySelectorService;
-        this.$filter = $filter;
-    }
-
-    $onInit() {
-        this.availableProperties = this.PropertySelectorService.makeFlatProperties(this.getProperties(this.findIndex()), this.staticProperty.properties.mapsFromOptions);
-    }
-
-    getProperties(streamIndex) {
-        return this.selectedElement.inputStreams[streamIndex] === undefined ? [] : this.selectedElement.inputStreams[streamIndex].eventSchema.eventProperties;
-    }
-
-    findIndex() {
-        let prefix = this.staticProperty.properties.mapsFromOptions[0].split("::");
-        prefix = prefix[0].replace("s", "");
-        return prefix;
-    }
-
-    toggle(property, staticProperty) {
-        if (this.exists(property, staticProperty)) {
-            this.remove(property, staticProperty);
-        } else {
-            this.add(property, staticProperty);
-        }
-    }
-
-    exists(property, staticProperty) {
-        if (!staticProperty.properties.selectedProperties) return false;
-        return staticProperty.properties.selectedProperties.indexOf(property.properties.runtimeId) > -1;
-    }
-
-    add(property, staticProperty) {
-        if (!staticProperty.properties.selectedProperties) {
-            staticProperty.properties.selectedProperties = [];
-        }
-        staticProperty.properties.selectedProperties.push(property.properties.runtimeId);
-    }
-
-    remove(property, staticProperty) {
-        var index = staticProperty.properties.selectedProperties.indexOf(property.properties.runtimeId);
-        staticProperty.properties.selectedProperties.splice(index, 1);
-    }
-
-    selectAll() {
-        this.staticProperty.properties.selectedProperties = [];
-        let filteredProperties = this.$filter('displayRecommendedFilter')(this.availableProperties,  this.staticProperty.properties.propertyScope, this.displayRecommended);
-        filteredProperties.forEach(property => {
-           this.staticProperty.properties.selectedProperties.push(property.properties.runtimeId);
-        });
-    }
-
-    deselectAll() {
-        this.staticProperty.properties.selectedProperties = [];
-    }
-}
-
-MappingNaryController.$inject=['PropertySelectorService', '$filter']
\ No newline at end of file
diff --git a/ui/src/app/editor/components/mappingnary/mappingnary.tmpl.html b/ui/src/app/editor/components/mappingnary/mappingnary.tmpl.html
deleted file mode 100644
index 3cb491e..0000000
--- a/ui/src/app/editor/components/mappingnary/mappingnary.tmpl.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div flex="100" layout="row" layout-align="start center" style="margin-bottom:15px;">
-    <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.selectAll()" ng-disabled="ctrl.restrictedEditMode">
-        Select all
-    </sp-button>&nbsp;&nbsp;
-    <sp-button sp-button-gray sp-button-small-padding ng-click="ctrl.deselectAll()" ng-disabled="ctrl.restrictedEditMode">
-        Select none
-    </sp-button>
-</div>
-<div
-        ng-repeat="property in ctrl.availableProperties | displayRecommendedFilter: ctrl.staticProperty.properties.propertyScope:ctrl.displayRecommended">
-    <md-checkbox ng-checked="ctrl.exists(property, ctrl.staticProperty)"
-                 ng-click="ctrl.toggle(property, ctrl.staticProperty)" name="{{property.properties.elementId}}" ng-disabled="ctrl.restrictedEditMode">
-        <div ng-if="property.properties.label"><b>{{property.properties.label}}</b> <i>({{property.properties.description}},
-            field name: {{property.properties.runtimeName}})</i><br/></div>
-        <div ng-if="!property.properties.label"><b>{{property.properties.runtimeName}}</b><br/></div>
-    </md-checkbox>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/mappingunary/mappingunary.component.ts b/ui/src/app/editor/components/mappingunary/mappingunary.component.ts
deleted file mode 100644
index 0b5c9ad..0000000
--- a/ui/src/app/editor/components/mappingunary/mappingunary.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {MappingUnaryController} from "./mappingunary.controller";
-
-declare const require: any;
-
-export let MappingUnaryComponent = {
-    template: require('./mappingunary.tmpl.html'),
-    bindings: {
-        staticProperty : "=",
-        displayRecommended: "=",
-        selectedElement: "=",
-        restrictedEditMode: "<"
-    },
-    controller: MappingUnaryController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/mappingunary/mappingunary.controller.ts b/ui/src/app/editor/components/mappingunary/mappingunary.controller.ts
deleted file mode 100644
index 8a525e8..0000000
--- a/ui/src/app/editor/components/mappingunary/mappingunary.controller.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {PropertySelectorService} from "../../../services/property-selector.service";
-
-export class MappingUnaryController {
-
-    staticProperty: any;
-    selectedElement: any;
-    availableProperties: any;
-
-    $scope: any;
-    $rootScope: any;
-    PropertySelectorService: PropertySelectorService;
-
-    constructor($scope, $rootScope, PropertySelectorService, private $timeout) {
-        this.$scope = $scope;
-        this.$rootScope = $rootScope;
-        this.PropertySelectorService = PropertySelectorService;
-    }
-
-    $onInit() {
-        this.availableProperties = this.PropertySelectorService.makeFlatProperties(this.getProperties(this.findIndex()), this.staticProperty.properties.mapsFromOptions);
-
-        this.$scope.$watch(() => this.staticProperty.properties.selectedProperty, (newValue, oldValue) => {
-            if (newValue !== oldValue) {
-                this.$rootScope.$emit(this.staticProperty.properties.internalName);
-            }
-        });
-
-        if (!this.staticProperty.properties.selectedProperty) {
-            this.staticProperty.properties.selectedProperty = this.availableProperties[0].properties.runtimeId;
-            this.$timeout(() => {
-                this.$rootScope.$emit(this.staticProperty.properties.internalName);
-            }, 20);
-        }
-    }
-
-    getProperties(streamIndex) {
-        return this.selectedElement.inputStreams[streamIndex] === undefined ? [] : this.selectedElement.inputStreams[streamIndex].eventSchema.eventProperties;
-    }
-
-    findIndex() {
-        let prefix = this.staticProperty.properties.mapsFromOptions[0].split("::");
-        prefix = prefix[0].replace("s", "");
-        return prefix;
-    }
-}
-
-MappingUnaryController.$inject=['$scope', '$rootScope', 'PropertySelectorService', '$timeout'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/mappingunary/mappingunary.tmpl.html b/ui/src/app/editor/components/mappingunary/mappingunary.tmpl.html
deleted file mode 100644
index 4fc870f..0000000
--- a/ui/src/app/editor/components/mappingunary/mappingunary.tmpl.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-select ng-model="ctrl.staticProperty.properties.selectedProperty"
-           placeholder="{{ctrl.staticProperty.properties.description}}" ng-disabled="ctrl.restrictedEditMode">
-    <md-option
-            ng-repeat="property in ctrl.availableProperties | displayRecommendedFilter: ctrl.staticProperty.properties.propertyScope:ctrl.displayRecommended" ng-value="property.properties.runtimeId" ng-selected="property.properties.runtimeId === ctrl.staticProperty.properties.selectedProperty" >
-        <div ng-if="property.properties.label"><b>{{property.properties.label}}</b> <i>({{property.properties.description}}, field name: {{property.properties.niceLabel}})</i><br/></div>
-        <div ng-if="!property.properties.label"> <b>{{property.properties.niceLabel}}</b><br/></div>
-    </md-option>
-</md-select>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/matchingproperty/matchingproperty.component.ts b/ui/src/app/editor/components/matchingproperty/matchingproperty.component.ts
deleted file mode 100644
index 974ee28..0000000
--- a/ui/src/app/editor/components/matchingproperty/matchingproperty.component.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {MatchingPropertyController} from "./matchingproperty.controller";
-
-declare const require: any;
-
-export let MatchingPropertyComponent = {
-    template: require('./matchingproperty.tmpl.html'),
-    bindings: {
-        staticProperty : "="
-    },
-    controller: MatchingPropertyController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/matchingproperty/matchingproperty.controller.ts b/ui/src/app/editor/components/matchingproperty/matchingproperty.controller.ts
deleted file mode 100644
index b5dee7a..0000000
--- a/ui/src/app/editor/components/matchingproperty/matchingproperty.controller.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class MatchingPropertyController {
-    
-    constructor() {
-        
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/matchingproperty/matchingproperty.tmpl.html b/ui/src/app/editor/components/matchingproperty/matchingproperty.tmpl.html
deleted file mode 100644
index d02d39d..0000000
--- a/ui/src/app/editor/components/matchingproperty/matchingproperty.tmpl.html
+++ /dev/null
@@ -1,28 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-select ng-model="ctrl.matchingSelectionLeft[staticProperty.elementId]"  placeholder="Left Stream Property">
-    <md-option ng-repeat="option in ctrl.staticProperty.input.properties.optionLeft" ng-value="option.elementId">
-        <b>{{option.humanDescription}}</b><br/>
-    </md-option>
-</md-select>
-<md-select ng-model="ctrl.matchingSelectionRight[staticProperty.elementId]"  placeholder="Right Stream Property">
-    <md-option ng-repeat="option in ctrl.staticProperty.input.properties.optionRight" ng-value="option.elementId">
-        <b>{{option.humanDescription}}</b><br/>
-    </md-option>
-</md-select>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/multivalue/multiple-value-input.component.ts b/ui/src/app/editor/components/multivalue/multiple-value-input.component.ts
deleted file mode 100644
index 3b6fa39..0000000
--- a/ui/src/app/editor/components/multivalue/multiple-value-input.component.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {MultipleValueInputController} from "./multiple-value-input.controller";
-
-declare const require: any;
-
-export let MultipleValueInputComponent = {
-    template: require('./multiple-value-input.tmpl.html'),
-    bindings: {
-        staticProperty : "="
-    },
-    controller: MultipleValueInputController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/multivalue/multiple-value-input.controller.ts b/ui/src/app/editor/components/multivalue/multiple-value-input.controller.ts
deleted file mode 100644
index af34c20..0000000
--- a/ui/src/app/editor/components/multivalue/multiple-value-input.controller.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class MultipleValueInputController {
-
-    constructor() {
-
-    }
-
-    addTextInputRow(members) {
-        members.push({"input": {"type": "TextInput", "properties": {"description": "", "value": ""}}});
-    }
-
-    removeTextInputRow(members, property) {
-        members.splice(property, 1);
-    }
-
-    addDomainConceptRow(firstMember, members) {
-        var supportedProperties = [];
-        angular.forEach(firstMember.input.properties.supportedProperties, property => {
-            supportedProperties.push({"propertyId": property.propertyId, "value": ""});
-        });
-        members.push({"input": {"type": "DomainConceptInput",
-            "properties": {
-                "elementType": "DOMAIN_CONCEPT",
-                "description": "",
-                "supportedProperties": supportedProperties,
-                "requiredClass": firstMember.input.properties.requiredClass
-            }
-        }
-        });
-    }
-
-    removeDomainConceptRow(members, property) {
-        members.splice(property, 1);
-    }
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/multivalue/multiple-value-input.tmpl.html b/ui/src/app/editor/components/multivalue/multiple-value-input.tmpl.html
deleted file mode 100644
index 948536e..0000000
--- a/ui/src/app/editor/components/multivalue/multiple-value-input.tmpl.html
+++ /dev/null
@@ -1,50 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-if="ctrl.staticProperty.input.properties.members[0].input.type == 'TextInput'">
-	<div ng-repeat = "(index, property) in ctrl.staticProperty.input.properties.members">
-		<div layout="row">
-			<div flex="60">
-				<md-input-container flex> <label>{{property.input.properties.description}}</label>
-					<input name="{{property.input.properties.elementId}}" ng-model="property.input.properties.value"/> 
-				</md-input-container>
-			</div>
-			<div flex="20">
-				<md-button ng-click="ctrl.addTextInputRow(ctrl.staticProperty.input.properties.members)">Add Value</md-button>
-			</div>
-			<div flex="20">
-				<md-button ng-show="index > 0" ng-click="ctrl.removeTextInputRow(ctrl.staticProperty.input.properties.members, property)">Remove</md-button>
-			</div>
-		</div>
-	</div>
-</div>
-<div ng-if="ctrl.staticProperty.input.properties.members[0].input.type == 'DomainConceptInput'">
-	<div ng-repeat = "(index, property) in ctrl.staticProperty.input.properties.members">
-		<div layout="column">
-			<div flex="60">
-				<domain-concept-input static-property="property" auto-complete-static-property="ctrl.staticProperty.input.properties.members[0]"></domain-concept-input>
-			</div>
-			<div flex="20">
-				<md-button ng-click="ctrl.addDomainConceptRow(ctrl.staticProperty.input.properties.members[0], ctrl.staticProperty.input.properties.members)">Add Value</md-button>
-			</div>
-			<div flex="20">
-				<md-button ng-show="index > 0" ng-click="ctrl.removeDomainConceptRow(ctrl.staticProperty.input.properties.members, property)">Remove</md-button>
-			</div>
-		</div>
-	</div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/oneof-remote/oneof-remote.component.ts b/ui/src/app/editor/components/oneof-remote/oneof-remote.component.ts
deleted file mode 100644
index 2591cfe..0000000
--- a/ui/src/app/editor/components/oneof-remote/oneof-remote.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {OneOfRemoteController} from "./oneof-remote.controller";
-
-declare const require: any;
-
-export let OneOfRemoteComponent = {
-    template: require('./oneof-remote.tmpl.html'),
-    bindings: {
-        staticProperty : "=",
-        selectedElement: "="
-    },
-    controller: OneOfRemoteController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/oneof-remote/oneof-remote.controller.ts b/ui/src/app/editor/components/oneof-remote/oneof-remote.controller.ts
deleted file mode 100644
index 630b583..0000000
--- a/ui/src/app/editor/components/oneof-remote/oneof-remote.controller.ts
+++ /dev/null
@@ -1,115 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class OneOfRemoteController {
-
-    RestApi: any;
-    $rootScope: any;
-    $scope: any;
-    staticProperty: any;
-    selectedElement: any;
-    currentlyLinkedProperty: any;
-
-    showOptions: boolean = false;
-
-    dependentStaticProperties: any = new Map();
-    loading: boolean = false;
-
-    constructor(RestApi, $rootScope, $scope) {
-        this.RestApi = RestApi;
-        this.$rootScope = $rootScope;
-        this.$scope = $scope;
-    }
-
-    $onInit() {
-        if (this.staticProperty.properties.options.length == 0) {
-            if ((!this.staticProperty.properties.dependsOn || this.staticProperty.properties.dependsOn.length == 0)) {
-                this.loadOptionsFromRestApi();
-            }
-        } else {
-            this.loadSavedProperty();
-
-        }
-
-        angular.forEach(this.selectedElement.staticProperties, sp => {
-            if (sp.properties.internalName === this.staticProperty.properties.linkedMappingPropertyId) {
-                this.currentlyLinkedProperty = sp.properties.mapsTo;
-            }
-        });
-
-        if (this.staticProperty.properties.dependsOn && this.staticProperty.properties.dependsOn.length > 0 && !this.staticProperty.properties.currentSelection) {
-            angular.forEach(this.staticProperty.properties.dependsOn, dp => {
-                this.dependentStaticProperties.set(dp, false);
-                this.$rootScope.$on(dp, (valid) => {
-                    this.showOptions = false;
-                    this.dependentStaticProperties.set(dp, true);
-                    if (Array.from(this.dependentStaticProperties.values()).every(v => v === true)) {
-                        this.loadOptionsFromRestApi();
-                    }
-                });
-            });
-        }
-
-    }
-
-    loadOptionsFromRestApi() {
-        var resolvableOptionsParameterRequest = {};
-        resolvableOptionsParameterRequest['staticProperties'] = this.selectedElement.staticProperties;
-        resolvableOptionsParameterRequest['inputStreams'] = this.selectedElement.inputStreams;
-        resolvableOptionsParameterRequest['belongsTo'] = this.selectedElement.belongsTo;
-        resolvableOptionsParameterRequest['appId'] = this.selectedElement.appId;
-        resolvableOptionsParameterRequest['runtimeResolvableInternalId'] = this.staticProperty.properties.internalName;
-
-        this.showOptions = false;
-        this.loading = true;
-        this.RestApi.fetchRemoteOptions(resolvableOptionsParameterRequest).then(msg => {
-            let data = msg.data;
-            this.staticProperty.properties.options = data;
-            if (this.staticProperty.properties.options.length > 0) {
-                this.staticProperty.properties.options[0].selected = true;
-            }
-            this.loading = false;
-            this.$rootScope.$emit(this.staticProperty.properties.internalName);
-            this.loadSavedProperty();
-        });
-    }
-
-    toggle() {
-        this.staticProperty.properties.options.forEach(option => {
-            if (option.name === this.staticProperty.properties.currentSelection.name) {
-                option.selected = true;
-            }  else {
-                option.selected = false;
-            }
-        });
-        this.$rootScope.$emit(this.staticProperty.properties.internalName);
-    }
-
-    loadSavedProperty() {
-        angular.forEach(this.staticProperty.properties.options, option => {
-            if (option.selected) {
-                this.staticProperty.properties.currentSelection = option;
-            }
-        });
-        this.showOptions = true;
-    }
-}
-
-OneOfRemoteController.$inject = ['RestApi', '$rootScope', '$scope'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/oneof-remote/oneof-remote.tmpl.html b/ui/src/app/editor/components/oneof-remote/oneof-remote.tmpl.html
deleted file mode 100644
index 081dfec..0000000
--- a/ui/src/app/editor/components/oneof-remote/oneof-remote.tmpl.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-if="ctrl.loading" flex="100" layout="column" layout-align="center center">
-    <md-progress-circular md-mode="indeterminate"></md-progress-circular>
-</div>
-<div ng-if="!ctrl.loading">
-    <div flex="100" layout="column" layout-align="center start" ng-if="ctrl.showOptions">
-        <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.loadOptionsFromRestApi()">
-            <i class="material-icons" style="font-size:18px;">refresh</i>
-            <md-tooltip md-direction="top">
-                Reload
-            </md-tooltip>
-            Reload</sp-button>&nbsp;&nbsp;
-    </div>
-    <md-input-container flex="100" layout="column">
-        <md-radio-group ng-if="ctrl.showOptions" class="md-accent" ng-model="ctrl.staticProperty.properties.currentSelection" ng-change="ctrl.toggle()">
-            <md-radio-button ng-repeat="option in ctrl.staticProperty.properties.options" ng-value="option">
-                <b>{{option.name}}</b><br/>
-            </md-radio-button>
-        </md-radio-group>
-    </md-input-container>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/oneof/oneof.component.ts b/ui/src/app/editor/components/oneof/oneof.component.ts
deleted file mode 100644
index b808ede..0000000
--- a/ui/src/app/editor/components/oneof/oneof.component.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {OneOfController} from "./oneof.controller";
-
-declare const require: any;
-
-export let OneOfComponent = {
-    template: require('./oneof.tmpl.html'),
-    bindings: {
-        staticProperty : "="
-    },
-    controller: OneOfController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/oneof/oneof.controller.ts b/ui/src/app/editor/components/oneof/oneof.controller.ts
deleted file mode 100644
index 1783a93..0000000
--- a/ui/src/app/editor/components/oneof/oneof.controller.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class OneOfController {
-
-    staticProperty: any;
-
-    constructor() { }
-
-    $onInit() {
-        this.staticProperty.properties.options.forEach(o => {
-           if (o.selected) {
-               this.staticProperty.properties.currentSelection = o;
-           }
-        });
-    }
-
-    change(option) {
-        angular.forEach(this.staticProperty.properties.options, function (o) {
-            if (o.elementId == option.elementId) {
-                o.selected = true;
-            } else {
-                o.selected = false;
-            }
-        });
-    }
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/oneof/oneof.tmpl.html b/ui/src/app/editor/components/oneof/oneof.tmpl.html
deleted file mode 100644
index 9ff1612..0000000
--- a/ui/src/app/editor/components/oneof/oneof.tmpl.html
+++ /dev/null
@@ -1,25 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-input-container flex="100" layout="column">
-    <md-radio-group ng-change="ctrl.change(ctrl.staticProperty.properties.currentSelection)" required class="md-accent" name="{{ctrl.staticProperty.properties.elementId}}" ng-model="ctrl.staticProperty.properties.currentSelection">
-        <md-radio-button ng-repeat="option in ctrl.staticProperty.properties.options" ng-checked="option.selected" ng-value="option">
-            <b>{{option.name}}</b><br/>
-        </md-radio-button>
-    </md-radio-group>
-</md-input-container>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/output-strategy/base/BaseOutputStrategy.ts b/ui/src/app/editor/components/output-strategy/base/BaseOutputStrategy.ts
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/base/BaseOutputStrategy.ts
rename to ui/src/app/editor/components/output-strategy/base/BaseOutputStrategy.ts
diff --git a/ui/src/app/editor-v2/components/output-strategy/custom-output/custom-output-strategy.component.html b/ui/src/app/editor/components/output-strategy/custom-output/custom-output-strategy.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/custom-output/custom-output-strategy.component.html
rename to ui/src/app/editor/components/output-strategy/custom-output/custom-output-strategy.component.html
diff --git a/ui/src/app/editor-v2/components/output-strategy/custom-output/custom-output-strategy.component.scss b/ui/src/app/editor/components/output-strategy/custom-output/custom-output-strategy.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/custom-output/custom-output-strategy.component.scss
rename to ui/src/app/editor/components/output-strategy/custom-output/custom-output-strategy.component.scss
diff --git a/ui/src/app/editor-v2/components/output-strategy/custom-output/custom-output-strategy.component.ts b/ui/src/app/editor/components/output-strategy/custom-output/custom-output-strategy.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/custom-output/custom-output-strategy.component.ts
rename to ui/src/app/editor/components/output-strategy/custom-output/custom-output-strategy.component.ts
diff --git a/ui/src/app/editor-v2/components/output-strategy/output-strategy.component.html b/ui/src/app/editor/components/output-strategy/output-strategy.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/output-strategy.component.html
rename to ui/src/app/editor/components/output-strategy/output-strategy.component.html
diff --git a/ui/src/app/editor-v2/components/output-strategy/output-strategy.component.scss b/ui/src/app/editor/components/output-strategy/output-strategy.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/output-strategy.component.scss
rename to ui/src/app/editor/components/output-strategy/output-strategy.component.scss
diff --git a/ui/src/app/editor-v2/components/output-strategy/output-strategy.component.ts b/ui/src/app/editor/components/output-strategy/output-strategy.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/output-strategy.component.ts
rename to ui/src/app/editor/components/output-strategy/output-strategy.component.ts
diff --git a/ui/src/app/editor-v2/components/output-strategy/property-selection/property-selection.component.html b/ui/src/app/editor/components/output-strategy/property-selection/property-selection.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/property-selection/property-selection.component.html
rename to ui/src/app/editor/components/output-strategy/property-selection/property-selection.component.html
diff --git a/ui/src/app/editor-v2/components/output-strategy/property-selection/property-selection.component.scss b/ui/src/app/editor/components/output-strategy/property-selection/property-selection.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/property-selection/property-selection.component.scss
rename to ui/src/app/editor/components/output-strategy/property-selection/property-selection.component.scss
diff --git a/ui/src/app/editor-v2/components/output-strategy/property-selection/property-selection.component.ts b/ui/src/app/editor/components/output-strategy/property-selection/property-selection.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/property-selection/property-selection.component.ts
rename to ui/src/app/editor/components/output-strategy/property-selection/property-selection.component.ts
diff --git a/ui/src/app/editor-v2/components/output-strategy/user-defined-output/user-defined-output.component.html b/ui/src/app/editor/components/output-strategy/user-defined-output/user-defined-output.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/user-defined-output/user-defined-output.component.html
rename to ui/src/app/editor/components/output-strategy/user-defined-output/user-defined-output.component.html
diff --git a/ui/src/app/editor-v2/components/output-strategy/user-defined-output/user-defined-output.component.scss b/ui/src/app/editor/components/output-strategy/user-defined-output/user-defined-output.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/user-defined-output/user-defined-output.component.scss
rename to ui/src/app/editor/components/output-strategy/user-defined-output/user-defined-output.component.scss
diff --git a/ui/src/app/editor-v2/components/output-strategy/user-defined-output/user-defined-output.component.ts b/ui/src/app/editor/components/output-strategy/user-defined-output/user-defined-output.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/components/output-strategy/user-defined-output/user-defined-output.component.ts
rename to ui/src/app/editor/components/output-strategy/user-defined-output/user-defined-output.component.ts
diff --git a/ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.html b/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.html
rename to ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.html
diff --git a/ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.scss b/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-assembly/pipeline-assembly.component.scss
rename to ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.scss
diff --git a/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.ts b/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.ts
index 9161eb5..709d512 100644
--- a/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.ts
+++ b/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.component.ts
@@ -16,17 +16,230 @@
  *
  */
 
-import {PipelineAssemblyController} from "./pipeline-assembly.controller";
-
-declare const require: any;
-
-export let PipelineAssemblyComponent = {
-    template: require('./pipeline-assembly.tmpl.html'),
-    bindings: {
-        currentModifiedPipelineId: "=",
-        rawPipelineModel : "=",
-        allElements: "="
-    },
-    controller: PipelineAssemblyController,
-    controllerAs: 'ctrl'
-};
+import {Component, Input, OnInit,} from "@angular/core";
+import {JsplumbBridge} from "../../services/jsplumb-bridge.service";
+import {PipelinePositioningService} from "../../services/pipeline-positioning.service";
+import {PipelineValidationService} from "../../services/pipeline-validation.service";
+import {JsplumbService} from "../../services/jsplumb.service";
+import {ShepherdService} from "../../../services/tour/shepherd.service";
+import {PipelineElementConfig, PipelineElementUnion} from "../../model/editor.model";
+import {ObjectProvider} from "../../services/object-provider.service";
+import {PanelType} from "../../../core-ui/dialog/base-dialog/base-dialog.model";
+import {SavePipelineComponent} from "../../dialog/save-pipeline/save-pipeline.component";
+import {DialogService} from "../../../core-ui/dialog/base-dialog/base-dialog.service";
+import {ConfirmDialogComponent} from "../../../core-ui/dialog/confirm-dialog/confirm-dialog.component";
+import {MatDialog} from "@angular/material/dialog";
+import {EditorService} from "../../services/editor.service";
+import {PipelineService} from "../../../platform-services/apis/pipeline.service";
+
+
+@Component({
+    selector: 'pipeline-assembly',
+    templateUrl: './pipeline-assembly.component.html',
+    styleUrls: ['./pipeline-assembly.component.scss']
+})
+export class PipelineAssemblyComponent implements OnInit {
+
+    PipelineEditorService: any;
+    DialogBuilder: any;
+    currentMouseOverElement: any;
+    currentZoomLevel: any;
+    preview: any;
+
+    @Input()
+    rawPipelineModel: PipelineElementConfig[];
+    selectMode: any;
+    currentPipelineName: any;
+    currentPipelineDescription: any;
+
+    @Input()
+    currentModifiedPipelineId: any;
+
+    @Input()
+    allElements: PipelineElementUnion[];
+
+    errorMessagesDisplayed: any = false;
+
+    pipelineValid: boolean = false;
+
+    pipelineCacheRunning: boolean = false;
+    pipelineCached: boolean = false;
+
+
+    constructor(private JsplumbBridge: JsplumbBridge,
+                private PipelinePositioningService: PipelinePositioningService,
+                private ObjectProvider: ObjectProvider,
+                public EditorService: EditorService,
+                public PipelineValidationService: PipelineValidationService,
+                private PipelineService: PipelineService,
+                private JsplumbService: JsplumbService,
+                private ShepherdService: ShepherdService,
+                private dialogService: DialogService,
+                private dialog: MatDialog) {
+
+        this.selectMode = true;
+        this.currentZoomLevel = 1;
+
+    }
+
+    ngOnInit(): void {
+        if (this.currentModifiedPipelineId) {
+            this.displayPipelineById();
+        } else {
+            this.checkAndDisplayCachedPipeline();
+        }
+
+        // this.$rootScope.$on("pipeline.validate", () => {
+        //     this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
+        // });
+    }
+
+    ngAfterViewInit() {
+        ($("#assembly") as any).panzoom({
+            disablePan: true,
+            increment: 0.25,
+            minScale: 0.5,
+            maxScale: 1.5,
+            contain: 'invert'
+        });
+
+        $("#assembly").on('panzoomzoom', (e, panzoom, scale) => {
+            this.currentZoomLevel = scale;
+            this.JsplumbBridge.setZoom(scale);
+            this.JsplumbBridge.repaintEverything();
+        });
+    }
+
+    autoLayout() {
+        this.PipelinePositioningService.layoutGraph("#assembly", "span[id^='jsplumb']", 110, false);
+        this.JsplumbBridge.repaintEverything();
+    }
+
+    toggleSelectMode() {
+        if (this.selectMode) {
+            ($("#assembly") as any).panzoom("option", "disablePan", false);
+            this.selectMode = false;
+        }
+        else {
+            ($("#assembly") as any).panzoom("option", "disablePan", true);
+            this.selectMode = true;
+        }
+    }
+
+    zoomOut() {
+        this.doZoom(true);
+    }
+
+    zoomIn() {
+        this.doZoom(false);
+    }
+
+    doZoom(zoomOut) {
+        ($("#assembly") as any).panzoom("zoom", zoomOut);
+    }
+
+    showClearAssemblyConfirmDialog(event: any) {
+        let dialogRef = this.dialog.open(ConfirmDialogComponent, {
+            width: '500px',
+            data: {
+                "title": "Do you really want to delete the current pipeline?",
+                "subtitle": "This cannot be undone.",
+                "cancelTitle": "No",
+                "okTitle": "Yes",
+                "confirmAndCancel": true
+            },
+        });
+        dialogRef.afterClosed().subscribe(ev => {
+            if (ev) {
+                if (this.currentModifiedPipelineId) {
+                    this.currentModifiedPipelineId = undefined;
+                }
+                this.clearAssembly();
+                this.EditorService.makePipelineAssemblyEmpty(true);
+            }
+        });
+    };
+
+    /**
+     * clears the Assembly of all elements
+     */
+    clearAssembly() {
+        //$('#assembly').children().not('#clear, #submit').remove();
+        this.JsplumbBridge.deleteEveryEndpoint();
+        this.rawPipelineModel = [];
+        ($("#assembly") as any).panzoom("reset", {
+            disablePan: true,
+            increment: 0.25,
+            minScale: 0.5,
+            maxScale: 1.5,
+            contain: 'invert'
+        });
+        this.currentZoomLevel = 1;
+        this.JsplumbBridge.setZoom(this.currentZoomLevel);
+        this.JsplumbBridge.repaintEverything();
+        this.EditorService.removePipelineFromCache().subscribe(msg => {
+            this.pipelineCached = false;
+            this.pipelineCacheRunning = false;
+        });
+    };
+
+    /**
+     * Sends the pipeline to the server
+     */
+    submit() {
+        var pipeline = this.ObjectProvider.makeFinalPipeline(this.rawPipelineModel);
+
+        pipeline.name = this.currentPipelineName;
+        pipeline.description = this.currentPipelineDescription;
+        if (this.currentModifiedPipelineId) {
+            pipeline._id = this.currentModifiedPipelineId;
+        }
+
+        const dialogRef = this.dialogService.open(SavePipelineComponent,{
+            panelType: PanelType.SLIDE_IN_PANEL,
+            title: "Save pipeline",
+            data: {
+                "pipeline": pipeline,
+                "currentModifiedPipelineId": this.currentModifiedPipelineId
+            }
+        });
+    }
+
+    checkAndDisplayCachedPipeline() {
+        this.EditorService.getCachedPipeline().subscribe(msg => {
+            if (msg) {
+                this.rawPipelineModel = msg;
+                this.displayPipelineInEditor(true);
+            }
+        });
+    }
+
+    displayPipelineById() {
+        this.PipelineService.getPipelineById(this.currentModifiedPipelineId)
+            .subscribe((msg) => {
+                let pipeline = msg;
+                this.currentPipelineName = pipeline.name;
+                this.currentPipelineDescription = pipeline.description;
+                this.rawPipelineModel = this.JsplumbService.makeRawPipeline(pipeline, false);
+                console.log(this.rawPipelineModel);
+                this.displayPipelineInEditor(true);
+            });
+    };
+
+    displayPipelineInEditor(autoLayout) {
+        setTimeout(() => {
+            this.PipelinePositioningService.displayPipeline(this.rawPipelineModel, "#assembly", false, autoLayout);
+            this.EditorService.makePipelineAssemblyEmpty(false);
+            this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
+        });
+    }
+
+    toggleErrorMessagesDisplayed() {
+        this.errorMessagesDisplayed = !(this.errorMessagesDisplayed);
+    }
+
+    isPipelineAssemblyEmpty() {
+        return this.rawPipelineModel.length === 0 || this.rawPipelineModel.every(pe => pe.settings.disabled);
+    }
+
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.controller.ts b/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.controller.ts
deleted file mode 100644
index 6153625..0000000
--- a/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.controller.ts
+++ /dev/null
@@ -1,246 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {PipelineValidationService} from "../../../editor-v2/services/pipeline-validation.service";
-import {RestApi} from "../../../services/rest-api.service";
-
-export class PipelineAssemblyController {
-
-    $timeout: any;
-    $state: any;
-    JsplumbService: any;
-    PipelineEditorService: any;
-    JsplumbBridge: any;
-    ObjectProvider: any;
-    DialogBuilder: any;
-    EditorDialogManager: any;
-    currentMouseOverElement: any;
-    currentZoomLevel: any;
-    preview: any;
-    rawPipelineModel: any;
-    PipelinePositioningService: any;
-    PipelineValidationService: PipelineValidationService;
-    RestApi: RestApi;
-    $rootScope: any;
-
-    selectMode: any;
-    currentPipelineName: any;
-    currentPipelineDescription: any;
-    currentModifiedPipelineId: any;
-    TransitionService: any;
-    ShepherdService: any;
-    errorMessagesDisplayed: any = false;
-
-    pipelineValid: boolean = false;
-
-    pipelineCacheRunning: boolean = false;
-    pipelineCached: boolean = false;
-
-    constructor($rootScope,
-                JsplumbBridge,
-                PipelinePositioningService,
-                EditorDialogManager,
-                PipelineValidationService,
-                ObjectProvider,
-                RestApi,
-                JsplumbService,
-                $timeout,
-                $state,
-                TransitionService,
-                ShepherdService) {
-        this.JsplumbBridge = JsplumbBridge;
-        this.PipelinePositioningService = PipelinePositioningService;
-        this.EditorDialogManager = EditorDialogManager;
-        this.PipelineValidationService = PipelineValidationService;
-        this.ObjectProvider = ObjectProvider;
-        this.RestApi = RestApi;
-        this.JsplumbService = JsplumbService;
-        this.$timeout = $timeout;
-        this.$state = $state;
-        this.TransitionService = TransitionService;
-        this.ShepherdService = ShepherdService;
-        this.$rootScope = $rootScope;
-
-        this.selectMode = true;
-        this.currentZoomLevel = 1;
-
-        ($("#assembly") as any).panzoom({
-            disablePan: true,
-            increment: 0.25,
-            minScale: 0.5,
-            maxScale: 1.5,
-            contain: 'invert'
-        });
-
-        $("#assembly").on('panzoomzoom', (e, panzoom, scale) => {
-            this.currentZoomLevel = scale;
-            JsplumbBridge.setZoom(scale);
-            JsplumbBridge.repaintEverything();
-        });
-    }
-
-    $onInit() {
-        if (this.currentModifiedPipelineId) {
-            this.displayPipelineById();
-        } else {
-            this.checkAndDisplayCachedPipeline();
-        }
-
-        this.$rootScope.$on("pipeline.validate", () => {
-            this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
-        });
-    }
-
-    autoLayout() {
-        this.PipelinePositioningService.layoutGraph("#assembly", "span[id^='jsplumb']", 110, false);
-        this.JsplumbBridge.repaintEverything();
-    }
-
-    toggleSelectMode() {
-        if (this.selectMode) {
-            ($("#assembly") as any).panzoom("option", "disablePan", false);
-            ($("#assembly") as any).selectable("disable");
-            this.selectMode = false;
-        }
-        else {
-            ($("#assembly") as any).panzoom("option", "disablePan", true);
-            ($("#assembly") as any).selectable("enable");
-            this.selectMode = true;
-        }
-    }
-
-    zoomOut() {
-        this.doZoom(true);
-    }
-
-    zoomIn() {
-        this.doZoom(false);
-    }
-
-    doZoom(zoomOut) {
-        ($("#assembly") as any).panzoom("zoom", zoomOut);
-    }
-
-    showClearAssemblyConfirmDialog(ev) {
-        this.EditorDialogManager.showClearAssemblyDialog(ev).then(() => {
-            if (this.currentModifiedPipelineId) {
-                this.currentModifiedPipelineId = undefined;
-            }
-            this.clearAssembly();
-            this.TransitionService.makePipelineAssemblyEmpty(true);
-
-        }, function () {
-        });
-    };
-
-    /**
-     * clears the Assembly of all elements
-     */
-    clearAssembly() {
-        //$('#assembly').children().not('#clear, #submit').remove();
-        this.JsplumbBridge.deleteEveryEndpoint();
-        this.rawPipelineModel = [];
-        ($("#assembly") as any).panzoom("reset", {
-            disablePan: true,
-            increment: 0.25,
-            minScale: 0.5,
-            maxScale: 1.5,
-            contain: 'invert'
-        });
-        this.currentZoomLevel = 1;
-        this.JsplumbBridge.setZoom(this.currentZoomLevel);
-        this.JsplumbBridge.repaintEverything();
-        this.RestApi.removePipelineFromCache().then(msg => {
-            this.pipelineCached = false;
-            this.pipelineCacheRunning = false;
-        });
-    };
-
-    /**
-     * Sends the pipeline to the server
-     */
-    submit() {
-        var pipeline = this.ObjectProvider.makeFinalPipeline(this.rawPipelineModel);
-
-        pipeline.name = this.currentPipelineName;
-        pipeline.description = this.currentPipelineDescription;
-        if (this.currentModifiedPipelineId) {
-            pipeline._id = this.currentModifiedPipelineId;
-        }
-
-        this.openPipelineNameModal(pipeline, (!!this.currentModifiedPipelineId));
-    }
-
-
-    openPipelineNameModal(pipeline, modificationMode) {
-        this.EditorDialogManager.showSavePipelineDialog(pipeline, modificationMode);
-    }
-
-    checkAndDisplayCachedPipeline() {
-        this.RestApi.getCachedPipeline().then(msg => {
-            if (msg.data !== "") {
-                this.rawPipelineModel = msg.data;
-                this.$timeout(() => {
-                    this.displayPipelineInEditor(true);
-                }, 100);
-            }
-        });
-    }
-
-    displayPipelineById() {
-        this.RestApi.getPipelineById(this.currentModifiedPipelineId)
-            .then((msg) => {
-                let pipeline = msg.data;
-                this.currentPipelineName = pipeline.name;
-                this.currentPipelineDescription = pipeline.description;
-                this.rawPipelineModel = this.JsplumbService.makeRawPipeline(pipeline, false);
-                this.$timeout(() => {
-                    this.displayPipelineInEditor(true);
-                });
-            });
-    };
-
-    displayPipelineInEditor(autoLayout) {
-        this.PipelinePositioningService.displayPipeline(this.rawPipelineModel, "#assembly", false, autoLayout);
-        this.TransitionService.makePipelineAssemblyEmpty(false);
-        this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
-    }
-
-    toggleErrorMessagesDisplayed() {
-        this.errorMessagesDisplayed = !(this.errorMessagesDisplayed);
-    }
-
-    isPipelineAssemblyEmpty() {
-        return this.rawPipelineModel.length === 0 || this.rawPipelineModel.every(pe => pe.settings.disabled);
-    }
-
-}
-
-PipelineAssemblyController.$inject = [
-    '$rootScope',
-    'JsplumbBridge',
-    'PipelinePositioningService',
-    'EditorDialogManager',
-    'PipelineValidationService',
-    'ObjectProvider',
-    'RestApi',
-    'JsplumbService',
-    '$timeout',
-    '$state',
-    'TransitionService',
-    'ShepherdService'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.tmpl.html b/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.tmpl.html
deleted file mode 100644
index 5259798..0000000
--- a/ui/src/app/editor/components/pipeline-assembly/pipeline-assembly.tmpl.html
+++ /dev/null
@@ -1,118 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div>
-    <div class="assemblyOptions sp-blue-bg">
-        <div flex="100" layout="row" layout-align="start center">
-            <md-button style="display:flex;align-items:center;" class="md-button settings-bar-icon-button"
-            ng-disabled="!ctrl.pipelineValid"
-                       ng-click="ctrl.submit()" type="submit">
-                <md-tooltip md-direction="top">
-                    Save Pipeline
-                </md-tooltip>
-                <div layout="row" layout-align="center center"><i class="material-icons">save</i>&nbsp;Save
-                pipeline</div>
-            </md-button>
-            <md-button class="md-icon-button settings-bar-icon-button"
-                       ng-disabled="!ctrl.selectMode"
-                       ng-click="ctrl.toggleSelectMode()">
-                <md-tooltip md-direction="top">
-                    Pan
-                </md-tooltip>
-                <i class="material-icons">open_with</i>
-            </md-button>
-            <md-button class="md-icon-button settings-bar-icon-button" ng-disabled="ctrl.selectMode"
-                       ng-click="ctrl.toggleSelectMode()">
-                <i class="material-icons">mode_edit</i>
-                <md-tooltip md-direction="top">
-                    Select
-                </md-tooltip>
-            </md-button>
-            <md-button class="md-icon-button settings-bar-icon-button" ng-disabled="ctrl.currentZoomLevel == 1"
-                       ng-click="ctrl.zoomIn()">
-                <i class="material-icons">zoom_in</i>
-                <md-tooltip md-direction="top">
-                    Zoom In
-                </md-tooltip>
-            </md-button>
-            <md-button class="md-icon-button settings-bar-icon-button" ng-disabled="ctrl.currentZoomLevel == 0.5"
-                       ng-click="ctrl.zoomOut()">
-                <i class="material-icons">zoom_out</i>
-                <md-tooltip md-direction="top">
-                    Zoom Out
-                </md-tooltip>
-            </md-button>
-            <md-button class="md-icon-button settings-bar-icon-button" ng-click="ctrl.autoLayout()">
-                <i class="material-icons">settings_overscan</i>
-                <md-tooltip md-direction="top">
-                    Auto Layout
-                </md-tooltip>
-            </md-button>
-            <div class="pipeline-cache-block">
-                <div ng-if="ctrl.pipelineCached">All pipeline modifications saved.</div>
-                <div ng-if="ctrl.pipelineCacheRunning"><md-progress-circular
-                        md-mode="indeterminate" class="pipeline-cache-progress"
-                        md-diameter="10"></md-progress-circular>&nbsp;Saving pipeline
-                    modifications</div>
-            </div>
-            <span flex></span>
-            <div style="position:relative;">
-            <div ng-if="!ctrl.isPipelineAssemblyEmpty()" class="pipeline-validation-summary {{ctrl.PipelineValidationService.errorMessages.length > 0 ? 'pipeline-validation-summary-error' : ''}}" ng-click="ctrl.toggleErrorMessagesDisplayed()">
-                <div layout="row" layout-align="center center">
-                    <div layout="row" layout-align="start center">
-                        <i class="material-icons" ng-if="ctrl.PipelineValidationService.errorMessages.length > 0">notifications</i>
-                        <i class="material-icons" ng-if="ctrl.PipelineValidationService.errorMessages.length === 0">done</i>
-                    </div>
-                    <div>
-                        <span ng-if="ctrl.PipelineValidationService.errorMessages.length === 0">Pipeline ok</span>
-                        <span ng-if="ctrl.PipelineValidationService.errorMessages.length > 0">{{ctrl.PipelineValidationService.errorMessages.length}} {{ctrl.PipelineValidationService.errorMessages.length > 1 ? 'hints' : 'hint'}}</span>
-                    </div>
-                </div>
-            </div>
-                <div class="editor-error-notifications" ng-if="ctrl.PipelineValidationService.errorMessages.length > 0 && ctrl.errorMessagesDisplayed">
-                    <h5 style="color:darkred"><b>{{ctrl.PipelineValidationService.errorMessages.length}} {{ctrl.PipelineValidationService.errorMessages.length == 1 ? "error" : "errors"}} found.</b></h5>
-                    <hr/>
-                    <div ng-repeat="errorMessage in ctrl.PipelineValidationService.errorMessages">
-                        <p>
-                            <b>{{errorMessage.title}}</b>
-                            <div>{{errorMessage.content}}</div>
-                        </p>
-                        <hr/>
-                    </div>
-                </div>
-            </div>
-            <md-button class="md-icon-button" ng-click="ctrl.showClearAssemblyConfirmDialog($event)">
-                <i class="material-icons">clear</i>
-                <md-tooltip md-direction="top">
-                    Clear Assembly Area
-                </md-tooltip>
-            </md-button>
-        </div>
-    </div>
-    <div id="outerAssemblyArea" class="outerAssembly sp-blue-border-nopadding">
-        <div id="assembly" class="canvas">
-            <pipeline pipeline-valid="ctrl.pipelineValid"
-                      canvas-id="assembly"
-                      raw-pipeline-model="ctrl.rawPipelineModel"
-                      all-elements="ctrl.allElements"
-                      preview="false"
-                      pipeline-cached="ctrl.pipelineCached"
-                      pipeline-cache-running="ctrl.pipelineCacheRunning"></pipeline>
-        </div>
-    </div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.html b/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.html
rename to ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.html
diff --git a/ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.scss b/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-documentation/pipeline-element-documentation.component.scss
rename to ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.scss
diff --git a/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.ts b/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.ts
index 01eb01c..42271ce 100644
--- a/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.ts
+++ b/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.component.ts
@@ -16,16 +16,37 @@
  *
  */
 
-import {PipelineElementDocumentationController} from "./pipeline-element-documentation.controller";
-
-declare const require: any;
-
-export let PipelineElementDocumentationComponent = {
-    template: require('./pipeline-element-documentation.tmpl.html'),
-    bindings: {
-        appId: "=",
-        useStyling: "="
-    },
-    controller: PipelineElementDocumentationController,
-    controllerAs: 'ctrl'
-};
+import {Component, Input, OnInit} from "@angular/core";
+import {PipelineElementService} from "../../../platform-services/apis/pipeline-element.service";
+
+@Component({
+  selector: 'pipeline-element-documentation',
+  templateUrl: './pipeline-element-documentation.component.html',
+  styleUrls: ['./pipeline-element-documentation.component.scss']
+})
+export class PipelineElementDocumentationComponent implements OnInit {
+
+  @Input()
+  appId: string;
+
+  @Input()
+  useStyling: boolean;
+
+  documentationMarkdown: any;
+  error: any;
+
+  constructor(private PipelineElementService: PipelineElementService) {
+
+  }
+
+  ngOnInit(): void {
+    this.PipelineElementService.getDocumentation(this.appId).subscribe(msg => {
+      this.error = false;
+      this.documentationMarkdown = msg;
+    }, error => {
+      this.error = true;
+    });
+  }
+
+
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.controller.ts b/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.controller.ts
deleted file mode 100644
index 55c9bf1..0000000
--- a/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.controller.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-
-
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class PipelineElementDocumentationController {
-
-    RestApi: any;
-    appId: any;
-    documentationMarkdown: any;
-    error: any;
-
-    constructor(RestApi) {
-        this.RestApi = RestApi;
-    }
-
-    $onInit() {
-        this.RestApi.getDocumentation(this.appId).then(msg => {
-            this.error = false;
-            this.documentationMarkdown = msg.data;
-        }, error => {
-            this.error = true;
-        });
-    }
-
-}
-
-PipelineElementDocumentationController.$inject = ['RestApi'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.tmpl.html b/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.tmpl.html
deleted file mode 100644
index 8329dad..0000000
--- a/ui/src/app/editor/components/pipeline-element-documentation/pipeline-element-documentation.tmpl.html
+++ /dev/null
@@ -1,24 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<p markdown-to-html="ctrl.documentationMarkdown" ng-if="ctrl.documentationMarkdown && !ctrl.error" ng-class="ctrl.useStyling ? 'note' : ''">
-
-</p>
-<p ng-if="ctrl.error" ng-class="ctrl.useStyling ? 'note' : ''">
-    (no documentation available)
-</p>
diff --git a/ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.html b/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.html
rename to ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.html
diff --git a/ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.scss b/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.scss
rename to ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.scss
diff --git a/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts b/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts
index 02195cf..21dc89d 100644
--- a/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts
+++ b/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.component.ts
@@ -16,17 +16,156 @@
  *
  */
 
-import {PipelineElementIconStandController} from "./pipeline-element-icon-stand.controller";
-
-declare const require: any;
-
-export let PipelineElementIconStandComponent = {
-    template: require('./pipeline-element-icon-stand.tmpl.html'),
-    bindings: {
-       currentElements: "=",
-       activeType: "=",
-       elementFilter: "="
-    },
-    controller: PipelineElementIconStandController,
-    controllerAs: 'ctrl'
-};
+import {Component, Input, OnInit,} from "@angular/core";
+import {RestApi} from "../../../services/rest-api.service";
+import {PipelineElementType, PipelineElementUnion} from "../../model/editor.model";
+import {PipelineElementTypeUtils} from "../../utils/editor.utils";
+import {EditorService} from "../../services/editor.service";
+import {zip} from "rxjs";
+
+
+@Component({
+    selector: 'pipeline-element-icon-stand',
+    templateUrl: './pipeline-element-icon-stand.component.html',
+    styleUrls: ['./pipeline-element-icon-stand.component.scss']
+})
+export class PipelineElementIconStandComponent implements OnInit {
+
+
+    _currentElements: PipelineElementUnion[];
+
+    currentlyFilteredElements: PipelineElementUnion[];
+
+    elementFilter: string = "";
+    allCategories: any = [];
+    currentCategories: any = [];
+    selectedOptions: any = [];
+
+    _activeType: PipelineElementType;
+    activeCssClass: string;
+
+    currentElementName: string;
+
+    constructor(private RestApi: RestApi,
+                private EditorService: EditorService) {
+
+    }
+
+    ngOnInit(): void {
+        this.loadOptions();
+    }
+
+    ngAfterViewInit() {
+        this.makeDraggable();
+    }
+
+    openHelpDialog(pipelineElement) {
+        this.EditorService.openHelpDialog(pipelineElement);
+    }
+
+    updateMouseOver(elementAppId: string) {
+        this.currentElementName = elementAppId;
+    }
+
+    loadOptions() {
+        zip(this.EditorService.getEpCategories(),
+            this.EditorService.getEpaCategories(),
+            this.EditorService.getEcCategories()).subscribe((results) => {
+                this.allCategories[PipelineElementType.DataStream] = results[0];
+                this.allCategories[PipelineElementType.DataSet] = results[0];
+                this.allCategories[PipelineElementType.DataProcessor] = results[1];
+                this.allCategories[PipelineElementType.DataSink] = results[2];
+                this.currentCategories = this.allCategories[0];
+                this.selectedOptions = [...this.currentCategories];
+            });
+    };
+
+    applyFilter() {
+        this.currentlyFilteredElements = this.currentElements.filter(el => {
+            return this.matchesText(el) && this.matchesCategory(el);
+        })
+        this.makeDraggable();
+    }
+
+    matchesText(el: PipelineElementUnion): boolean {
+        return this.elementFilter === "" || el.name.includes(this.elementFilter);
+    }
+
+    matchesCategory(el: PipelineElementUnion): boolean {
+        return this._activeType === PipelineElementType.DataStream ||
+            this._activeType === PipelineElementType.DataSet ?
+            this.selectedOptions.some(c => el.category.some(cg => c.type === cg)) :
+            this.selectedOptions.some(c => el.category.some(cg => c.code === cg));
+    }
+
+    toggleOption(option) {
+        if (this.optionSelected(option)) {
+            this.selectedOptions.splice(option, 1);
+        } else {
+            this.selectedOptions.push(option);
+        }
+        this.applyFilter();
+    }
+
+    optionSelected(option) {
+        return this._activeType === PipelineElementType.DataStream ||
+        this._activeType === PipelineElementType.DataSet ?
+            this.selectedOptions.map(o => o.type).indexOf(option.type) > -1 :
+            this.selectedOptions.map(o => o.code).indexOf(option.code) > -1;
+    }
+
+    selectAllOptions() {
+        this.selectedOptions = [...this.currentCategories];
+        this.applyFilter();
+    }
+
+    deselectAllOptions() {
+        this.selectedOptions = [];
+        this.applyFilter();
+    }
+
+    @Input()
+    set activeType(value: PipelineElementType) {
+        this._activeType = value;
+        if (this.allCategories.length > 0) {
+            this.currentCategories = this.allCategories[this._activeType];
+            this.selectedOptions = [...this.currentCategories];
+        }
+        this.activeCssClass = this.makeActiveCssClass(value);
+        setTimeout(() => {
+            this.makeDraggable();
+        })
+    };
+
+    @Input()
+    set currentElements(value: PipelineElementUnion[]) {
+        this._currentElements = value;
+        this.currentlyFilteredElements = this._currentElements;
+    }
+
+    get currentElements() {
+        return this._currentElements;
+    }
+
+    makeActiveCssClass(elementType: PipelineElementType): string {
+        return PipelineElementTypeUtils.toCssShortHand(elementType);
+    }
+
+    makeDraggable() {
+       setTimeout(() => {
+           (<any>$('.draggable-icon')).draggable({
+               revert: 'invalid',
+               helper: 'clone',
+               stack: '.draggable-icon',
+               start: function (el, ui) {
+                   ui.helper.appendTo('#content');
+                   $('#outerAssemblyArea').css('border', '3px dashed #39b54a');
+               },
+               stop: function (el, ui) {
+                   $('#outerAssemblyArea').css('border', '3px solid rgb(156, 156, 156)');
+               }
+           });
+       });
+    };
+
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.controller.ts b/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.controller.ts
deleted file mode 100644
index 3f7da65..0000000
--- a/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.controller.ts
+++ /dev/null
@@ -1,110 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-import {RestApi} from "../../../services/rest-api.service";
-import {EditorDialogManager} from "../../../editor-v2/services/editor-dialog-manager.service";
-
-export class PipelineElementIconStandController {
-
-    RestApi: RestApi;
-    availableOptions: any;
-    selectedOptions: any;
-    options: any;
-    activeType: any;
-    currentElementName: any;
-    EditorDialogManager: EditorDialogManager;
-    currentElements: any;
-    $scope: any;
-    elementFilter: string;
-
-    constructor($scope, $rootScope, RestApi: RestApi, EditorDialogManager: EditorDialogManager) {
-        this.RestApi = RestApi;
-        this.availableOptions = [];
-        this.selectedOptions = [];
-        this.options = [];
-        this.EditorDialogManager = EditorDialogManager;
-        this.$scope = $scope;
-    }
-
-    $onInit() {
-        this.loadOptions();
-
-        this.$scope.$watch(() => this.activeType, () => {
-            this.selectAllOptions();
-        });
-    }
-
-    openHelpDialog(pipelineElement) {
-        this.EditorDialogManager.openHelpDialog(pipelineElement);
-    }
-
-    updateMouseOver(elementName) {
-        this.currentElementName = elementName;
-    }
-
-    loadOptions(type?) {
-        this.RestApi.getEpCategories()
-            .then(msg => {
-                let s = msg;
-                this.handleCategoriesSuccess("stream", s);
-                this.handleCategoriesSuccess("set", s);
-            });
-
-        this.RestApi.getEpaCategories()
-            .then(s => this.handleCategoriesSuccess("sepa", s));
-
-        this.RestApi.getEcCategories()
-            .then(s => this.handleCategoriesSuccess("action", s));
-
-    };
-
-    getOptions(type) {
-        this.selectAllOptions();
-        return this.availableOptions[type];
-    }
-
-
-    handleCategoriesSuccess(type, result) {
-        this.availableOptions[type] = result.data;
-        this.selectAllOptions();
-    }
-
-    toggleFilter(option) {
-        this.selectedOptions = [];
-        this.selectedOptions.push(option.type);
-    }
-
-    optionSelected(option) {
-        return this.selectedOptions.indexOf(option.type) > -1;
-    }
-
-    selectAllOptions() {
-        this.selectedOptions = [];
-        angular.forEach(this.availableOptions[this.activeType], o => {
-            this.selectedOptions.push(o.type);
-        });
-    }
-
-    deselectAllOptions() {
-        this.selectedOptions = [];
-    }
-}
-
-PipelineElementIconStandController.$inject = ['$scope', '$rootScope', 'RestApi', 'EditorDialogManager'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.tmpl.html b/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.tmpl.html
deleted file mode 100644
index f6d076e..0000000
--- a/ui/src/app/editor/components/pipeline-element-icon-stand/pipeline-element-icon-stand.tmpl.html
+++ /dev/null
@@ -1,87 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div class="editorIconStandOptions" style="padding:0px;">
-    <div flex="100" layout="row" layout-align="start start" style="padding-top:2px;padding-left:10px;">
-
-        <div layout-align="start center" layout="row">
-            <div layout="row" style="margin-right: 5px">
-                <md-icon md-svg-icon="action:ic_search_24px" class="sp-accent"></md-icon>
-                <input type="text" ng-model="ctrl.elementFilter" placeholder="Find Element"
-                       style="background-color:#f6f6f6;border: none;border-bottom: solid 2px rgb(27, 20, 100);">&nbsp;
-            </div>
-            <div layout="row">
-                <md-menu-bar>
-                    <md-menu>
-                        <button ng-click="$mdOpenMenu()" class="sp-accent">
-                            <md-icon md-svg-icon="action:ic_view_list_24px"
-                                     class="sp-accent"></md-icon>
-                            Filter by category
-                        </button>
-                        <md-menu-content>
-                            <md-menu-item class="md-indent">
-                                <md-icon md-svg-icon="action:ic_done_24px"
-                                         class="sp-accent"></md-icon>
-                                <md-button ng-click="ctrl.selectAllOptions()">&nbsp;Select all</md-button>
-                            </md-menu-item>
-                            <md-menu-item class="md-indent">
-                                <md-icon md-svg-icon="content:ic_clear_24px"
-                                         class="sp-accent"></md-icon>
-                                <md-button ng-click="ctrl.deselectAllOptions()">&nbsp;Deselect all</md-button>
-                            </md-menu-item>
-                            <md-menu-divider></md-menu-divider>
-                            <div ng-repeat="option in ctrl.availableOptions[ctrl.activeType] | orderBy: 'label'">
-                                <md-menu-item class="md-indent">
-                                    <md-icon md-svg-icon="action:ic_visibility_24px"
-                                             class="sp-accent"
-                                             ng-if="ctrl.optionSelected(option)"></md-icon>
-                                    <md-icon md-svg-icon="action:ic_visibility_off_24px"
-                                             class="sp-accent"
-                                             ng-if="!ctrl.optionSelected(option)"></md-icon>
-                                    <md-button ng-click="ctrl.toggleFilter(option)">&nbsp;{{option.label}}
-                                    </md-button>
-                                </md-menu-item>
-                            </div>
-                        </md-menu-content>
-                    </md-menu>
-                </md-menu-bar>
-            </div>
-        </div>
-    </div>
-</div>
-<div flex id="editor-icon-stand" class="icon-stand" ng-if="ctrl.currentElements">
-    <!-- selectFilter:ctrl.selectedOptions | -->
-    <span id="{{ element.name }}" ng-mouseover="ctrl.updateMouseOver(element.name)"
-          ng-mouseleave="ctrl.updateMouseOver('')"
-          ng-repeat="element in ctrl.currentElements |  selectFilter:ctrl.selectedOptions | elementNameFilter:ctrl.elementFilter | orderBy: 'name'"
-          my-data-bind class="draggable-icon tt"
-          ng-class="element.type">
-        <span id="container" style="position:relative;display:block;width:80px;height:80px;">
-        <pipeline-element id="pe-icon-stand-{{ element.appId }}" style="margin-left:-3%" icon-stand-size="true" pipeline-element="element"
-                          preview="false"></pipeline-element>
-            <span style="display:block;width:100%;height:100%;position:absolute; top:0; left:0;"
-                  ng-if="ctrl.currentElementName==element.name">
-                <span class="help-button-icon-stand" style="z-index:10"><md-button
-                        ng-click="ctrl.openHelpDialog(element)"
-                        class="md-icon-button"
-                        style="margin:0px;font-size:20px;">?</md-button>
-                </span>
-                </span>
-        </span>
-    </span>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.css b/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.css
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.css
rename to ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.css
diff --git a/ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.html b/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-options/pipeline-element-options.component.html
rename to ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.html
diff --git a/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.ts b/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.ts
index 0ef74a0..ef118e9 100644
--- a/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.ts
+++ b/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.component.ts
@@ -16,22 +16,176 @@
  *
  */
 
-import {PipelineElementOptionsController} from "./pipeline-element-options.controller";
-
-declare const require: any;
-
-export let PipelineElementOptionsComponent = {
-    template: require('./pipeline-element-options.tmpl.html'),
-    bindings: {
-        pipelineElementId: "@",
-        internalId: "@",
-        pipelineElement: "<",
-        allElements: "=",
-        deleteFunction: "=",
-        rawPipelineModel: "=",
-        currentMouseOverElement: "=",
-        pipelineValid: "="
-    },
-    controller: PipelineElementOptionsController,
-    controllerAs: 'ctrl'
-};
+import * as angular from 'angular';
+import {JsplumbBridge} from "../../services/jsplumb-bridge.service";
+import {JsplumbService} from "../../services/jsplumb.service";
+import {PipelineValidationService} from "../../services/pipeline-validation.service";
+import {RestApi} from "../../../services/rest-api.service";
+import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core";
+import {PipelineElementRecommendationService} from "../../services/pipeline-element-recommendation.service";
+import {ObjectProvider} from "../../services/object-provider.service";
+import {
+  InvocablePipelineElementUnion,
+  PipelineElementConfig,
+  PipelineElementUnion
+} from "../../model/editor.model";
+import {SpDataStream, WildcardTopicDefinition} from "../../../core-model/gen/streampipes-model";
+import {EditorService} from "../../services/editor.service";
+import {PanelType} from "../../../core-ui/dialog/base-dialog/base-dialog.model";
+import {DialogService} from "../../../core-ui/dialog/base-dialog/base-dialog.service";
+import {CompatibleElementsComponent} from "../../dialog/compatible-elements/compatible-elements.component";
+import {Tuple2} from "../../../core-model/base/Tuple2";
+
+@Component({
+  selector: 'pipeline-element-options',
+  templateUrl: './pipeline-element-options.component.html',
+  styleUrls: ['./pipeline-element-options.component.css']
+})
+export class PipelineElementOptionsComponent implements OnInit{
+
+  recommendationsAvailable: any;
+  possibleElements: PipelineElementUnion[];
+  recommendedElements: PipelineElementUnion[];
+  recommendationsShown: any;
+  pipelineElementCssType: string;
+
+  @Input()
+  currentMouseOverElement: string;
+
+  @Input()
+  pipelineElementId: string;
+
+  @Input()
+  pipelineValid: boolean;
+
+  @Input()
+  internalId: string;
+
+  @Input()
+  pipelineElement: PipelineElementConfig;
+
+  @Input()
+  rawPipelineModel: PipelineElementConfig[];
+
+  @Input()
+  allElements: PipelineElementUnion[];
+
+  @Output()
+  delete: EventEmitter<PipelineElementConfig> = new EventEmitter<PipelineElementConfig>();
+
+  @Output()
+  customize: EventEmitter<Tuple2<Boolean, PipelineElementConfig>> = new EventEmitter<Tuple2<Boolean, PipelineElementConfig>>();
+
+  constructor(private ObjectProvider: ObjectProvider,
+              private PipelineElementRecommendationService: PipelineElementRecommendationService,
+              private DialogService: DialogService,
+              private EditorService: EditorService,
+              //private InitTooltips: InitTooltips,
+              private JsplumbBridge: JsplumbBridge,
+              private JsplumbService: JsplumbService,
+              //private TransitionService: TransitionService,
+              private PipelineValidationService: PipelineValidationService,
+              private RestApi: RestApi) {
+    this.recommendationsAvailable = false;
+    this.possibleElements = [];
+    this.recommendedElements = [];
+    this.recommendationsShown = false;
+
+  }
+
+  ngOnInit() {
+    this.EditorService.pipelineElementConfigured$.subscribe(pipelineElementDomId => {
+      this.pipelineElement.settings.openCustomize = false;
+      this.RestApi.updateCachedPipeline(this.rawPipelineModel);
+      if (pipelineElementDomId === this.pipelineElement.payload.dom) {
+        this.initRecs(this.pipelineElement.payload.dom);
+      }
+    });
+    this.pipelineElementCssType = this.pipelineElement.type;
+
+    if (this.pipelineElement.type === 'stream') {
+      this.initRecs(this.pipelineElement.payload.dom);
+    }
+  }
+
+  removeElement(pipelineElement: PipelineElementConfig) {
+    this.delete.emit(pipelineElement);
+    //this.$rootScope.$broadcast("pipeline.validate");
+  }
+
+  customizeElement(pipelineElement: PipelineElementConfig) {
+    let restrictedEditMode = ! (this.isRootElement());
+    let customizeInfo = {a: restrictedEditMode, b: pipelineElement} as Tuple2<Boolean, PipelineElementConfig>;
+    this.customize.emit(customizeInfo);
+  }
+
+  openCustomizeDialog() {
+    let restrictedEditMode = ! (this.isRootElement());
+    // this.EditorDialogManager.showCustomizeDialog($("#" + this.pipelineElement.payload.dom), "", this.pipelineElement.payload, restrictedEditMode)
+    //     .then(() => {
+    //       this.JsplumbService.activateEndpoint(this.pipelineElement.payload.dom, !this.pipelineElement.payload.uncompleted);
+    //     }, () => {
+    //       this.JsplumbService.activateEndpoint(this.pipelineElement.payload.dom, !this.pipelineElement.payload.uncompleted);
+    //     });
+  }
+
+  openHelpDialog() {
+    this.EditorService.openHelpDialog(this.pipelineElement.payload);
+  }
+
+  openCustomizeStreamDialog() {
+    //this.EditorDialogManager.showCustomizeStreamDialog(this.pipelineElement.payload);
+  }
+
+  initRecs(elementId) {
+    var currentPipeline = this.ObjectProvider.makePipeline(angular.copy(this.rawPipelineModel));
+    this.EditorService.recommendPipelineElement(currentPipeline).subscribe((result) => {
+      if (result.success) {
+        this.possibleElements = this.PipelineElementRecommendationService.collectPossibleElements(this.allElements, result.possibleElements);
+        this.recommendedElements = this.PipelineElementRecommendationService.populateRecommendedList(this.allElements, result.recommendedElements);
+        this.recommendationsAvailable = true;
+        //this.InitTooltips.initTooltips();
+      }
+    });
+  }
+
+  openPossibleElementsDialog() {
+    const dialogRef = this.DialogService.open(CompatibleElementsComponent,{
+      panelType: PanelType.SLIDE_IN_PANEL,
+      title: "Compatible Elements",
+      data: {
+        "rawPipelineModel": this.rawPipelineModel,
+        "possibleElements": this.possibleElements,
+        "pipelineElementDomId": this.pipelineElement.payload.dom
+      }
+    });
+
+    dialogRef.afterClosed().subscribe(c => {
+
+    });
+  }
+
+  showRecommendations(e) {
+    this.recommendationsShown = !this.recommendationsShown;
+    e.stopPropagation();
+  }
+
+  isRootElement() {
+    return this.JsplumbBridge.getConnections({source: this.pipelineElement.payload.dom}).length === 0;
+  }
+
+  isConfigured() {
+    if (this.pipelineElement.type == 'stream') return true;
+    else {
+      return (this.pipelineElement.payload as InvocablePipelineElementUnion).configured;
+    }
+  }
+
+  isWildcardTopic() {
+    return (this.pipelineElement
+        .payload as SpDataStream)
+        .eventGrounding
+        .transportProtocols[0]
+        .topicDefinition instanceof WildcardTopicDefinition;
+  }
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.controller.ts b/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.controller.ts
deleted file mode 100644
index a193dbc..0000000
--- a/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.controller.ts
+++ /dev/null
@@ -1,148 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-import {JsplumbBridge} from "../../../editor-v2/services/jsplumb-bridge.service";
-import {JsplumbService} from "../../../editor-v2/services/jsplumb.service";
-import {PipelineValidationService} from "../../../editor-v2/services/pipeline-validation.service";
-import {RestApi} from "../../../services/rest-api.service";
-
-export class PipelineElementOptionsController {
-
-    ObjectProvider: any;
-    PipelineElementRecommendationService: any;
-    PipelineValidationService: PipelineValidationService;
-    InitTooltips: any;
-    JsplumbBridge: JsplumbBridge;
-    EditorDialogManager: any;
-    JsplumbService: JsplumbService;
-    recommendationsAvailable: any;
-    possibleElements: any;
-    recommendedElements: any;
-    recommendationsShown: any;
-    pipelineElement: any;
-    rawPipelineModel: any;
-    allElements: any;
-    deleteFunction: any;
-    $rootScope: any;
-    $timeout: any;
-    RestApi: RestApi;
-
-    pipelineValid: boolean;
-
-    constructor($rootScope, ObjectProvider, PipelineElementRecommendationService, InitTooltips, JsplumbBridge,
-                EditorDialogManager, JsplumbService, TransitionService, PipelineValidationService, $timeout, RestApi) {
-        this.$rootScope = $rootScope;
-        this.ObjectProvider = ObjectProvider;
-        this.PipelineElementRecommendationService = PipelineElementRecommendationService;
-        this.InitTooltips = InitTooltips;
-        this.JsplumbBridge = JsplumbBridge;
-        this.EditorDialogManager = EditorDialogManager;
-        this.JsplumbService = JsplumbService;
-        this.PipelineValidationService = PipelineValidationService;
-        this.RestApi = RestApi;
-
-        this.recommendationsAvailable = false;
-        this.possibleElements = [];
-        this.recommendedElements = [];
-        this.recommendationsShown = false;
-
-        this.$timeout = $timeout;
-    }
-
-    $onInit() {
-        this.$rootScope.$on("SepaElementConfigured", (event, item) => {
-            this.pipelineElement.settings.openCustomize = false;
-            this.RestApi.updateCachedPipeline(this.rawPipelineModel);
-            if (item === this.pipelineElement.payload.DOM) {
-                this.initRecs(this.pipelineElement.payload.DOM, this.rawPipelineModel);
-            }
-        });
-
-        if (this.pipelineElement.type === 'stream') {
-            this.initRecs(this.pipelineElement.payload.DOM, this.rawPipelineModel);
-        }
-    }
-
-    removeElement(pipelineElement) {
-        this.deleteFunction(pipelineElement);
-        this.$rootScope.$broadcast("pipeline.validate");
-
-    }
-
-    openCustomizeDialog() {
-        let restrictedEditMode = ! (this.isRootElement());
-        this.EditorDialogManager.showCustomizeDialog($("#" + this.pipelineElement.payload.DOM), "", this.pipelineElement.payload, restrictedEditMode)
-            .then(() => {
-                this.JsplumbService.activateEndpoint(this.pipelineElement.payload.DOM, !this.pipelineElement.payload.uncompleted);
-            }, () => {
-                this.JsplumbService.activateEndpoint(this.pipelineElement.payload.DOM, !this.pipelineElement.payload.uncompleted);
-            });
-    }
-
-    openHelpDialog() {
-        this.EditorDialogManager.openHelpDialog(this.pipelineElement.payload);
-    }
-
-    openCustomizeStreamDialog() {
-        this.EditorDialogManager.showCustomizeStreamDialog(this.pipelineElement.payload);
-    }
-
-    initRecs(elementId, currentPipelineElements) {
-        var currentPipeline = this.ObjectProvider.makePipeline(angular.copy(currentPipelineElements));
-        this.PipelineElementRecommendationService.getRecommendations(this.allElements, currentPipeline).then((result) => {
-            if (result.success) {
-                this.possibleElements = result.possibleElements;
-                this.recommendedElements = result.recommendations;
-                this.recommendationsAvailable = true;
-                this.InitTooltips.initTooltips();
-            }
-        });
-    }
-
-    showRecommendations(e) {
-        this.recommendationsShown = !this.recommendationsShown;
-        e.stopPropagation();
-    }
-
-    isRootElement() {
-        return this.JsplumbBridge.getConnections({source: this.pipelineElement.payload.DOM}).length === 0;
-    }
-
-    isConfigured() {
-        if (this.pipelineElement.type == 'stream') return true;
-        else {
-            return this.pipelineElement.payload.configured;
-        }
-    }
-
-    isWildcardTopic() {
-        return this.pipelineElement
-            .payload
-            .eventGrounding
-            .transportProtocols[0]
-            .properties
-            .topicDefinition
-            .type === "org.apache.streampipes.model.grounding.WildcardTopicDefinition";
-
-    }
-}
-
-PipelineElementOptionsController.$inject = ['$rootScope', 'ObjectProvider', 'PipelineElementRecommendationService',
-    'InitTooltips', 'JsplumbBridge', 'EditorDialogManager', 'JsplumbService',
-    'TransitionService', 'PipelineValidationService', '$timeout', 'RestApi'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.tmpl.html b/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.tmpl.html
deleted file mode 100644
index 49d19bb..0000000
--- a/ui/src/app/editor/components/pipeline-element-options/pipeline-element-options.tmpl.html
+++ /dev/null
@@ -1,92 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-show="ctrl.currentMouseOverElement==ctrl.pipelineElement.payload.DOM" class="sp-fade-options">
-    <span class="options-button customize-button" ng-show="ctrl.pipelineElement.type!='stream'" style="z-index:10">
-        <md-button ng-click="ctrl.openCustomizeDialog()" class="md-icon-button"
-                   style="margin:0px;font-size:20px;">
-            <i class="material-icons">settings</i>
-            <md-tooltip md-direction="top">
-                        Configure Element
-            </md-tooltip>
-            </md-button>
-    </span>
-    <span class="options-button customize-button"
-          ng-show="ctrl.pipelineElement.type=='stream' && ctrl.isWildcardTopic()"
-          style="z-index:10">
-        <md-button ng-click="ctrl.openCustomizeStreamDialog()" ng-disabled="!ctrl.isRootElement()" class="md-icon-button"
-               style="margin:0px;font-size:20px;">
-            <i class="material-icons">settings</i>
-            <md-tooltip md-direction="top">
-                    Configure Element
-            </md-tooltip>
-        </md-button>
-    </span>
-    <span class="options-button delete-button" style="z-index:10">
-        <md-button ng-click="ctrl.removeElement(ctrl.pipelineElement)" ng-disabled="!ctrl.isRootElement()"
-                   class="md-icon-button"
-                   style="margin:0px;font-size:20px;">
-            <i class="material-icons">clear</i>
-             <md-tooltip md-direction="top">
-                       Delete Element
-             </md-tooltip>
-        </md-button>
-    </span>
-    <span class="options-button possible-button" ng-show="ctrl.pipelineElement.type!='action'" style="z-index:10">
-        <md-button
-                ng-disabled="!ctrl.possibleElements || ctrl.possibleElements.length == 0 || !ctrl.isConfigured()"
-                ng-click="ctrl.EditorDialogManager.openPossibleElementsDialog(ctrl.rawPipelineModel, ctrl.possibleElements, ctrl.pipelineElement.payload.DOM)"
-                class="md-icon-button" style="margin:0px;font-size:20px;">
-            <i class="material-icons">visibility</i>
-            <md-tooltip md-direction="bottom">
-                        Compatible Elements
-            </md-tooltip>
-    </md-button>
-    </span>
-    <span class="options-button recommended-button"
-          ng-show="ctrl.pipelineElement.type!='action' && (ctrl.recommendationsAvailable) && ctrl.recommendedElements.length > 0"
-          style="z-index:10">
-        <md-button
-                ng-click="ctrl.showRecommendations($event)"
-                ng-disabled="!ctrl.recommendationsAvailable || !ctrl.isConfigured()"
-                class="md-icon-button" style="margin:0px;font-size:20px;">
-            <i class="material-icons">add</i>
-            <md-tooltip md-direction="bottom">
-                        Recommended Elements
-            </md-tooltip>
-        </md-button>
-    </span>
-    <span class="options-button help-button" style="z-index:10">
-        <md-button ng-click="ctrl.openHelpDialog()"
-                   class="md-icon-button"
-                   style="margin:0px;font-size:20px;">
-        ?
-            <md-tooltip md-direction="bottom">
-                            Help
-                        </md-tooltip>
-            </md-button>
-    </span>
-    <div class="editor-pe-info" ng-class="'pe-info-' + ctrl.pipelineElement.type">
-        {{ctrl.pipelineElement.payload.name}}
-    </div>
-</div>
-<pipeline-element-recommendation raw-pipeline-model="ctrl.rawPipelineModel"
-                                 pipeline-element-dom-id="ctrl.pipelineElement.payload.DOM"
-                                 recommended-elements="ctrl.recommendedElements"
-                                 recommendations-shown="ctrl.recommendationsShown"></pipeline-element-recommendation>
-
diff --git a/ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.html b/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.html
rename to ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.html
diff --git a/ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.scss b/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element-recommendation/pipeline-element-recommendation.component.scss
rename to ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.scss
diff --git a/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts b/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts
index 67bd342..17ba75e 100644
--- a/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts
+++ b/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.component.ts
@@ -16,18 +16,129 @@
  *
  */
 
-import {PipelineElementRecommendationController} from "./pipeline-element-recommendation.controller";
-
-declare const require: any;
-
-export let PipelineElementRecommendationComponent = {
-    template: require('./pipeline-element-recommendation.tmpl.html'),
-    bindings: {
-        recommendedElements: "<",
-        recommendationsShown: "<",
-        rawPipelineModel: "=",
-        pipelineElementDomId: "<"
-    },
-    controller: PipelineElementRecommendationController,
-    controllerAs: 'ctrl'
-};
+import {JsplumbService} from "../../services/jsplumb.service";
+import {Component, Input, OnInit} from "@angular/core";
+import {PipelineElementConfig} from "../../model/editor.model";
+import {DataProcessorInvocation} from "../../../core-model/gen/streampipes-model";
+import {SafeCss} from "../../utils/style-sanitizer";
+
+@Component({
+  selector: 'pipeline-element-recommendation',
+  templateUrl: './pipeline-element-recommendation.component.html',
+  styleUrls: ['./pipeline-element-recommendation.component.scss']
+})
+export class PipelineElementRecommendationComponent implements OnInit {
+
+  @Input()
+  recommendationsShown: boolean;
+
+  @Input()
+  rawPipelineModel: PipelineElementConfig[];
+
+  @Input()
+  pipelineElementDomId: string;
+
+  @Input()
+  recommendedElements: any;
+
+  recommendationsPrepared: boolean = false;
+
+  constructor(private JsplumbService: JsplumbService,
+              public safeCss: SafeCss) {
+
+  }
+
+  ngOnInit() {
+    this.prepareStyles();
+  }
+
+  prepareStyles() {
+    this.recommendedElements.forEach((element, index) => {
+      this.setLayoutSettings(element, index);
+    });
+    this.recommendationsPrepared = true;
+  }
+
+  setLayoutSettings(element, index) {
+    element.layoutSettings = {
+      skewStyle: element.name ? this.getSkewStyle(index) : {'opacity': 0},
+      unskewStyle: this.getUnskewStyle(element, index),
+      unskewStyleLabel: this.getUnskewStyleLabel(index),
+      type: element instanceof DataProcessorInvocation ? "sepa" : "action"
+    };
+  }
+
+  create(recommendedElement) {
+    this.recommendationsShown = false;
+    this.JsplumbService.createElement(this.rawPipelineModel, recommendedElement, this.pipelineElementDomId);
+  }
+
+  getUnskewStyle(recommendedElement, index) {
+    var unskew = -(this.getSkew());
+    var rotate = -(90 - (this.getSkew() / 2));
+
+    return "transform: skew(" + unskew + "deg)" + " rotate(" + rotate + "deg)" + " scale(1);"
+       +"background-color: " +this.getBackgroundColor(recommendedElement, index);
+  }
+
+  getBackgroundColor(recommendedElement, index) {
+    var alpha = recommendedElement.weight < 0.2 ? 0.2 : (recommendedElement.weight - 0.2);
+    var rgb = recommendedElement instanceof DataProcessorInvocation ? this.getSepaColor(index) : this.getActionColor(index);
+
+    return "rgba(" +rgb +"," +alpha +")";
+  }
+
+  getSepaColor(index) {
+    return (index % 2 === 0) ? "0, 150, 136" : "0, 164, 150";
+  }
+
+  getActionColor(index) {
+    return (index % 2 === 0) ? "63, 81, 181" : "79, 101, 230";
+  }
+
+  getSkewStyle(index) {
+    this.fillRemainingItems();
+    // transform: rotate(72deg) skew(18deg);
+    var skew = this.getSkew();
+    var rotate = (index + 1) * this.getAngle();
+
+    return "transform: rotate(" + rotate + "deg) skew(" + skew + "deg);";
+  }
+
+  getUnskewStyleLabel(index) {
+    var unskew = -(this.getSkew());
+    var rotate =  (index + 1) * this.getAngle();
+    var unrotate = -360 + (rotate*-1);
+
+    return "transform: skew(" + unskew + "deg)" + " rotate(" + unrotate + "deg)" + " scale(1);"
+      +"z-index: -1;"
+      +"margin-left: 50%;"
+      +"margin-top: 50%;"
+      +"position: absolute;"
+      +"background: white;"
+      +"height: 50px;"
+      +"width: 50px;"
+      +"font-size: 16px;"
+      +"text-align: center;"
+      +"line-height: 50px;"
+      +"top: 0px;";
+  }
+
+  getSkew() {
+    return (90 - this.getAngle());
+  }
+
+  getAngle() {
+    return (360 / this.recommendedElements.length);
+  }
+
+  fillRemainingItems() {
+    if (this.recommendedElements.length < 6) {
+      for (var i = this.recommendedElements.length; i < 6; i++) {
+        let element = {fakeElement: true};
+        this.setLayoutSettings(element, i);
+        this.recommendedElements.push(element);
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.controller.ts b/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.controller.ts
deleted file mode 100644
index 0f51d9d..0000000
--- a/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.controller.ts
+++ /dev/null
@@ -1,101 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class PipelineElementRecommendationController {
-
-    JsplumbService: any;
-    recommendationsShown: any;
-    rawPipelineModel: any;
-    pipelineElementDomId: any;
-    recommendedElements: any;
-
-    constructor(JsplumbService) {
-        this.JsplumbService = JsplumbService;
-    }
-
-    create(recommendedElement) {
-        this.recommendationsShown = false;
-        this.JsplumbService.createElement(this.rawPipelineModel, recommendedElement, this.pipelineElementDomId);
-    }
-
-    getUnskewStyle(recommendedElement, index) {
-        var unskew = -(this.getSkew());
-        var rotate = -(90 - (this.getSkew() / 2));
-
-        return {
-            "transform": "skew(" + unskew + "deg)" + " rotate(" + rotate + "deg)" + " scale(1)",
-            "background-color": this.getBackgroundColor(recommendedElement, index)
-        };
-    }
-
-    getBackgroundColor(recommendedElement, index) {
-        var alpha = recommendedElement.weight < 0.2 ? 0.2 : (recommendedElement.weight - 0.2);
-        var rgb = recommendedElement.type === 'sepa' ? this.getSepaColor(index) : this.getActionColor(index);
-
-        return "rgba(" +rgb +"," +alpha +")";
-    }
-
-    getSepaColor(index) {
-        return (index % 2 === 0) ? "0, 150, 136" : "0, 164, 150";
-    }
-
-    getActionColor(index) {
-        return (index % 2 === 0) ? "63, 81, 181" : "79, 101, 230";
-    }
-
-    getSkewStyle(index) {
-        this.fillRemainingItems();
-        // transform: rotate(72deg) skew(18deg);
-        var skew = this.getSkew();
-        var rotate = (index + 1) * this.getAngle();
-
-        return {
-            "transform": "rotate(" + rotate + "deg) skew(" + skew + "deg)"
-        };
-    }
-
-    getUnskewStyleLabel(index) {
-        var unskew = -(this.getSkew());
-        var rotate =  (index + 1) * this.getAngle();
-        var unrotate = -360 + (rotate*-1);
-
-        return {
-            "transform": "skew(" + unskew + "deg)" + " rotate(" + unrotate + "deg)" + " scale(1)",
-            "z-index": -1
-        };
-    }
-
-    getSkew() {
-        return (90 - this.getAngle());
-    }
-
-    getAngle() {
-        return (360 / this.recommendedElements.length);
-    }
-
-    fillRemainingItems() {
-        if (this.recommendedElements.length < 6) {
-            for (var i = this.recommendedElements.length; i < 6; i++) {
-                this.recommendedElements.push({fakeElement: true});
-            }
-        }
-    }
-
-}
-
-PipelineElementRecommendationController.$inject = ['JsplumbService'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.tmpl.html b/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.tmpl.html
deleted file mode 100644
index 55977d8..0000000
--- a/ui/src/app/editor/components/pipeline-element-recommendation/pipeline-element-recommendation.tmpl.html
+++ /dev/null
@@ -1,30 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div class="cv-wrapper" ng-class="ctrl.recommendationsShown ? 'opened-nav' : ''"
-     ng-if="ctrl.recommendedElements.length > 0">
-    <ul>
-        <li ng-repeat="(index, recommendedElement) in ctrl.recommendedElements track by $index"
-            ng-style="recommendedElement.name ? ctrl.getSkewStyle(index) : {'opacity':0}">
-            <a ng-style="ctrl.getUnskewStyle(recommendedElement, index)" ng-class="recommendedElement.type" ng-click="ctrl.create(recommendedElement)" ng-if="recommendedElement.name">
-            </a>
-            <div ng-click="ctrl.create(recommendedElement)" ng-style="ctrl.getUnskewStyleLabel(index)" style="margin-left:50%;margin-top:50%;position:absolute;background:white;height:50px;width:50px;font-size:16px;text-align:center;line-height:50px;"
-                 class="{{recommendedElement.type}}"><pipeline-element icon-size="'small'" pipeline-element="recommendedElement" ng-if="recommendedElement.name"></pipeline-element></div>
-        </li>
-    </ul>
-</div>
diff --git a/ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.css b/ui/src/app/editor/components/pipeline-element/pipeline-element.component.css
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.css
rename to ui/src/app/editor/components/pipeline-element/pipeline-element.component.css
diff --git a/ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.html b/ui/src/app/editor/components/pipeline-element/pipeline-element.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline-element/pipeline-element.component.html
rename to ui/src/app/editor/components/pipeline-element/pipeline-element.component.html
diff --git a/ui/src/app/editor/components/pipeline-element/pipeline-element.component.ts b/ui/src/app/editor/components/pipeline-element/pipeline-element.component.ts
index 6dcb017..f065d86 100644
--- a/ui/src/app/editor/components/pipeline-element/pipeline-element.component.ts
+++ b/ui/src/app/editor/components/pipeline-element/pipeline-element.component.ts
@@ -16,18 +16,78 @@
  *
  */
 
-import {PipelineElementController} from "./pipeline-element.controller";
-
-declare const require: any;
-
-export let PipelineElementComponent = {
-    template: require('./pipeline-element.tmpl.html'),
-    bindings: {
-        pipelineElement : "<",
-        preview: "<",
-        iconSize: "<",
-        iconStandSize: "<"
-    },
-    controller: PipelineElementController,
-    controllerAs: 'ctrl'
-};
+import {Component, Input, OnInit,} from "@angular/core";
+import {RestApi} from "../../../services/rest-api.service";
+import {ElementIconText} from "../../../services/get-element-icon-text.service";
+import {ImageChecker} from "../../../services/image-checker.service";
+import {PipelineElementUnion} from "../../model/editor.model";
+
+
+@Component({
+    selector: 'pipeline-element',
+    templateUrl: './pipeline-element.component.html',
+    styleUrls: ['./pipeline-element.component.css']
+})
+export class PipelineElementComponent implements OnInit {
+
+    showImage: any;
+    iconText: any;
+
+    @Input()
+    pipelineElement: PipelineElementUnion;
+
+    @Input()
+    preview: any;
+
+    @Input()
+    iconSize: any;
+
+    @Input()
+    iconStandSize: any;
+
+    iconUrl: any;
+
+    constructor(private ImageChecker: ImageChecker,
+                private RestApi: RestApi,
+                private ElementIconText: ElementIconText) {
+
+    }
+
+    ngOnInit(): void {
+        this.iconText =  this.ElementIconText.getElementIconText(this.pipelineElement.name);
+        this.checkImageAvailable();
+    }
+
+    checkImageAvailable() {
+        if (this.pipelineElement.includesAssets) {
+            this.fetchImage(this.makeAssetIconUrl())
+        } else {
+            this.fetchImage(this.pipelineElement.iconUrl);
+        }
+    }
+
+    fetchImage(imageUrl) {
+        this.ImageChecker.imageExists(imageUrl, (exists) => {
+            this.iconUrl = imageUrl;
+            this.showImage = exists;
+        })
+    }
+
+    makeAssetIconUrl() {
+        return this.RestApi.getAssetUrl(this.pipelineElement.appId) +"/icon";
+    }
+
+    iconSizeCss() {
+        if (this.iconSize) {
+            return 'width:35px;height:35px;';
+        }
+        else if (this.preview) {
+            return 'width:50px;height:50px;';
+        } else if (this.iconStandSize) {
+            return 'width:50px;height:50px;margin-top:-5px;'
+        } else {
+            return 'width:70px;height:70px;';
+        }
+    }
+
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element/pipeline-element.controller.ts b/ui/src/app/editor/components/pipeline-element/pipeline-element.controller.ts
deleted file mode 100644
index 2a8348f..0000000
--- a/ui/src/app/editor/components/pipeline-element/pipeline-element.controller.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class PipelineElementController {
-
-    ImageChecker: any;
-    ElementIconText: any;
-    showImage: any;
-    iconText: any;
-    pipelineElement: any;
-    preview: any;
-    iconSize: any;
-    iconStandSize: any;
-    iconUrl: any;
-    RestApi: any;
-
-    constructor(ImageChecker, ElementIconText, RestApi) {
-        this.ImageChecker = ImageChecker;
-        this.ElementIconText = ElementIconText;
-        this.RestApi = RestApi;
-        this.showImage = false;
-    }
-
-    $onInit() {
-        this.iconText =  this.ElementIconText.getElementIconText(this.pipelineElement.name);
-        this.checkImageAvailable();
-    }
-
-    checkImageAvailable() {
-        if (this.pipelineElement.includesAssets) {
-            this.fetchImage(this.makeAssetIconUrl())
-        } else {
-            this.fetchImage(this.pipelineElement.iconUrl);
-        }
-    }
-
-    fetchImage(imageUrl) {
-        this.ImageChecker.imageExists(imageUrl, (exists) => {
-            this.iconUrl = imageUrl;
-            this.showImage = exists;
-        })
-    }
-
-    makeAssetIconUrl() {
-        return this.RestApi.getAssetUrl(this.pipelineElement.appId) +"/icon";
-    }
-
-    iconSizeCss() {
-        if (this.iconSize) {
-            return 'width:35px;height:35px;';
-        }
-        else if (this.preview) {
-            return 'width:50px;height:50px;';
-        } else if (this.iconStandSize) {
-            return 'width:50px;height:50px;margin-top:-5px;'
-        } else {
-            return 'width:70px;height:70px;';
-        }
-    }
-}
-
-PipelineElementController.$inject=['ImageChecker', 'ElementIconText', 'RestApi'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline-element/pipeline-element.tmpl.html b/ui/src/app/editor/components/pipeline-element/pipeline-element.tmpl.html
deleted file mode 100644
index 423f2b3..0000000
--- a/ui/src/app/editor/components/pipeline-element/pipeline-element.tmpl.html
+++ /dev/null
@@ -1,22 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<img ng-src="{{ctrl.iconUrl}}" ng-if="ctrl.showImage" style="{{ctrl.iconSizeCss()}}">
-<span ng-if="!ctrl.showImage" class="element-text-icon">
-            {{ctrl.iconText}}
-</span>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/components/pipeline/pipeline.component.css b/ui/src/app/editor/components/pipeline/pipeline.component.css
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline/pipeline.component.css
rename to ui/src/app/editor/components/pipeline/pipeline.component.css
diff --git a/ui/src/app/editor-v2/components/pipeline/pipeline.component.html b/ui/src/app/editor/components/pipeline/pipeline.component.html
similarity index 100%
rename from ui/src/app/editor-v2/components/pipeline/pipeline.component.html
rename to ui/src/app/editor/components/pipeline/pipeline.component.html
diff --git a/ui/src/app/editor/components/pipeline/pipeline.component.ts b/ui/src/app/editor/components/pipeline/pipeline.component.ts
index 4dbcd64..bcd6fd8 100644
--- a/ui/src/app/editor/components/pipeline/pipeline.component.ts
+++ b/ui/src/app/editor/components/pipeline/pipeline.component.ts
@@ -16,22 +16,382 @@
  *
  */
 
-import {PipelineController} from "./pipeline.controller";
-
-declare const require: any;
-
-export let PipelineComponent = {
-    template: require('./pipeline.tmpl.html'),
-    bindings: {
-        staticProperty : "=",
-        rawPipelineModel: "=",
-        allElements: "=",
-        preview: "<",
-        canvasId: "@",
-        pipelineValid: "=",
-        pipelineCacheRunning: "=",
-        pipelineCached: "="
-    },
-    controller: PipelineController,
-    controllerAs: 'ctrl'
-};
+import * as angular from "angular";
+
+import {PipelineValidationService} from "../../services/pipeline-validation.service";
+import {JsplumbService} from "../../services/jsplumb.service";
+import {PipelineEditorService} from "../../services/pipeline-editor.service";
+import {JsplumbBridge} from "../../services/jsplumb-bridge.service";
+import {ShepherdService} from "../../../services/tour/shepherd.service";
+import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core";
+import {
+  InvocablePipelineElementUnion,
+  PipelineElementConfig,
+  PipelineElementUnion
+} from "../../model/editor.model";
+import {
+  CustomOutputStrategy,
+  DataProcessorInvocation,
+  Pipeline,
+  SpDataStream
+} from "../../../core-model/gen/streampipes-model";
+import {ObjectProvider} from "../../services/object-provider.service";
+import {CustomizeComponent} from "../../dialog/customize/customize.component";
+import {PanelType} from "../../../core-ui/dialog/base-dialog/base-dialog.model";
+import {DialogService} from "../../../core-ui/dialog/base-dialog/base-dialog.service";
+import {EditorService} from "../../services/editor.service";
+import {MatchingResultMessage} from "../../../core-model/gen/streampipes-model-client";
+import {MatchingErrorComponent} from "../../dialog/matching-error/matching-error.component";
+import {Tuple2} from "../../../core-model/base/Tuple2";
+import {ConfirmDialogComponent} from "../../../core-ui/dialog/confirm-dialog/confirm-dialog.component";
+import {MatDialog} from "@angular/material/dialog";
+
+@Component({
+  selector: 'pipeline',
+  templateUrl: './pipeline.component.html',
+  styleUrls: ['./pipeline.component.css']
+})
+export class PipelineComponent implements OnInit {
+
+  @Input()
+  pipelineValid: boolean;
+
+  @Input()
+  canvasId: string;
+
+  @Input()
+  rawPipelineModel: PipelineElementConfig[];
+
+  @Input()
+  allElements: PipelineElementUnion[];
+
+  @Input()
+  preview: boolean;
+
+  @Input()
+  pipelineCached: boolean;
+
+  @Output()
+  pipelineCachedChanged: EventEmitter<boolean> = new EventEmitter<boolean>();
+
+  @Input()
+  pipelineCacheRunning: boolean;
+
+  @Output()
+  pipelineCacheRunningChanged: EventEmitter<boolean> = new EventEmitter<boolean>();
+
+  availablePipelineElementCache: PipelineElementUnion[];
+
+  plumbReady: any;
+  currentMouseOverElement: string;
+  currentPipelineModel: Pipeline;
+  idCounter: any;
+  currentZoomLevel: any;
+  TransitionService: any;
+
+  // remove later
+
+  constructor(private JsplumbService: JsplumbService,
+              private PipelineEditorService: PipelineEditorService,
+              private JsplumbBridge: JsplumbBridge,
+              private ObjectProvider: ObjectProvider,
+              private EditorService: EditorService,
+              private ShepherdService: ShepherdService,
+              private PipelineValidationService: PipelineValidationService,
+              private dialogService: DialogService,
+              private dialog: MatDialog) {
+    this.plumbReady = false;
+    this.currentMouseOverElement = "";
+    this.currentPipelineModel = new Pipeline();
+    this.idCounter = 0;
+
+    this.currentZoomLevel = 1;
+  }
+
+  ngOnInit() {
+    this.JsplumbBridge.setContainer(this.canvasId);
+    this.initAssembly();
+    this.initPlumb();
+  }
+
+  validatePipeline() {
+      this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
+  }
+
+  ngOnDestroy() {
+    this.JsplumbBridge.deleteEveryEndpoint();
+    this.plumbReady = false;
+  }
+
+  updateMouseover(elementId) {
+    this.currentMouseOverElement = elementId;
+  }
+
+  updateOptionsClick(elementId) {
+    if (this.currentMouseOverElement == elementId) {
+      this.currentMouseOverElement = "";
+    } else {
+      this.currentMouseOverElement = elementId;
+    }
+  }
+
+  getElementCss(currentPipelineElementSettings) {
+    return "position:absolute;"
+        + (this.preview ? "width:75px;" : "width:110px;")
+        + (this.preview ? "height:75px;" : "height:110px;")
+        + "left: " + currentPipelineElementSettings.position.x + "px; "
+        + "top: " + currentPipelineElementSettings.position.y + "px; "
+  }
+
+  getElementCssClasses(currentPipelineElement) {
+    return currentPipelineElement.type + " " + (currentPipelineElement.settings.openCustomize ? "" : "")
+        + currentPipelineElement.settings.connectable + " "
+        + currentPipelineElement.settings.displaySettings;
+  }
+
+  isStreamInPipeline() {
+    return this.isInPipeline('stream');
+  }
+
+  isSetInPipeline() {
+    return this.isInPipeline('set');
+  }
+
+  isInPipeline(type) {
+    return this.rawPipelineModel.some(x => (x.type == type && !(x.settings.disabled)));
+  }
+
+  showMixedStreamAlert() {
+    this.dialog.open(ConfirmDialogComponent, {
+      width: '500px',
+      data: {
+        "title": "Currently, it is not possible to mix data streams and data sets in a single pipeline.",
+        "confirmAndCancel": false,
+        "okTitle": "Ok",
+      },
+    });
+  }
+
+  findPipelineElementByElementId(elementId: string) {
+    return this.allElements.find(a => a.elementId === elementId);
+  }
+
+
+  initAssembly() {
+    ($('#assembly') as any).droppable({
+      tolerance: "fit",
+      drop: (element, ui) => {
+        let pipelineElementId = ui.draggable.data("pe");
+        let pipelineElement: PipelineElementUnion = this.findPipelineElementByElementId(pipelineElementId);
+        if (ui.draggable.hasClass('draggable-icon')) {
+          this.EditorService.makePipelineAssemblyEmpty(false);
+          var pipelineElementConfig = this.JsplumbService.createNewPipelineElementConfig(pipelineElement, this.PipelineEditorService.getCoordinates(ui, this.currentZoomLevel), false, false);
+          if ((this.isStreamInPipeline() && pipelineElementConfig.type == 'set') ||
+              this.isSetInPipeline() && pipelineElementConfig.type == 'stream') {
+            this.showMixedStreamAlert();
+          } else {
+            this.rawPipelineModel.push(pipelineElementConfig);
+            if (ui.draggable.hasClass('set')) {
+              setTimeout(() => {
+                this.JsplumbService.setDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
+              }, 10);
+            }
+            else if (ui.draggable.hasClass('stream')) {
+              this.checkTopicModel(pipelineElementConfig);
+            } else if (ui.draggable.hasClass('sepa')) {
+                setTimeout(() => {
+                  this.JsplumbService.sepaDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
+                }, 10);
+            } else if (ui.draggable.hasClass('action')) {
+                setTimeout(() => {
+                  this.JsplumbService.actionDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
+                }, 10);
+            }
+            if (this.ShepherdService.isTourActive()) {
+              this.ShepherdService.trigger("drop-" +pipelineElementConfig.type);
+            }
+          }
+        }
+        this.JsplumbBridge.repaintEverything();
+        this.validatePipeline();
+        this.triggerPipelineCacheUpdate();
+      }
+
+    }); //End #assembly.droppable()
+  }
+
+  checkTopicModel(pipelineElementConfig: PipelineElementConfig) {
+      setTimeout(() => {
+        this.JsplumbService.streamDropped(pipelineElementConfig.payload.dom, pipelineElementConfig.payload, true, false);
+      }, 10);
+
+    var streamDescription = pipelineElementConfig.payload as SpDataStream;
+    if (streamDescription
+        .eventGrounding
+        .transportProtocols[0]
+        .topicDefinition["@class"] === "org.apache.streampipes.model.grounding.WildcardTopicDefinition") {
+      //this.EditorDialogManager.showCustomizeStreamDialog(streamDescription);
+    }
+  }
+
+  handleDeleteOption(pipelineElement: PipelineElementConfig) {
+    this.JsplumbBridge.removeAllEndpoints(pipelineElement.payload.dom);
+    angular.forEach(this.rawPipelineModel, pe => {
+      if (pe.payload.dom == pipelineElement.payload.dom) {
+        pe.settings.disabled = true;
+      }
+    });
+    if (this.rawPipelineModel.every(pe => pe.settings.disabled)) {
+      this.EditorService.makePipelineAssemblyEmpty(true);
+    }
+    this.JsplumbBridge.repaintEverything();
+    this.triggerPipelineCacheUpdate();
+  }
+
+  initPlumb() {
+
+    this.JsplumbService.prepareJsplumb();
+
+    this.JsplumbBridge.unbind("connection");
+
+    this.JsplumbBridge.bind("connectionMoved", (info, originalEvent) => {
+      var pe = this.ObjectProvider.findElement(info.newTargetEndpoint.elementId, this.rawPipelineModel);
+      var oldPe = this.ObjectProvider.findElement(info.originalTargetEndpoint.elementId, this.rawPipelineModel);
+      (oldPe.payload as InvocablePipelineElementUnion).configured = false;
+      (pe.payload as InvocablePipelineElementUnion).configured = false;
+    });
+
+    this.JsplumbBridge.bind("connectionDetached", (info, originalEvent) => {
+      var pe = this.ObjectProvider.findElement(info.targetEndpoint.elementId, this.rawPipelineModel);
+      (pe.payload as InvocablePipelineElementUnion).configured = false;
+      pe.settings.openCustomize = true;
+      info.targetEndpoint.setType("empty");
+      this.validatePipeline();
+    });
+
+    this.JsplumbBridge.bind("connectionDrag", connection => {
+      this.JsplumbBridge.selectEndpoints().each(function (endpoint) {
+        if (endpoint.isTarget && endpoint.connections.length === 0) {
+          endpoint.setType("highlight");
+        }
+      });
+
+    });
+    this.JsplumbBridge.bind("connectionAborted", connection => {
+      this.JsplumbBridge.selectEndpoints().each(endpoint => {
+        if (endpoint.isTarget && endpoint.connections.length === 0) {
+          endpoint.setType("empty");
+        }
+      });
+    })
+
+    this.JsplumbBridge.bind("connection", (info, originalEvent) => {
+      var pe = this.ObjectProvider.findElement(info.target.id, this.rawPipelineModel);
+      if (pe.settings.openCustomize) {
+        this.currentPipelineModel = this.ObjectProvider.makePipeline(this.rawPipelineModel);
+        pe.settings.loadingStatus = true;
+        this.ObjectProvider.updatePipeline(this.currentPipelineModel)
+            .subscribe(pipelineModificationMessage => {
+              pe.settings.loadingStatus = false;
+              info.targetEndpoint.setType("token");
+              this.validatePipeline();
+              this.modifyPipeline(pipelineModificationMessage.pipelineModifications);
+              var sourceEndpoint = this.JsplumbBridge.selectEndpoints({element: info.targetEndpoint.elementId});
+              if (this.PipelineEditorService.isFullyConnected(pe)) {
+                let payload = pe.payload as InvocablePipelineElementUnion;
+                if ((payload.staticProperties && payload.staticProperties.length > 0) || this.isCustomOutput(pe)) {
+                  this.showCustomizeDialog({a: false, b: pe});
+                } else {
+                  this.announceConfiguredElement(pe);
+                  //this.$rootScope.$broadcast("SepaElementConfigured", pe.payload.DOM);
+                  (pe.payload as InvocablePipelineElementUnion).configured = true;
+                }
+              }
+            }, status => {
+              pe.settings.loadingStatus = false;
+              this.JsplumbBridge.detach(info.connection);
+              let matchingResultMessage = (status.error as any[]).map(e => MatchingResultMessage.fromData(e as MatchingResultMessage));
+              this.showMatchingErrorDialog(matchingResultMessage);
+            });
+      }
+    });
+
+    window.onresize = (event) => {
+      this.JsplumbBridge.repaintEverything();
+    };
+
+    setTimeout(() => {
+      this.plumbReady = true;
+    }, 100);
+  }
+
+  modifyPipeline(pipelineModifications) {
+    for (var i = 0, modification; modification = pipelineModifications[i]; i++) {
+      var id = modification.domId;
+      if (id !== "undefined") {
+        var pe = this.ObjectProvider.findElement(id, this.rawPipelineModel);
+        (pe.payload as InvocablePipelineElementUnion).staticProperties = modification.staticProperties;
+        (pe.payload as DataProcessorInvocation).outputStrategies = modification.outputStrategies;
+        (pe.payload as InvocablePipelineElementUnion).inputStreams = modification.inputStreams;
+      }
+    }
+  }
+
+  isCustomOutput(pe) {
+    var custom = false;
+    angular.forEach(pe.payload.outputStrategies, strategy => {
+      if (strategy instanceof CustomOutputStrategy) {
+        custom = true;
+      }
+    });
+    return custom;
+  }
+
+  triggerPipelineCacheUpdate() {
+    this.pipelineCacheRunning = true;
+    this.pipelineCacheRunningChanged.emit(this.pipelineCacheRunning);
+    this.EditorService.updateCachedPipeline(this.rawPipelineModel).subscribe(msg => {
+      this.pipelineCacheRunning = false;
+      this.pipelineCacheRunningChanged.emit(this.pipelineCacheRunning)
+      this.pipelineCached = true;
+      this.pipelineCachedChanged.emit(this.pipelineCached);
+    });
+  }
+
+  showMatchingErrorDialog(matchingResultMessage: MatchingResultMessage[]) {
+    this.dialogService.open(MatchingErrorComponent, {
+      panelType: PanelType.STANDARD_PANEL,
+      title: "Invalid Connection",
+      data: {
+        "matchingResultMessage": matchingResultMessage
+      }
+    });
+  }
+
+  showCustomizeDialog(pipelineElementInfo: Tuple2<Boolean, PipelineElementConfig>) {
+    const dialogRef = this.dialogService.open(CustomizeComponent,{
+      panelType: PanelType.SLIDE_IN_PANEL,
+      title: "Customize " + pipelineElementInfo.b.payload.name,
+      width: "50vw",
+      data: {
+        "pipelineElement": pipelineElementInfo.b,
+        "restrictedEditMode": pipelineElementInfo.a
+      }
+    });
+
+    dialogRef.afterClosed().subscribe(c => {
+      if (c) {
+        pipelineElementInfo.b.settings.openCustomize = false;
+        this.JsplumbService.activateEndpoint(pipelineElementInfo.b.payload.dom, pipelineElementInfo.b.settings.completed);
+        this.JsplumbBridge.getSourceEndpoint(pipelineElementInfo.b.payload.dom).setType("token");
+        this.triggerPipelineCacheUpdate();
+      }
+    });
+  }
+
+  announceConfiguredElement(pe: PipelineElementConfig) {
+    this.EditorService.announceConfiguredElement(pe.payload.dom);
+  }
+
+
+}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline/pipeline.controller.ts b/ui/src/app/editor/components/pipeline/pipeline.controller.ts
deleted file mode 100644
index ddaa853..0000000
--- a/ui/src/app/editor/components/pipeline/pipeline.controller.ts
+++ /dev/null
@@ -1,350 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from "angular";
-
-import {PipelineValidationService} from "../../../editor-v2/services/pipeline-validation.service";
-import {RestApi} from "../../../services/rest-api.service";
-
-export class PipelineController {
-
-    $timeout: any;
-    JsplumbService: any;
-    PipelineEditorService: any;
-    PipelineValidationService: PipelineValidationService;
-    JsplumbBridge: any;
-    ObjectProvider: any;
-    DialogBuilder: any;
-    plumbReady: any;
-    objectProvider: any;
-    EditorDialogManager: any;
-    currentMouseOverElement: any;
-    currentPipelineModel: any;
-    idCounter: any;
-    currentZoomLevel: any;
-    canvasId: any;
-    preview: any;
-    rawPipelineModel: any;
-    TransitionService: any;
-    ShepherdService: any;
-    $rootScope: any;
-    RestApi: RestApi;
-
-    pipelineCacheRunning: boolean;
-    pipelineCached: boolean;
-
-    pipelineValid: boolean = false;
-
-    constructor($timeout, JsplumbService, PipelineEditorService, JsplumbBridge, ObjectProvider, DialogBuilder,
-                EditorDialogManager, TransitionService, ShepherdService, $rootScope, PipelineValidationService, RestApi) {
-        this.plumbReady = false;
-        this.JsplumbBridge = JsplumbBridge;
-        this.JsplumbService = JsplumbService;
-        this.PipelineEditorService = PipelineEditorService;
-        this.$timeout = $timeout;
-        this.objectProvider = ObjectProvider;
-        this.DialogBuilder = DialogBuilder;
-        this.EditorDialogManager = EditorDialogManager;
-        this.currentMouseOverElement = "";
-        this.TransitionService = TransitionService;
-        this.ShepherdService = ShepherdService;
-        this.$rootScope = $rootScope;
-        this.PipelineValidationService = PipelineValidationService;
-        this.RestApi = RestApi;
-
-        this.currentPipelineModel = {};
-        this.idCounter = 0;
-
-        this.currentZoomLevel = 1;
-    }
-
-    $onInit() {
-        this.JsplumbBridge.setContainer(this.canvasId);
-        this.initAssembly();
-        this.initPlumb();
-        //this.validatePipeline();
-    }
-
-    validatePipeline() {
-        this.$timeout(() => {
-            this.pipelineValid = this.PipelineValidationService.isValidPipeline(this.rawPipelineModel);
-        }, 200);
-    }
-
-    $onDestroy() {
-        this.JsplumbBridge.deleteEveryEndpoint();
-        //this.JsplumbBridge.reset();
-        this.plumbReady = false;
-    }
-
-    updateMouseover(elementId) {
-        this.currentMouseOverElement = elementId;
-    }
-
-    updateOptionsClick(elementId) {
-        if (this.currentMouseOverElement == elementId) {
-            this.currentMouseOverElement = "";
-        } else {
-            this.currentMouseOverElement = elementId;
-        }
-    }
-
-    getElementCss(currentPipelineElementSettings) {
-        return "position:absolute;"
-            + (this.preview ? "width:75px;" : "width:110px;")
-            + (this.preview ? "height:75px;" : "height:110px;")
-            + "left: " + currentPipelineElementSettings.position.x + "px; "
-            + "top: " + currentPipelineElementSettings.position.y + "px; "
-    }
-
-    getElementCssClasses(currentPipelineElement) {
-        return currentPipelineElement.type + " " + (currentPipelineElement.settings.openCustomize ? "" : "")
-            + currentPipelineElement.settings.connectable + " "
-            + currentPipelineElement.settings.displaySettings;
-    }
-
-    isStreamInPipeline() {
-        return this.isInPipeline('stream');
-    }
-
-    isSetInPipeline() {
-        return this.isInPipeline('set');
-    }
-
-    isInPipeline(type) {
-        return this.rawPipelineModel.some(x => (x.type == type && !(x.settings.disabled)));
-    }
-
-    showMixedStreamAlert() {
-        this.EditorDialogManager.showMixedStreamAlert();
-    }
-
-    initAssembly() {
-        ($('#assembly') as any).droppable({
-            tolerance: "fit",
-            drop: (element, ui) => {
-                if (ui.draggable.hasClass('draggable-icon')) {
-                    this.TransitionService.makePipelineAssemblyEmpty(false);
-                    var pipelineElementConfig = this.JsplumbService.createNewPipelineElementConfig(ui.draggable.data("JSON"), this.PipelineEditorService.getCoordinates(ui, this.currentZoomLevel), false);
-                    if ((this.isStreamInPipeline() && pipelineElementConfig.type == 'set') ||
-                        this.isSetInPipeline() && pipelineElementConfig.type == 'stream') {
-                        this.showMixedStreamAlert();
-                    } else {
-                        this.rawPipelineModel.push(pipelineElementConfig);
-                        if (ui.draggable.hasClass('set')) {
-                            this.$timeout(() => {
-                                this.$timeout(() => {
-                                    this.JsplumbService.setDropped(pipelineElementConfig.payload.DOM, pipelineElementConfig.payload, true, false);
-                                });
-                            });
-                        }
-                        else if (ui.draggable.hasClass('stream')) {
-                            this.checkTopicModel(pipelineElementConfig);
-                        } else if (ui.draggable.hasClass('sepa')) {
-                            this.$timeout(() => {
-                                this.$timeout(() => {
-                                    this.JsplumbService.sepaDropped(pipelineElementConfig.payload.DOM, pipelineElementConfig.payload, true, false);
-                                });
-                            });
-                            //Droppable Actions
-                        } else if (ui.draggable.hasClass('action')) {
-                             this.$timeout(() => {
-                                 this.$timeout(() => {
-                                    this.JsplumbService.actionDropped(pipelineElementConfig.payload.DOM, pipelineElementConfig.payload, true, false);
-                                 });
-                             });
-                        }
-                        if (this.ShepherdService.isTourActive()) {
-                            this.ShepherdService.trigger("drop-" +pipelineElementConfig.type);
-                        }
-                    }
-                }
-                this.JsplumbBridge.repaintEverything();
-                this.validatePipeline();
-                this.triggerPipelineCacheUpdate();
-            }
-
-        }); //End #assembly.droppable()
-        ($("#assembly") as any)
-            .selectable({
-                selected: function (event, ui) {
-                },
-                filter: ".connectable.stream,.connectable.sepa:not('.disabled')",
-                delay: 150
-
-            })
-    }
-    ;
-
-    checkTopicModel(pipelineElementConfig) {
-        this.$timeout(() => {
-            this.$timeout(() => {
-                this.JsplumbService.streamDropped(pipelineElementConfig.payload.DOM, pipelineElementConfig.payload, true, false);
-            });
-        });
-
-        var streamDescription = pipelineElementConfig.payload;
-        if (streamDescription
-                .eventGrounding
-                .transportProtocols[0]
-                .properties.topicDefinition
-                .type === "org.apache.streampipes.model.grounding.WildcardTopicDefinition") {
-            this.EditorDialogManager.showCustomizeStreamDialog(streamDescription);
-        }
-    }
-
-    handleDeleteOption(pipelineElement) {
-        this.JsplumbBridge.removeAllEndpoints(pipelineElement.payload.DOM);
-        angular.forEach(this.rawPipelineModel, pe => {
-           if (pe.payload.DOM == pipelineElement.payload.DOM) {
-               pe.settings.disabled = true;
-           }
-        });
-        if (this.rawPipelineModel.every(pe => pe.settings.disabled)) {
-            this.TransitionService.makePipelineAssemblyEmpty(true);
-        }
-        this.JsplumbBridge.repaintEverything();
-        this.RestApi.updateCachedPipeline(this.rawPipelineModel);
-    }
-
-    initPlumb() {
-
-        this.JsplumbService.prepareJsplumb();
-
-        this.JsplumbBridge.unbind("connection");
-
-        this.JsplumbBridge.bind("connectionMoved", (info, originalEvent) => {
-            var pe = this.objectProvider.findElement(info.newTargetEndpoint.elementId, this.rawPipelineModel);
-            var oldPe = this.objectProvider.findElement(info.originalTargetEndpoint.elementId, this.rawPipelineModel);
-            oldPe.payload.configured = false;
-            pe.payload.configured = false;
-        });
-
-        this.JsplumbBridge.bind("connectionDetached", (info, originalEvent) => {
-            var pe = this.objectProvider.findElement(info.targetEndpoint.elementId, this.rawPipelineModel);
-            pe.payload.configured = false;
-            pe.settings.openCustomize = true;
-            info.targetEndpoint.setType("empty");
-            this.validatePipeline();
-        });
-
-        this.JsplumbBridge.bind("connectionDrag", connection => {
-            this.JsplumbBridge.selectEndpoints().each(function (endpoint) {
-                if (endpoint.isTarget && endpoint.connections.length === 0) {
-                    endpoint.setType("highlight");
-                }
-            });
-
-        });
-        this.JsplumbBridge.bind("connectionAborted", connection => {
-            this.JsplumbBridge.selectEndpoints().each(endpoint => {
-                if (endpoint.isTarget && endpoint.connections.length === 0) {
-                    endpoint.setType("empty");
-                }
-            });
-        })
-
-        this.JsplumbBridge.bind("connection", (info, originalEvent) => {
-            var pe = this.objectProvider.findElement(info.target.id, this.rawPipelineModel);
-            if (pe.settings.openCustomize) {
-                this.currentPipelineModel = this.objectProvider.makePipeline(this.rawPipelineModel);
-                pe.settings.loadingStatus = true;
-                this.objectProvider.updatePipeline(this.currentPipelineModel)
-                    .then(msg => {
-                        let data = msg.data;
-                        pe.settings.loadingStatus = false;
-                        if (data.success) {
-                            info.targetEndpoint.setType("token");
-                            this.validatePipeline();
-                            this.modifyPipeline(data.pipelineModifications);
-                            var sourceEndpoint = this.JsplumbBridge.selectEndpoints({element: info.targetEndpoint.elementId});
-                            if (this.PipelineEditorService.isFullyConnected(pe)) {
-                                if ((pe.payload.staticProperties && pe.payload.staticProperties.length > 0) || this.isCustomOutput(pe)) {
-                                    this.EditorDialogManager.showCustomizeDialog($("#" +pe.payload.DOM), sourceEndpoint, pe.payload, false)
-                                        .then(() => {
-                                            this.JsplumbService.activateEndpoint(pe.payload.DOM, !pe.payload.uncompleted);
-                                        }, () => {
-                                            this.JsplumbService.activateEndpoint(pe.payload.DOM, !pe.payload.uncompleted);
-                                        });
-                                } else {
-                                    this.$rootScope.$broadcast("SepaElementConfigured", pe.payload.DOM);
-                                    pe.payload.configured = true;
-                                }
-                            }
-                        } else {
-                            this.JsplumbBridge.detach(info.connection);
-                                    this.EditorDialogManager.showMatchingErrorDialog(data);
-                        }
-                    });
-            }
-        });
-
-        window.onresize = (event) => {
-            this.JsplumbBridge.repaintEverything();
-        };
-
-        this.$timeout(() => {
-            this.plumbReady = true;
-        }, 100);
-    }
-
-    modifyPipeline(pipelineModifications) {
-        for (var i = 0, modification; modification = pipelineModifications[i]; i++) {
-            var id = modification.domId;
-            if (id !== "undefined") {
-                var pe = this.objectProvider.findElement(id, this.rawPipelineModel);
-                pe.payload.staticProperties = modification.staticProperties;
-                pe.payload.outputStrategies = modification.outputStrategies;
-                pe.payload.inputStreams = modification.inputStreams;
-            }
-        }
-    }
-
-    isCustomOutput(pe) {
-        var custom = false;
-        angular.forEach(pe.payload.outputStrategies, strategy => {
-            if (strategy.type == 'org.apache.streampipes.model.output.CustomOutputStrategy') {
-                custom = true;
-            }
-        });
-        return custom;
-    }
-
-    triggerPipelineCacheUpdate() {
-        this.pipelineCacheRunning = true;
-        this.RestApi.updateCachedPipeline(this.rawPipelineModel).then(msg => {
-           this.pipelineCacheRunning = false;
-           this.pipelineCached = true;
-        });
-    }
-
-
-}
-
-PipelineController.$inject = ['$timeout',
-    'JsplumbService',
-    'PipelineEditorService',
-    'JsplumbBridge',
-    'ObjectProvider',
-    'DialogBuilder',
-    'EditorDialogManager',
-    'TransitionService',
-    'ShepherdService',
-    '$rootScope',
-    'PipelineValidationService',
-    'RestApi'];
\ No newline at end of file
diff --git a/ui/src/app/editor/components/pipeline/pipeline.tmpl.html b/ui/src/app/editor/components/pipeline/pipeline.tmpl.html
deleted file mode 100644
index c8f7565..0000000
--- a/ui/src/app/editor/components/pipeline/pipeline.tmpl.html
+++ /dev/null
@@ -1,45 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-if="pipelineElement.settings.disabled == undefined || !pipelineElement.settings.disabled" ng-repeat="(index, pipelineElement) in ctrl.rawPipelineModel track by $index" style="width:100%;height:100%;z-index:1">
-    <span id="{{pipelineElement.payload.DOM}}" style="{{ctrl.getElementCss(pipelineElement.settings)}}"
-          ng-click="ctrl.updateOptionsClick(pipelineElement.payload.DOM)" ng-mouseover="ctrl.updateMouseover(pipelineElement.payload.DOM)" ng-mouseleave="ctrl.updateMouseover('')">
-        <span style="z-index:5;"
-              ng-class="ctrl.getElementCssClasses(pipelineElement)">
-            <div class="pipeline-element-progress-container sp-fade" ng-if="pipelineElement.settings.loadingStatus">
-                 <md-progress-circular md-mode="indeterminate" class="pipeline-element-progress" md-diameter="40px"></md-progress-circular>
-            </div>
-            <div class="pipeline-element-loading-container sp-fade-opacity" ng-if="pipelineElement.settings.loadingStatus"></div>
-            <div class="pipeline-element-configuration-invalid {{pipelineElement.type === 'stream' ? 'pi-stream' : 'pi-processor'}}" ng-if="pipelineElement.payload.uncompleted">
-                <i class="material-icons pipeline-element-configuration-invalid-icon">
-                warning
-                </i>
-            </div>
-            <pipeline-element pipeline-element="pipelineElement.payload" preview="ctrl.preview"></pipeline-element>
-        </span>
-         <pipeline-element-options ng-if="!ctrl.preview" delete-function="ctrl.handleDeleteOption"
-                                   current-mouse-over-element="ctrl.currentMouseOverElement"
-                                   pipeline-valid="ctrl.pipelineValid"
-                                   all-elements="ctrl.allElements"
-                                   pipeline-element="pipelineElement"
-                                   raw-pipeline-model="ctrl.rawPipelineModel"
-                                   pipeline-element-id="pipelineElement.type == 'stream' ? pipelineElement.payload.elementId : pipelineElement.payload.belongsTo)"
-                                   internal-id="" {{pipelineElement.payload.DOM}}">
-        </pipeline-element-options>
-    </span>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/popup.html b/ui/src/app/editor/components/popup.html
deleted file mode 100644
index 73599c6..0000000
--- a/ui/src/app/editor/components/popup.html
+++ /dev/null
@@ -1,25 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<h3 class="popover-title">Help</h3>
- 
-<div class="popover-content">
-    <p><a ng-click="explain()">What is a {{currentStaticProperty.type | capitalize}}?</a></p>
- 	<p><a ng-click="explain()">What is this element?</a></p>
-    <p>{{currentStaticProperty.description}}</p>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/replaceoutput/replaceoutput.component.ts b/ui/src/app/editor/components/replaceoutput/replaceoutput.component.ts
deleted file mode 100644
index 913e18a..0000000
--- a/ui/src/app/editor/components/replaceoutput/replaceoutput.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {ReplaceOutputController} from "./replaceoutput.controller";
-
-declare const require: any;
-
-export let ReplaceOutputComponent = {
-    template: require('./replaceoutput.tmpl.html'),
-    bindings: {
-        outputStrategy : "=",
-        restrictedEditMode: "<"
-    },
-    controller: ReplaceOutputController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/replaceoutput/replaceoutput.controller.ts b/ui/src/app/editor/components/replaceoutput/replaceoutput.controller.ts
deleted file mode 100644
index e2bcb63..0000000
--- a/ui/src/app/editor/components/replaceoutput/replaceoutput.controller.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class ReplaceOutputController {
-
-    constructor() {
-
-    }
-    
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/replaceoutput/replaceoutput.tmpl.html b/ui/src/app/editor/components/replaceoutput/replaceoutput.tmpl.html
deleted file mode 100644
index 1df82a3..0000000
--- a/ui/src/app/editor/components/replaceoutput/replaceoutput.tmpl.html
+++ /dev/null
@@ -1,30 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div ng-repeat="replaceOutput in ctrl.outputStrategy.properties.replaceProperties">
-    <md-select ng-model="ctrl.selection[replaceOutput.elementName]"  placeholder="Replace property">
-        <md-option ng-repeat="property in replaceOutput.replaceWithOptions" ng-value="property.properties.elementName">
-            <b>{{property.properties.runtimeName}}</b><br/>
-        </md-option>
-    </md-select>
-    <div ng-show="replaceOutput.renamingAllowed">
-        <md-input-container flex> <label>New property name</label>
-            <input ng-model="replaceOutput.runtimeName" ng-disabled="ctrl.restrictedEditMode"/>
-        </md-input-container>
-    </div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/secret/secret.component.ts b/ui/src/app/editor/components/secret/secret.component.ts
deleted file mode 100644
index 88c7a3e..0000000
--- a/ui/src/app/editor/components/secret/secret.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {SecretController} from "./secret.controller";
-
-declare const require: any;
-
-export let SecretComponent = {
-    template: require('./secret.tmpl.html'),
-    bindings: {
-        staticProperty: "=",
-        customizeForm: "="
-    },
-    controller: SecretController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/secret/secret.controller.ts b/ui/src/app/editor/components/secret/secret.controller.ts
deleted file mode 100644
index 709caee..0000000
--- a/ui/src/app/editor/components/secret/secret.controller.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {OneOfRemoteController} from "../oneof-remote/oneof-remote.controller";
-
-export class SecretController {
-
-    staticProperty: any;
-    selectedEventProperty: any;
-    customizeForm: any;
-
-    $scope: any;
-    $rootScope: any;
-
-    constructor($scope, $rootScope) {
-        this.$scope = $scope;
-        this.$rootScope = $rootScope;
-    }
-
-    $onInit() {
-    }
-
-    notifyListeners() {
-        this.$rootScope.$emit(
-            this.staticProperty.properties.internalName,
-            this.customizeForm[this.staticProperty.properties.internalName].$valid);
-    }
-
-    applyChanges() {
-        this.staticProperty.properties.encrypted=false;
-    }
-}
-
-SecretController.$inject = ['$scope', '$rootScope'];
diff --git a/ui/src/app/editor/components/secret/secret.tmpl.html b/ui/src/app/editor/components/secret/secret.tmpl.html
deleted file mode 100644
index 20a9148..0000000
--- a/ui/src/app/editor/components/secret/secret.tmpl.html
+++ /dev/null
@@ -1,28 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div flex="100"
-     layout="column">
-    <md-input-container>
-        <label>{{ctrl.staticProperty.properties.description}}</label>
-        <input type="password" name="{{ctrl.staticProperty.properties.internalName}}" ng-model="ctrl.staticProperty.properties.value"
-               text-validator="ctrl.staticProperty" ng-blur="ctrl.notifyListeners($event)" ng-change="ctrl.applyChanges()" required/>
-        <span ng-show="ctrl.customizeForm[ctrl.staticProperty.properties.internalName].$touched && ctrl.customizeForm[ctrl.staticProperty.properties.internalName].$error.textValidator">Error</span>
-    </md-input-container>
-
-</div>
diff --git a/ui/src/app/editor/components/topic/topic-selection-dialog.component.ts b/ui/src/app/editor/components/topic/topic-selection-dialog.component.ts
deleted file mode 100644
index b68b28f..0000000
--- a/ui/src/app/editor/components/topic/topic-selection-dialog.component.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {TopicSelectionDialogController} from "./topic-selection-dialog.controller";
-
-declare const require: any;
-
-export let TopicSelectionDialogComponent = {
-    template: require('./topic-selection-dialog.tmpl.html'),
-    bindings: {
-        streamDescription: "=",
-        titleField: "=",
-        topicMappings: "="
-    },
-    controller: TopicSelectionDialogController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/topic/topic-selection-dialog.controller.ts b/ui/src/app/editor/components/topic/topic-selection-dialog.controller.ts
deleted file mode 100644
index 62a0cd1..0000000
--- a/ui/src/app/editor/components/topic/topic-selection-dialog.controller.ts
+++ /dev/null
@@ -1,76 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class TopicSelectionDialogController {
-
-    topicMappings: any;
-    eventProperties: any;
-    streamDescription: any;
-
-    constructor() { }
-
-    $onInit() {
-        angular.forEach(this.topicMappings, topicMapping => {
-            if (!topicMapping.selectedMapping) {
-                topicMapping.selectedMapping = "*";
-            }
-        })
-
-        this.eventProperties = this.getEventProperties();
-    }
-
-    getEventProperties() {
-        return this.streamDescription.eventSchema.eventProperties;
-    }
-
-    getEventProperty(runtimeName) {
-        var eventProperty = {};
-        angular.forEach(this.getEventProperties(), function (ep) {
-            if (ep.properties.runtimeName == runtimeName) {
-                eventProperty = ep;
-            }
-        })
-        return eventProperty;
-    }
-
-    getTopicDefinition() {
-        return this.streamDescription.eventGrounding
-            .transportProtocols[0]
-            .properties.topicDefinition
-            .properties;
-    }
-
-    getWildcardTopic() {
-        return this.getTopicDefinition()
-            .wildcardTopicName;
-    }
-
-    getLabel(runtimeName) {
-        var ep = this.getEventProperty(runtimeName);
-        return ep['properties'].label + " (" + ep['properties'].description + ")";
-    }
-
-    getPossibleValues(runtimeName) {
-        var ep = this.getEventProperty(runtimeName);
-        return ep['properties'].valueSpecification.properties.runtimeValues;
-    }
-
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/topic/topic-selection-dialog.tmpl.html b/ui/src/app/editor/components/topic/topic-selection-dialog.tmpl.html
deleted file mode 100644
index af74f50..0000000
--- a/ui/src/app/editor/components/topic/topic-selection-dialog.tmpl.html
+++ /dev/null
@@ -1,42 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div layout="column" class="customize-item-main sp-blue-border-nopadding">
-    <div class="customize-item-title sp-blue-bg" layout="row" flex="100" layout-align="space-between center">
-        <div>
-            {{ctrl.titleField}}
-        </div>
-    </div>
-    <div class="customize-item-content">
-        <div ng-repeat="topicMapping in ctrl.topicMappings">
-            <b>{{ctrl.getLabel(topicMapping.mappingId)}}</b>
-            <md-input-container flex="100" layout="column">
-                <md-select class="md-accent"
-                                ng-model="topicMapping.selectedMapping">
-                    <md-option ng-value="'*'" >
-                        All<br/>
-                    </md-option>
-                    <md-option ng-repeat="possibleValue in ctrl.getPossibleValues(topicMapping.mappedRuntimeName)"
-                                     ng-value="possibleValue">
-                        {{possibleValue}}<br/>
-                    </md-option>
-                </md-select>
-            </md-input-container>
-        </div>
-    </div>
-</div>
\ No newline at end of file
diff --git a/ui/src/app/editor/components/userdefinedoutput/user-defined-output.component.ts b/ui/src/app/editor/components/userdefinedoutput/user-defined-output.component.ts
deleted file mode 100644
index d89210e..0000000
--- a/ui/src/app/editor/components/userdefinedoutput/user-defined-output.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {UserDefinedOutputController} from "./user-defined-output.controller";
-
-declare const require: any;
-
-export let UserDefinedOutputComponent = {
-    template: require('./user-defined-output.tmpl.html'),
-    bindings: {
-        outputStrategy: "=",
-        selectedElement: "=",
-        customizeForm: "=",
-        restrictedEditMode: "<"
-    },
-    controller: UserDefinedOutputController,
-    controllerAs: 'ctrl'
-};
diff --git a/ui/src/app/editor/components/userdefinedoutput/user-defined-output.controller.ts b/ui/src/app/editor/components/userdefinedoutput/user-defined-output.controller.ts
deleted file mode 100644
index d605049..0000000
--- a/ui/src/app/editor/components/userdefinedoutput/user-defined-output.controller.ts
+++ /dev/null
@@ -1,87 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {RdfId} from "../../../platform-services/tsonld/RdfId";
-
-export class UserDefinedOutputController {
-
-    private prefix = "urn:streampipes.org:spi:";
-    private chars = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
-
-    outputStrategy: any;
-    selectedElement: any;
-    collectedPropertiesFirstStream: any;
-    collectedPropertiesSecondStream: any;
-    customizeForm: any;
-
-    primitiveClasses = [{"label": "String", "id": "http://www.w3.org/2001/XMLSchema#string"},
-        {"label": "Boolean", "id": "http://www.w3.org/2001/XMLSchema#boolean"},
-        {"label": "Integer", "id": "http://www.w3.org/2001/XMLSchema#integer"},
-        {"label": "Long", "id": "http://www.w3.org/2001/XMLSchema#long"},
-        {"label": "Double", "id": "http://www.w3.org/2001/XMLSchema#double"},
-        {"label": "Float", "id": "http://www.w3.org/2001/XMLSchema#float"}];
-
-    constructor() {
-
-    }
-
-    $onInit() {
-        if (!this.outputStrategy.properties.eventProperties) {
-            this.outputStrategy.properties.eventProperties = [];
-        }
-    }
-
-    applyDefaultSchema() {
-        this.outputStrategy.properties.eventProperties =
-            this.selectedElement.inputStreams[0].eventSchema.eventProperties;
-    }
-
-    removeProperty(ep: any) {
-        this.outputStrategy.properties.eventProperties
-            .splice(this.outputStrategy.properties.eventProperties.indexOf(ep), 1);
-    }
-
-    addProperty() {
-        this.outputStrategy.properties.eventProperties.push(this.makeDefaultProperty());
-    }
-
-    makeDefaultProperty() {
-        let ep = {} as any;
-        ep.type = "org.apache.streampipes.model.schema.EventPropertyPrimitive";
-        ep.properties = {};
-        ep.properties.domainProperties = [];
-        ep.properties.elementId = "urn:streampipes.org:spi:eventpropertyprimitive:" + this.makeId();
-
-        return ep;
-    }
-
-   makeId() {
-        return this.prefix + this.randomString(6);
-    }
-
-    randomString(length) {
-        let result = '';
-        for (let i = length; i > 0; --i) result += this.chars[Math.floor(Math.random() * this.chars.length)];
-        return result;
-    }
-
-
-
-
-
-}
\ No newline at end of file
diff --git a/ui/src/app/editor/components/userdefinedoutput/user-defined-output.tmpl.html b/ui/src/app/editor/components/userdefinedoutput/user-defined-output.tmpl.html
deleted file mode 100644
index ad56102..0000000
--- a/ui/src/app/editor/components/userdefinedoutput/user-defined-output.tmpl.html
+++ /dev/null
@@ -1,55 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div flex="100" layout="row" layout-align="start center" style="margin-bottom:20px;">
-    <sp-button sp-button-blue sp-button-small-padding ng-click="ctrl.applyDefaultSchema()" ng-disabled="ctrl.restrictedEditMode">Use input schema
-    </sp-button>&nbsp;&nbsp;
-</div>
-
-<div flex="100" layout="row" ng-repeat="ep in ctrl.outputStrategy.properties.eventProperties track by $index">
-    <div layout="column" flex="30">
-        <md-input-container flex="100">
-            <label>Runtime name</label>
-            <input ng-model="ep.properties.runtimeName" ng-disabled="ctrl.restrictedEditMode">
-        </md-input-container>
-    </div>
-    <div layout="column" flex="30">
-        <md-input-container>
-            <label>Runtime type</label>
-            <md-select ng-model="ep.properties.runtimeType" ng-disabled="ctrl.restrictedEditMode">
-                <md-option ng-repeat="primitive in ctrl.primitiveClasses" ng-value="primitive.id">
-                    {{primitive.label}}
-                </md-option>
-            </md-select>
-        </md-input-container>
-    </div>
-    <div layout="column" flex="30">
-        <md-input-container flex="100">
-            <label>Semantic type</label>
-            <input ng-model="ep.properties.domainProperties[0]" ng-disabled="ctrl.restrictedEditMode">
-        </md-input-container>
-    </div>
-    <div layout="column" flex="10">
-        <md-button class="md-icon-button" ng-click="ctrl.removeProperty(ep)" ng-disabled="ctrl.restrictedEditMode">
-            <i class="material-icons">delete</i>
-        </md-button>
-    </div>
-</div>
-<md-button ng-click="ctrl.addProperty()" ng-disabled="ctrl.restrictedEditMode">
-    Add Field
-</md-button>
diff --git a/ui/src/app/editor-v2/constants/editor.constants.ts b/ui/src/app/editor/constants/editor.constants.ts
similarity index 100%
rename from ui/src/app/editor-v2/constants/editor.constants.ts
rename to ui/src/app/editor/constants/editor.constants.ts
diff --git a/ui/src/app/editor-v2/dialog/compatible-elements/compatible-elements.component.html b/ui/src/app/editor/dialog/compatible-elements/compatible-elements.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/compatible-elements/compatible-elements.component.html
rename to ui/src/app/editor/dialog/compatible-elements/compatible-elements.component.html
diff --git a/ui/src/app/editor-v2/dialog/compatible-elements/compatible-elements.component.scss b/ui/src/app/editor/dialog/compatible-elements/compatible-elements.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/compatible-elements/compatible-elements.component.scss
rename to ui/src/app/editor/dialog/compatible-elements/compatible-elements.component.scss
diff --git a/ui/src/app/editor-v2/dialog/compatible-elements/compatible-elements.component.ts b/ui/src/app/editor/dialog/compatible-elements/compatible-elements.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/dialog/compatible-elements/compatible-elements.component.ts
rename to ui/src/app/editor/dialog/compatible-elements/compatible-elements.component.ts
diff --git a/ui/src/app/editor/dialog/customize-pipeline-element/customize.controller.ts b/ui/src/app/editor/dialog/customize-pipeline-element/customize.controller.ts
deleted file mode 100644
index 0c3558c..0000000
--- a/ui/src/app/editor/dialog/customize-pipeline-element/customize.controller.ts
+++ /dev/null
@@ -1,151 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-import {ShepherdService} from "../../../services/tour/shepherd.service";
-
-export class CustomizeController {
-
-    selectedElement: any;
-    selection: any;
-    matchingSelectionLeft: any;
-    matchingSelectionRight: any;
-    invalid: any;
-    helpDialogVisible: any;
-    currentStaticProperty: any;
-    validationErrors: any;
-    configVisible: any;
-    displayRecommended: boolean;
-    sourceEndpoint: any;
-    $mdDialog: any;
-    $rootScope: any;
-    sepa: any;
-    customizeForm: any;
-    ShepherdService: ShepherdService;
-    showDocumentation: boolean = false;
-    restrictedEditMode: boolean;
-
-    constructor($rootScope, $mdDialog, elementData, sourceEndpoint, sepa, restrictedEditMode, ShepherdService) {
-        this.selectedElement = sepa;
-        this.selection = [];
-        this.matchingSelectionLeft = [];
-        this.matchingSelectionRight = [];
-        this.invalid = false;
-        this.helpDialogVisible = false;
-        this.validationErrors = [];
-        this.configVisible = false;
-        this.displayRecommended = true;
-        this.sourceEndpoint = sourceEndpoint;
-        this.$mdDialog = $mdDialog;
-        this.$rootScope = $rootScope;
-        this.ShepherdService = ShepherdService;
-        this.restrictedEditMode = restrictedEditMode;
-    }
-
-    $onInit() {
-        if (this.ShepherdService.isTourActive()) {
-            this.ShepherdService.trigger("customize-" +this.selectedElement.type);
-        }
-    }
-
-    toggleHelpDialog() {
-        this.helpDialogVisible = !this.helpDialogVisible;
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    };
-
-    cancel() {
-        if (this.customizeForm.$invalid) {
-            this.selectedElement.uncompleted = true;
-        }
-        this.$mdDialog.cancel();
-    };
-
-    setSelectValue(c, q) {
-        angular.forEach(q, function (item) {
-            item.selected = false;
-        });
-
-        c.selected = true;
-    };
-
-    /**
-     * saves the parameters in the current element's data with key "options"
-     */
-    saveProperties() {
-        if (this.validate()) {
-            this.selectedElement.uncompleted = false;
-            this.$rootScope.$broadcast("SepaElementConfigured", this.selectedElement.DOM);
-            this.selectedElement.configured = true;
-            this.hide();
-            if (this.sourceEndpoint) {
-                this.sourceEndpoint.setType("token");
-            }
-            if (this.ShepherdService.isTourActive()) {
-                this.ShepherdService.trigger("save-" +this.selectedElement.type);
-            }
-        } else {
-            this.invalid = true;
-        }
-
-    }
-
-    validate() {
-        this.validationErrors = [];
-        var valid = true;
-
-        angular.forEach(this.selectedElement.staticProperties, staticProperty => {
-            if (staticProperty.properties.staticPropertyType === 'OneOfStaticProperty' ||
-                staticProperty.properties.staticPropertyType === 'AnyStaticProperty') {
-                var anyOccurrence = false;
-                angular.forEach(staticProperty.properties.options, option => {
-                    if (option.selected) anyOccurrence = true;
-                });
-                if (!anyOccurrence) valid = false;
-            } else if (staticProperty.properties.staticPropertyType === 'MappingPropertyUnary') {
-                if (!staticProperty.properties.selectedProperty) {
-                    valid = false;
-                }
-
-            } else if (staticProperty.properties.staticPropertyType === 'MappingPropertyNary') {
-                if (staticProperty.properties.valueRequired) {
-                    if (!staticProperty.properties.selectedProperties ||
-                        !(staticProperty.properties.selectedProperties.length > 0)) {
-                        valid = false;
-                    }
-                }
-            }
-        });
-
-        angular.forEach(this.selectedElement.outputStrategies, strategy => {
-            if (strategy.type == 'org.apache.streampipes.model.output.CustomOutputStrategy') {
-                if (!strategy.properties.selectedPropertyKeys && !(strategy.properties.selectedPropertyKeys.length > 0)) {
-                    valid = false;
-                }
-            }
-            // TODO add replace output strategy
-            // TODO add support for replace output strategy
-        });
-
-        return valid;
-    }
-}
-
-CustomizeController.$inject = ['$rootScope', '$mdDialog', 'elementData', 'sourceEndpoint', 'sepa', 'restrictedEditMode', 'ShepherdService'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/customize-pipeline-element/customizeElementDialog.tmpl.html b/ui/src/app/editor/dialog/customize-pipeline-element/customizeElementDialog.tmpl.html
deleted file mode 100644
index 87cafed..0000000
--- a/ui/src/app/editor/dialog/customize-pipeline-element/customizeElementDialog.tmpl.html
+++ /dev/null
@@ -1,161 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<div flex="{{ctrl.showDocumentation ? 90 : 70}}" layout="row" style="max-height:80%">
-    <div flex="{{ctrl.showDocumentation ? 50 : 100}}">
-        <md-dialog aria-label="Customize" flex="100" class="colored-frame">
-            <md-toolbar>
-                <div class="md-toolbar-tools">
-                    <h2>Customize {{ctrl.sepa.name}}</h2>
-                    <span flex></span>
-                    <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                        <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-                    </md-button>
-                </div>
-            </md-toolbar>
-            <md-dialog-content flex="100">
-                <div flex="100" layout="row"
-                     style="border-bottom:1px solid #ccc;padding-left:10px;padding-right:10px;background-color:#f6f6f6">
-                    <div flex="100" layout="row" layout-align="end end">
-                        <md-switch ng-model="ctrl.showDocumentation" aria-label="Switch 1" ng-disabled="!ctrl.selectedElement.includesAssets">
-                            Show documentation
-                        </md-switch>
-                        <md-switch ng-model="ctrl.displayRecommended" aria-label="Switch 1">
-                            Show only recommended settings
-                        </md-switch>
-                    </div>
-                </div>
-                <div flex="100" class="md-dialog-content" layout="row">
-                    <form name="ctrl.customizeForm" flex="100">
-                        <div flex="100" layout="column">
-                            <div layout="column" class="customize-item-main-help">
-                                <div class="customize-item-title-help" flex="100" layout="row">
-                                    <div flex="70" layout="row" layout-align="start center"
-                                         ng-click="ctrl.toggleHelpDialog()">
-                                        <i class="material-icons" style="color: white;">help</i> &nbsp;What's this
-                                        component doing?
-                                    </div>
-                                    <div flex="30" layout="row" layout-align="end center" style="padding-left:10px;">
-                                        <md-button class="md-icon-button" ng-if="ctrl.helpDialogVisible"
-                                                   ng-click="ctrl.toggleHelpDialog()">
-                                            <i class="material-icons" style="color: white;">arrow_drop_up</i>
-                                        </md-button>
-                                        <md-button class="md-icon-button" ng-if="!ctrl.helpDialogVisible"
-                                                   ng-click="ctrl.toggleHelpDialog()">
-                                            <i class="material-icons" style="color: white;">arrow_drop_down</i>
-                                        </md-button>
-                                    </div>
-                                </div>
-                                <div class="customize-item-content" ng-if="ctrl.helpDialogVisible">
-                                    <i>{{ctrl.selectedElement.description}}</i>
-                                    <div ng-show="ctrl.elementData.description == ''">(Sorry, no further description
-                                        available)
-                                    </div>
-
-                                </div>
-                            </div>
-                        </div>
-                        <div flex="100" layout="column" ng-if="ctrl.restrictedEditMode">
-                            <div layout="column" class="customize-item-main-help" style="border: 2px solid #ffc400">
-                                <div class="customize-item-title-help" style="background: #ffc400;" flex="100"
-                                     layout="row">
-                                    You can only modify things that don't affect your pipeline structure. To fully
-                                    modify this element, make sure that it doesn't connect to any successors (remove
-                                    outgoing connectors).
-                                </div>
-                            </div>
-                        </div>
-                        <div ng-repeat="staticProperty in ctrl.selectedElement.staticProperties">
-                                    <customize-dialog customize-form="ctrl.customizeForm"
-                                                      selected-element="ctrl.selectedElement"
-                                                      static-property="staticProperty"
-                                                      display-recommended="ctrl.displayRecommended"
-                                                      restricted-edit-mode="ctrl.restrictedEditMode">
-                                    </customize-dialog>
-
-                        </div>
-                        <div ng-repeat="outputStrategy in ctrl.selectedElement.outputStrategies">
-                            <div ng-if="outputStrategy.type === 'org.apache.streampipes.model.output.ReplaceOutputStrategy'">
-                                <div layout="column" class="customize-item-main sp-blue-border-nopadding">
-                                    <div class="customize-item-title sp-blue-bg" layout="row" flex="100">
-                                        <div flex="80" layout="row" layout-align="start center">
-                                            Replace property
-                                        </div>
-                                    </div>
-                                    <div class="customize-item-content">
-                                        <replace-output output-strategy="outputStrategy"
-                                                        restricted-edit-mode="ctrl.restrictedEditMode"></replace-output>
-                                    </div>
-                                </div>
-                            </div>
-                            <div ng-if="outputStrategy.type === 'org.apache.streampipes.model.output.CustomOutputStrategy' ||
-                                        outputStrategy.type === 'org.apache.streampipes.model.output.UserDefinedOutputStrategy'">
-                                <div layout="column" class="customize-item-main sp-blue-border-nopadding">
-                                    <div class="customize-item-title sp-blue-bg" layout="row" flex="100">
-                                        <div flex="80" layout="row" layout-align="start center">
-                                            Select Output
-                                        </div>
-                                        <div flex="20" layout="row" layout-align="end center"
-                                             style="padding-left:10px;">
-
-                                        </div>
-                                    </div>
-                                    <div class="customize-item-content" ng-if="outputStrategy.type === 'org.apache.streampipes.model.output.CustomOutputStrategy'">
-                                        <custom-output output-strategy="outputStrategy"
-                                                       selected-element="ctrl.selectedElement"
-                                                       customize-form="ctrl.customizeForm"
-                                                       restricted-edit-mode="ctrl.restrictedEditMode">
-                                        </custom-output>
-                                    </div>
-                                    <div class="customize-item-content" ng-if="outputStrategy.type === 'org.apache.streampipes.model.output.UserDefinedOutputStrategy'">
-                                        <user-defined-output output-strategy="outputStrategy"
-                                                       selected-element="ctrl.selectedElement"
-                                                       customize-form="ctrl.customizeForm"
-                                                       restricted-edit-mode="ctrl.restrictedEditMode">
-                                        </user-defined-output>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div ng-show="ctrl.invalid">
-                            <h3>Please enter all required parameters.</h3>
-                            <div ng-repeat="error in ctrl.validationErrors track by $index">
-                                <h4>{{error}}</h4>
-                            </div>
-                        </div>
-                    </form>
-                </div>
-            </md-dialog-content>
-            <md-dialog-actions layout="row">
-                <sp-button sp-button-gray ng-click="ctrl.cancel()">
-                    Close
-                </sp-button>
-                <sp-button id="save-customize-button" sp-button-blue ng-disabled="ctrl.customizeForm.$invalid" type="submit"
-                           ng-click="ctrl.saveProperties()">
-                    Save
-                </sp-button>
-                <div id="tutorial-placeholder"></div>
-            </md-dialog-actions>
-        </md-dialog>
-    </div>
-    <div ng-if="ctrl.showDocumentation" flex="{{ctrl.showDocumentation ? 50 : 0}}" style="max-height:80%;" class="sp-fade-only-enter">
-        <div flex="100" class="md-dialog-content" layout="row">
-            <pipeline-element-documentation use-styling="true" app-id="ctrl.selectedElement.appId"></pipeline-element-documentation>
-        </div>
-    </div>
-</div>
diff --git a/ui/src/app/editor-v2/dialog/customize/customize.component.html b/ui/src/app/editor/dialog/customize/customize.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/customize/customize.component.html
rename to ui/src/app/editor/dialog/customize/customize.component.html
diff --git a/ui/src/app/editor-v2/dialog/customize/customize.component.scss b/ui/src/app/editor/dialog/customize/customize.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/customize/customize.component.scss
rename to ui/src/app/editor/dialog/customize/customize.component.scss
diff --git a/ui/src/app/editor-v2/dialog/customize/customize.component.ts b/ui/src/app/editor/dialog/customize/customize.component.ts
similarity index 96%
rename from ui/src/app/editor-v2/dialog/customize/customize.component.ts
rename to ui/src/app/editor/dialog/customize/customize.component.ts
index 76d1fee..e049835 100644
--- a/ui/src/app/editor-v2/dialog/customize/customize.component.ts
+++ b/ui/src/app/editor/dialog/customize/customize.component.ts
@@ -16,14 +16,7 @@
  *
  */
 
-import {
-  AfterContentChecked,
-  AfterViewChecked,
-  AfterViewInit, ChangeDetectorRef,
-  Component,
-  Input,
-  OnInit
-} from "@angular/core";
+import {AfterViewInit, ChangeDetectorRef, Component, Input, OnInit} from "@angular/core";
 import {InvocablePipelineElementUnion, PipelineElementConfig} from "../../model/editor.model";
 import {DialogRef} from "../../../core-ui/dialog/base-dialog/dialog-ref";
 import {JsplumbService} from "../../services/jsplumb.service";
diff --git a/ui/src/app/editor/dialog/help/help-dialog.controller.ts b/ui/src/app/editor/dialog/help/help-dialog.controller.ts
deleted file mode 100644
index f5b244c..0000000
--- a/ui/src/app/editor/dialog/help/help-dialog.controller.ts
+++ /dev/null
@@ -1,130 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class HelpDialogController {
-
-    $mdDialog: any;
-    pipelineElement: any;
-    selectedTab = 0;
-    RestApi: any;
-    latestMeasurements: any;
-    $timeout: any;
-    pollingActive;
-    error: any;
-    ctrl: any;
-
-    dtOptions = {paging: false, searching: false};
-    nsPrefix = "http://www.w3.org/2001/XMLSchema#";
-    tabs = [
-        {
-            title: 'Fields',
-            type: 'fields',
-            targets: ['set', 'stream']
-        },
-        {
-            title: 'Values',
-            type: 'values',
-            targets: ['set', 'stream']
-        },
-        {
-            title: 'Raw',
-            type: 'raw',
-            targets: ['set', 'stream']
-        },
-        {
-            title: 'Documentation',
-            type: 'documentation',
-            targets: ['set', 'stream', 'sepa', 'action']
-        }
-    ];
-
-    constructor($mdDialog, pipelineElement, RestApi, $timeout) {
-        this.$mdDialog = $mdDialog;
-        this.pipelineElement = pipelineElement;
-        this.RestApi = RestApi;
-        this.$timeout = $timeout;
-        this.pollingActive = true;
-        this.error = false;
-    }
-
-    $onInit() {
-        if (this.pipelineElement.type == 'stream') {
-            this.loadCurrentData();
-        }
-    }
-
-    setSelectedTab(type) {
-        this.selectedTab = type;
-    }
-
-    getFriendlyRuntimeType(runtimeType) {
-        if (this.isNumber(runtimeType)) {
-            return "Number";
-        } else if (this.isBoolean(runtimeType)) {
-            return "Boolean";
-        } else {
-            return "Text";
-        }
-    }
-
-    isNumber(runtimeType) {
-        return (runtimeType == (this.nsPrefix + "float")) ||
-            (runtimeType == (this.nsPrefix + "integer")) ||
-            (runtimeType == (this.nsPrefix + "long")) ||
-            (runtimeType == (this.nsPrefix + "double"));
-    }
-
-    isBoolean(runtimeType) {
-        return runtimeType == this.nsPrefix + "boolean";
-    }
-
-    hide() {
-        this.pollingActive = false;
-        this.$mdDialog.hide();
-    };
-
-    cancel() {
-        this.pollingActive = false;
-        this.$mdDialog.cancel();
-    };
-
-    loadCurrentData() {
-        this.RestApi.getRuntimeInfo(this.pipelineElement).then(msg => {
-            let data = msg.data;
-            if (!data.notifications) {
-                this.error = false;
-                this.latestMeasurements = data;
-            } else {
-                this.error = true;
-            }
-            if (this.pollingActive) {
-                this.$timeout(() => {
-                    this.loadCurrentData();
-                }, 1000)
-            }
-        });
-    }
-
-    filterTab(tab) {
-        return tab.targets.indexOf(this.ctrl.pipelineElement.type) != -1;
-    }
-
-
-}
-
-HelpDialogController.$inject = ['$mdDialog', 'pipelineElement', 'RestApi', '$timeout'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/help/help-dialog.tmpl.html b/ui/src/app/editor/dialog/help/help-dialog.tmpl.html
deleted file mode 100644
index b48a556..0000000
--- a/ui/src/app/editor/dialog/help/help-dialog.tmpl.html
+++ /dev/null
@@ -1,103 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Pipeline Element Info" flex="80" style="height:80%;" class="colored-frame">
-    <md-toolbar>
-        <div class="md-toolbar-tools">
-            <h2>Pipeline Element Information</h2>
-            <span flex></span>
-            <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-            </md-button>
-        </div>
-    </md-toolbar>
-
-    <md-dialog-content flex="100" class="md-dialog-content" style="height:100%;">
-        <h4>{{ctrl.pipelineElement.name}}</h4>
-        <p>
-            {{ctrl.pipelineElement.description}}
-        </p>
-
-        <md-tabs md-border-bottom>
-            <md-tab ng-repeat="tab in ctrl.tabs | filter:ctrl.filterTab.bind(this)"
-                    label="{{tab.title}}"
-                    md-on-select="ctrl.setSelectedTab(tab.type)">
-                <md-tab-label>
-                    {{tab.title}}
-                </md-tab-label>
-            </md-tab>
-        </md-tabs>
-
-        <div ng-if="ctrl.selectedTab == 'fields'">
-            <h5>Field Names</h5>
-
-            <div>
-                <table datatable="" dt-options="ctrl.dtOptions" class="row-border hover">
-                    <thead>
-                    <tr>
-                        <th>Field Name</th>
-                        <th>Description</th>
-                        <th>Runtime Name</th>
-                        <th>Type</th>
-                    </tr>
-                    </thead>
-                    <tbody>
-                    <tr ng-repeat="property in ctrl.pipelineElement.eventSchema.eventProperties">
-                        <td>{{property.properties.label ? property.properties.label : "(n/a)"}}</td>
-                        <td>{{property.properties.description ? property.properties.description : "(n/a)"}}</td>
-                        <td>{{property.properties.runtimeName}}</td>
-                        <td>{{ctrl.getFriendlyRuntimeType(property.properties.runtimeType)}}</td>
-                    </tr>
-                    </tbody>
-                </table>
-            </div>
-        </div>
-        <div ng-if="ctrl.selectedTab == 'values'">
-            <div>
-                <table datatable="" dt-options="ctrl.dtOptions" class="row-border hover" ng-if="!ctrl.error">
-                    <thead>
-                    <tr>
-                        <th>Runtime Name</th>
-                        <th>Value</th>
-                    </tr>
-                    </thead>
-                    <tbody>
-                    <tr ng-repeat="property in ctrl.pipelineElement.eventSchema.eventProperties">
-                        <td>{{property.properties.runtimeName}}</td>
-                        <td>{{ctrl.latestMeasurements[property.properties.runtimeName]}}</td>
-                    </tr>
-                    </tbody>
-                </table>
-                <h5 ng-if="ctrl.error">Runtime information is currently not available.</h5>
-            </div>
-        </div>
-        <div ng-if="ctrl.selectedTab == 'raw'">
-            <pre nag-prism source="{{ctrl.latestMeasurements}}" class="language-json line-numbers"
-                 ng-if="!ctrl.error"></pre>
-            <h5 ng-if="ctrl.error">Runtime information is currently not available.</h5>
-        </div>
-        <div ng-if="ctrl.selectedTab == 'documentation'">
-            <pipeline-element-documentation use-styling="false" app-id="ctrl.pipelineElement.appId"></pipeline-element-documentation>
-        </div>
-    </md-dialog-content>
-    <md-dialog-actions layout="row">
-        <sp-button sp-button-gray ng-click="ctrl.hide()">
-            Close
-        </sp-button>
-    </md-dialog-actions>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/dialog/help/help.component.html b/ui/src/app/editor/dialog/help/help.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/help/help.component.html
rename to ui/src/app/editor/dialog/help/help.component.html
diff --git a/ui/src/app/editor-v2/dialog/help/help.component.scss b/ui/src/app/editor/dialog/help/help.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/help/help.component.scss
rename to ui/src/app/editor/dialog/help/help.component.scss
diff --git a/ui/src/app/editor-v2/dialog/help/help.component.ts b/ui/src/app/editor/dialog/help/help.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/dialog/help/help.component.ts
rename to ui/src/app/editor/dialog/help/help.component.ts
diff --git a/ui/src/app/editor-v2/dialog/matching-error/matching-error.component.html b/ui/src/app/editor/dialog/matching-error/matching-error.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/matching-error/matching-error.component.html
rename to ui/src/app/editor/dialog/matching-error/matching-error.component.html
diff --git a/ui/src/app/editor-v2/dialog/matching-error/matching-error.component.scss b/ui/src/app/editor/dialog/matching-error/matching-error.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/matching-error/matching-error.component.scss
rename to ui/src/app/editor/dialog/matching-error/matching-error.component.scss
diff --git a/ui/src/app/editor-v2/dialog/matching-error/matching-error.component.ts b/ui/src/app/editor/dialog/matching-error/matching-error.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/dialog/matching-error/matching-error.component.ts
rename to ui/src/app/editor/dialog/matching-error/matching-error.component.ts
diff --git a/ui/src/app/editor/dialog/matching-error/matching-error.controller.ts b/ui/src/app/editor/dialog/matching-error/matching-error.controller.ts
deleted file mode 100644
index c9e4253..0000000
--- a/ui/src/app/editor/dialog/matching-error/matching-error.controller.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class MatchingErrorController {
-
-    $mdDialog: any;
-    elementData: any;
-    msg: any;
-    statusDetailsVisible: any;
-
-    constructor($mdDialog, elementData) {
-        this.$mdDialog = $mdDialog;
-        this.elementData = elementData;
-        this.msg = elementData;
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    };
-
-    cancel() {
-        this.$mdDialog.cancel();
-    };
-
-    toggleStatusDetailsVisible() {
-        this.statusDetailsVisible = !(this.statusDetailsVisible);
-    }
-}
-
-MatchingErrorController.$inject = ['$mdDialog', 'elementData'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/matching-error/matching-error.tmpl.html b/ui/src/app/editor/dialog/matching-error/matching-error.tmpl.html
deleted file mode 100644
index 7a0759d..0000000
--- a/ui/src/app/editor/dialog/matching-error/matching-error.tmpl.html
+++ /dev/null
@@ -1,64 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Pipeline Status" flex="70">
-    <form>
-        <md-toolbar>
-            <div class="md-toolbar-tools">
-                <h2>Invalid connection</h2>
-                <span flex></span>
-                <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                    <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-                </md-button>
-            </div>
-        </md-toolbar>
-        <md-dialog-content class="md-dialog-content">
-            <div>
-                <h4>These elements can't be connected.</h4>
-                    <h4>The input data stream does not satisfy the requirements specified by the data processor.</h4>
-                    <md-button ng-click="ctrl.toggleStatusDetailsVisible()" type="button" class="md-accent">
-                        <div ng-if="!ctrl.statusDetailsVisible">Show Details</div>
-                        <div ng-if="ctrl.statusDetailsVisible">Hide Details</div>
-                    </md-button>
-                    <div ng-if="ctrl.statusDetailsVisible" ng-repeat="entry in ctrl.msg | orderBy:'-'">
-                        <div flex="100" class="md-whiteframe-z1">
-                            <div flex layout="column" class="md-padding">
-                                <div>
-                                    <md-icon md-svg-icon="action:ic_done_24px" aria-label="Action" class="md-accent"
-                                             ng-show="entry.matchingSuccessful"></md-icon>
-                                    <md-icon md-svg-icon="alert:ic_warning_24px" aria-label="Action" class="md-accent"
-                                             ng-show="!entry.matchingSuccessful"></md-icon>
-                                    <b>{{entry.title}} </b>
-                                </div>
-                                <div flex="column">
-                                    {{entry.requirementSubject}}<br/>
-                                    {{entry.reasonText}}
-                                </div>
-                            </div>
-                        </div>
-                        <p/>
-                    </div>
-            </div>
-        </md-dialog-content>
-        <md-dialog-actions layout="row">
-            <sp-button sp-button-gray ng-click="ctrl.hide()">
-                Close
-            </sp-button>
-        </md-dialog-actions>
-    </form>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.controller.ts b/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.controller.ts
deleted file mode 100644
index 8943475..0000000
--- a/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.controller.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class MissingElementsForTutorialDialogController {
-
-    $mdDialog: any;
-    missingElements: any;
-
-    constructor($mdDialog, missingElements) {
-        this.$mdDialog = $mdDialog;
-        this.missingElements = missingElements;
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    };
-
-    cancel() {
-        this.$mdDialog.cancel();
-    };
-}
-
-MissingElementsForTutorialDialogController.$inject = ['$mdDialog', 'pipelineElements'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.tmpl.html b/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.tmpl.html
deleted file mode 100644
index 3f71966..0000000
--- a/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial-dialog.tmpl.html
+++ /dev/null
@@ -1,46 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Missing Elements" flex="70" style="height:50%;">
-    <md-toolbar>
-        <div class="md-toolbar-tools">
-            <h2>Tutorial requires pipeline elements</h2>
-            <span flex></span>
-            <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-            </md-button>
-        </div>
-    </md-toolbar>
-
-    <md-dialog-content flex="100" class="md-dialog-content">
-        <div flex="100" layout="column">
-            <div flex="100" layout="column">
-                <h4>The tutorial requires pipeline elements that are not yet installed.</h4>
-                <h5>Install the following pipeline elements and start the tutorial again:</h5>
-                <div ng-repeat="missingElement in ctrl.missingElements">
-                    <li><b>{{missingElement.name}}</b> <i>({{missingElement.appId}})</i></li>
-                </div>
-            </div>
-        </div>
-    </md-dialog-content>
-    <md-dialog-actions layout="row">
-        <sp-button sp-button-gray ng-click="ctrl.hide()">
-            Close
-        </sp-button>
-    </md-dialog-actions>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.html b/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.html
rename to ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.html
diff --git a/ui/src/app/editor-v2/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.scss b/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.scss
rename to ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.scss
diff --git a/ui/src/app/editor-v2/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.ts b/ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.ts
rename to ui/src/app/editor/dialog/missing-elements-for-tutorial/missing-elements-for-tutorial.component.ts
diff --git a/ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.controller.ts b/ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.controller.ts
deleted file mode 100644
index 9de251c..0000000
--- a/ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.controller.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class PossibleElementsController {
-
-    $mdDialog: any;
-    ElementIconText: any;
-    rawPipelineModel: any;
-    pipelineElementDomId: any;
-    possibleElements: any;
-    JsplumbService: any;
-
-    constructor($mdDialog, ElementIconText, JsplumbService, rawPipelineModel, possibleElements, pipelineElementDomId) {
-        this.$mdDialog = $mdDialog;
-        this.ElementIconText = ElementIconText;
-        this.rawPipelineModel = rawPipelineModel;
-        this.pipelineElementDomId = pipelineElementDomId;
-        this.possibleElements = possibleElements;
-        this.JsplumbService = JsplumbService;
-    }
-
-    create(possibleElement) {
-        this.JsplumbService.createElement(this.rawPipelineModel, possibleElement, this.pipelineElementDomId);
-        this.hide();
-    }
-
-    iconText(elementId) {
-        return this.ElementIconText.getElementIconText(elementId);
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    };
-
-    cancel() {
-        this.$mdDialog.cancel();
-    };
-}
-
-PossibleElementsController.$inject = ['$mdDialog', 'ElementIconText', 'JsplumbService', 'rawPipelineModel', 'possibleElements', 'pipelineElementDomId'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.tmpl.html b/ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.tmpl.html
deleted file mode 100644
index 8129df5..0000000
--- a/ui/src/app/editor/dialog/possible-elements/possible-elements-dialog.tmpl.html
+++ /dev/null
@@ -1,50 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Compatible Elements" flex="80" style="height:80%;">
-    <md-toolbar>
-        <div class="md-toolbar-tools">
-            <h2>Compatible Elements</h2>
-            <span flex></span>
-            <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-            </md-button>
-        </div>
-    </md-toolbar>
-
-    <md-dialog-content flex="100" class="md-dialog-content">
-        <md-list>
-        <md-list-item class="md-2-line" ng-repeat="possibleElement in ctrl.possibleElements | orderBy: '+name'" ng-click="ctrl.create(possibleElement)">
-            <div class="draggable-icon-preview {{possibleElement.type}}">
-                <pipeline-element pipeline-element="possibleElement" icon-size="true"></pipeline-element>
-            </div>
-            <div class="md-list-item-text">
-                <h3>{{ possibleElement.name }}</h3>
-                <p>{{ possibleElement.description }}</p>
-            </div>
-            <md-divider ></md-divider>
-        </md-list-item>
-        </md-list>
-
-    </md-dialog-content>
-    <md-dialog-actions layout="row">
-        <sp-button sp-button-gray ng-click="ctrl.hide()">
-            Close
-        </sp-button>
-    </md-dialog-actions>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/dialog/save-pipeline/save-pipeline.component.html b/ui/src/app/editor/dialog/save-pipeline/save-pipeline.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/save-pipeline/save-pipeline.component.html
rename to ui/src/app/editor/dialog/save-pipeline/save-pipeline.component.html
diff --git a/ui/src/app/editor-v2/dialog/save-pipeline/save-pipeline.component.scss b/ui/src/app/editor/dialog/save-pipeline/save-pipeline.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/save-pipeline/save-pipeline.component.scss
rename to ui/src/app/editor/dialog/save-pipeline/save-pipeline.component.scss
diff --git a/ui/src/app/editor-v2/dialog/save-pipeline/save-pipeline.component.ts b/ui/src/app/editor/dialog/save-pipeline/save-pipeline.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/dialog/save-pipeline/save-pipeline.component.ts
rename to ui/src/app/editor/dialog/save-pipeline/save-pipeline.component.ts
diff --git a/ui/src/app/editor/dialog/save-pipeline/save-pipeline.controller.ts b/ui/src/app/editor/dialog/save-pipeline/save-pipeline.controller.ts
deleted file mode 100644
index 4acce55..0000000
--- a/ui/src/app/editor/dialog/save-pipeline/save-pipeline.controller.ts
+++ /dev/null
@@ -1,151 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import {RestApi} from "../../../services/rest-api.service";
-
-export class SavePipelineController {
-
-    RestApi: RestApi;
-    $mdToast: any;
-    $state: any;
-    $mdDialog: any;
-    pipelineCategories: any;
-    pipeline: any;
-    ObjectProvider: any;
-    startPipelineAfterStorage: any;
-    modificationMode: any;
-    updateMode: any;
-    submitPipelineForm: any;
-    TransitionService: any;
-    ShepherdService: any;
-
-    constructor($mdDialog,
-                $state,
-                RestApi,
-                $mdToast,
-                ObjectProvider,
-                pipeline,
-                modificationMode,
-                TransitionService,
-                ShepherdService) {
-        this.RestApi = RestApi;
-        this.$mdToast = $mdToast;
-        this.$state = $state;
-        this.$mdDialog = $mdDialog;
-        this.pipelineCategories = [];
-        this.pipeline = pipeline;
-        this.ObjectProvider = ObjectProvider;
-        this.modificationMode = modificationMode;
-        this.updateMode = "update";
-        this.TransitionService = TransitionService;
-        this.ShepherdService = ShepherdService;
-    }
-
-    $onInit() {
-        this.getPipelineCategories();
-        if (this.ShepherdService.isTourActive()) {
-            this.ShepherdService.trigger("enter-pipeline-name");
-        }
-
-    }
-
-    triggerTutorial() {
-        if (this.ShepherdService.isTourActive()) {
-            this.ShepherdService.trigger("save-pipeline-dialog");
-        }
-    }
-
-    displayErrors(data) {
-        for (var i = 0, notification; notification = data.notifications[i]; i++) {
-            this.showToast("error", notification.title, notification.description);
-        }
-    }
-
-    displaySuccess(data) {
-        if (data.notifications.length > 0) {
-            this.showToast("success", data.notifications[0].title, data.notifications[0].description);
-        }
-    }
-
-    getPipelineCategories() {
-        this.RestApi.getPipelineCategories()
-            .then(pipelineCategories => {
-                this.pipelineCategories = pipelineCategories.data;
-            });
-
-    };
-
-
-    savePipelineName(switchTab) {
-        if (this.pipeline.name == "") {
-            this.showToast("error", "Please enter a name for your pipeline");
-            return false;
-        }
-
-        let storageRequest;
-
-        if (this.modificationMode && this.updateMode === 'update') {
-            storageRequest = this.RestApi.updatePipeline(this.pipeline);
-        } else {
-            storageRequest = this.RestApi.storePipeline(this.pipeline);
-        }
-
-        storageRequest
-            .then(msg => {
-                let data = msg.data;
-                if (data.success) {
-                    this.afterStorage(data, switchTab);
-                } else {
-                    this.displayErrors(data);
-                }
-            }, data => {
-                this.showToast("error", "Connection Error", "Could not fulfill request");
-            });
-    };
-
-    afterStorage(data, switchTab) {
-        this.displaySuccess(data);
-        this.hide();
-        this.TransitionService.makePipelineAssemblyEmpty(true);
-        this.RestApi.removePipelineFromCache();
-        if (this.ShepherdService.isTourActive()) {
-            this.ShepherdService.hideCurrentStep();
-        }
-        if (switchTab && !this.startPipelineAfterStorage) {
-            this.$state.go("streampipes.pipelines");
-        }
-        if (this.startPipelineAfterStorage) {
-            this.$state.go("streampipes.pipelines", {pipeline: data.notifications[1].description});
-        }
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    };
-
-    showToast(type, title, description?) {
-        this.$mdToast.show(
-            this.$mdToast.simple()
-                .textContent(title)
-                .position("top right")
-                .hideDelay(3000)
-        );
-    }
-}
-
-SavePipelineController.$inject = ['$mdDialog', '$state', 'RestApi', '$mdToast', 'ObjectProvider', 'pipeline', 'modificationMode', 'TransitionService', 'ShepherdService'];
diff --git a/ui/src/app/editor/dialog/save-pipeline/submitPipelineModal.tmpl.html b/ui/src/app/editor/dialog/save-pipeline/submitPipelineModal.tmpl.html
deleted file mode 100644
index 7bacb6f..0000000
--- a/ui/src/app/editor/dialog/save-pipeline/submitPipelineModal.tmpl.html
+++ /dev/null
@@ -1,74 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Save" flex="60">
-    <md-toolbar>
-        <div class="md-toolbar-tools">
-            <h2>Save Pipeline</h2>
-            <span flex></span>
-            <md-button class="md-icon-button" ng-click="ctrl.hide()">
-                <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-            </md-button>
-        </div>
-    </md-toolbar>
-
-    <md-dialog-content flex="100" class="md-dialog-content">
-        <form name="ctrl.submitPipelineForm">
-            <div flex="100" layout="column">
-                <div id="overwriteCheckbox" class="checkbox" ng-show="ctrl.modificationMode">
-                    <md-radio-group class="md-accent" ng-model="ctrl.updateMode">
-                        <md-radio-button ng-value="'update'">
-                            Update pipeline <b>{{ctrl.pipeline.name}}</b>
-                        </md-radio-button>
-                        <md-radio-button ng-value="'clone'">
-                            Create new pipeline
-                        </md-radio-button>
-                    </md-radio-group>
-                </div>
-                <div flex="100" layout="column" ng-if="!ctrl.modificationMode || ctrl.updateMode=='clone'">
-                    <md-input-container flex><label>Pipeline Name</label>
-                        <input name="pipelineName" ng-model="ctrl.pipeline.name" required ng-maxlength="40"/>
-                        <span ng-show="ctrl.submitPipelineForm.pipelineName.$touched && ctrl.submitPipelineForm.pipelineName.$error.required">Please provide a pipeline name.</span>
-                        <span ng-show="ctrl.submitPipelineForm.pipelineName.$error.maxlength">Please provide a shorter pipeline name.</span>
-                    </md-input-container>
-                    <md-input-container flex><label>Description</label>
-                        <input name="pipelineDescription" ng-model="ctrl.pipeline.description" ng-maxlength="80"/>
-                        <span ng-show="ctrl.submitPipelineForm.pipelineDescription.$error.maxlength">Please provide a shorter description.</span>
-                    </md-input-container>
-                </div>
-                <md-checkbox ng-click="ctrl.triggerTutorial()" ng-disabled="false" aria-label="Start Pipeline" ng-model="ctrl.startPipelineAfterStorage">
-                    Start pipeline immediately
-                </md-checkbox>
-            </div>
-        </form>
-    </md-dialog-content>
-    <md-dialog-actions layout="row">
-        <sp-button sp-button-gray ng-click="ctrl.hide()">
-            Close
-        </sp-button>
-        <sp-button sp-button-blue ng-disabled="ctrl.submitPipelineForm.$invalid"
-                   ng-click="ctrl.savePipelineName(false)"
-                   ng-disabled="ctrl.startPipelineAfterStorage">
-            Save
-        </sp-button>
-        <sp-button sp-button-blue ng-disabled="ctrl.submitPipelineForm.$invalid"
-                   ng-click="ctrl.savePipelineName(true)">
-            Save and go to pipeline view
-        </sp-button>
-    </md-dialog-actions>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/topic/topic-selection-modal.controller.ts b/ui/src/app/editor/dialog/topic/topic-selection-modal.controller.ts
deleted file mode 100644
index 0d3615a..0000000
--- a/ui/src/app/editor/dialog/topic/topic-selection-modal.controller.ts
+++ /dev/null
@@ -1,89 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-
-export class TopicSelectionDialog {
-
-    $mdDialog: any;
-    RestApi: any;
-    streamDescription: any;
-    finished: any;
-    platformIdMappings: any;
-    locationIdMappings: any;
-    sensorIdMappings: any;
-    availableMappings: any;
-
-    constructor($mdDialog, RestApi, streamDescription) {
-        this.$mdDialog = $mdDialog;
-        this.RestApi = RestApi;
-        this.streamDescription = streamDescription;
-    }
-
-    $onInit() {
-        this.finished = false;
-        this.platformIdMappings = this.getMappingsByType("PLATFORM_IDENTIFIER");
-        this.locationIdMappings = this.getMappingsByType("LOCATION_IDENTIFIER");
-        this.sensorIdMappings = this.getMappingsByType("SENSOR_IDENTIFIER");
-
-        this.availableMappings = this.getMappings();
-        this.finished = true;
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    }
-
-    cancel() {
-        this.$mdDialog.cancel();
-    }
-
-    getMappings() {
-        return this.getTopicDefinition()
-            .wildcardTopicMappings;
-    }
-
-    getMappingsByType(topicParameterType) {
-        var result = [];
-        angular.forEach(this.getMappings(), topicMapping => {
-            if (topicMapping.topicParameterType == topicParameterType) {
-                result.push(topicMapping);
-            }
-        });
-        return result;
-    }
-
-    getTopicDefinition() {
-        return this.streamDescription.eventGrounding
-            .transportProtocols[0]
-            .properties.topicDefinition
-            .properties;
-    }
-
-    save() {
-        this.RestApi
-            .updateStream(this.streamDescription)
-            .then(msg => {
-                let stream = msg.data;
-                this.streamDescription = stream;
-                this.hide();
-            });
-    }
-}
-
-TopicSelectionDialog.$inject = ['$mdDialog', 'RestApi', 'streamDescription'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/topic/topic-selection-modal.tmpl.html b/ui/src/app/editor/dialog/topic/topic-selection-modal.tmpl.html
deleted file mode 100644
index 3d7f5de..0000000
--- a/ui/src/app/editor/dialog/topic/topic-selection-modal.tmpl.html
+++ /dev/null
@@ -1,54 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Configure Stream" flex="70" style="max-height:80%;">
-    <md-toolbar>
-        <div class="md-toolbar-tools">
-            <h2>Configure Stream</h2>
-            <span flex></span>
-            <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-            </md-button>
-        </div>
-    </md-toolbar>
-
-    <md-dialog-content flex="100" class="md-dialog-content" ng-if="ctrl.finished">
-        <div flex="100" layout="column">
-            <h4>Are you interested in all events produced by this source?</h4>
-            <h5>You can apply the following filters:</h5>
-            <topic-selection-dialog topic-mappings="ctrl.platformIdMappings"
-                                    stream-description="ctrl.streamDescription"
-                                    title-field="'Filter by platform'"></topic-selection-dialog>
-            <topic-selection-dialog topic-mappings="ctrl.locationIdMappings"
-                                    stream-description="ctrl.streamDescription"
-                                    title-field="'Filter by location'"></topic-selection-dialog>
-            <topic-selection-dialog topic-mappings="ctrl.sensorIdMappings"
-                                    stream-description="ctrl.streamDescription"
-                                    title-field="'Filter by sensor'"></topic-selection-dialog>
-        </div>
-
-    </md-dialog-content>
-    <md-dialog-actions layout="row">
-        <sp-button sp-button-gray ng-click="ctrl.hide()">
-            Close
-        </sp-button>
-        <sp-button sp-button-blue type="submit" ng-click="ctrl.save()">
-            Save
-        </sp-button>
-    </md-dialog-actions>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.controller.ts b/ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.controller.ts
deleted file mode 100644
index ebb5c5a..0000000
--- a/ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.controller.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-export class WelcomeTourDialogController {
-
-    $mdDialog: any;
-    ShepherdService: any;
-    user: any;
-    RestApi: any;
-
-    constructor($mdDialog, RestApi, ShepherdService, user) {
-        this.$mdDialog = $mdDialog;
-        this.RestApi = RestApi;
-        this.ShepherdService = ShepherdService;
-        this.user = user;
-    }
-
-    startCreatePipelineTour() {
-        this.$mdDialog.hide();
-        this.ShepherdService.startCreatePipelineTour();
-    }
-
-    hideTourForever() {
-        this.user.hideTutorial = true;
-        this.RestApi.updateUserDetails(this.user).then(data => {
-            this.$mdDialog.hide();
-        });
-    }
-
-    hide() {
-        this.$mdDialog.hide();
-    };
-
-    cancel() {
-        this.$mdDialog.cancel();
-    };
-}
-
-WelcomeTourDialogController.$inject = ['$mdDialog', 'RestApi', 'ShepherdService', 'user'];
\ No newline at end of file
diff --git a/ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.tmpl.html b/ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.tmpl.html
deleted file mode 100644
index 3864b28..0000000
--- a/ui/src/app/editor/dialog/welcome-tour/welcome-tour-dialog.tmpl.html
+++ /dev/null
@@ -1,54 +0,0 @@
-<!--
-  ~ Licensed to the Apache Software Foundation (ASF) under one or more
-  ~ contributor license agreements.  See the NOTICE file distributed with
-  ~ this work for additional information regarding copyright ownership.
-  ~ The ASF licenses this file to You under the Apache License, Version 2.0
-  ~ (the "License"); you may not use this file except in compliance with
-  ~ the License.  You may obtain a copy of the License at
-  ~
-  ~    http://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  ~
-  -->
-
-<md-dialog aria-label="Welcome" flex="70" style="height:80%;" class="colored-frame">
-    <md-toolbar>
-        <div class="md-toolbar-tools">
-            <h2>Welcome to StreamPipes</h2>
-            <span flex></span>
-            <md-button class="md-icon-button" ng-click="ctrl.cancel()">
-                <md-icon md-svg-icon="navigation:ic_close_24px" aria-label="Close dialog"></md-icon>
-            </md-button>
-        </div>
-    </md-toolbar>
-
-    <md-dialog-content layout-align="center center" flex="100" class="md-dialog-content">
-        <div flex="100" layout-align="center center" layout="column">
-            <b><h2 class="welcome-animation">Hello!</h2></b>
-            <b><h3>Thank you for using StreamPipes.</h3></b>
-        </div>
-        <div><img src="assets/img/sp-pipeline-white-small.png"
-                  style="margin-left:auto;margin-right:auto;display:block;">
-        </div>
-        <div flex="100" layout-align="center center" layout="column">
-            <div flex="100" layout-align="center center" layout="column">
-                <b>StreamPipes is your self-service toolbox for real-time analytics.</b>
-                <p>If you are using StreamPipes for the first time, we recommend taking the interactive tour!</p>
-            </div>
-            <sp-button sp-button-blue ng-click="ctrl.startCreatePipelineTour()">Start Tour</sp-button>
-        </div>
-    </md-dialog-content>
-    <md-dialog-actions layout="row">
-        <sp-button sp-button-gray ng-click="ctrl.hideTourForever()">
-            Do not show again
-        </sp-button>
-        <sp-button sp-button-gray ng-click="ctrl.hide()">
-            Close
-        </sp-button>
-    </md-dialog-actions>
-</md-dialog>
\ No newline at end of file
diff --git a/ui/src/app/editor-v2/dialog/welcome-tour/welcome-tour.component.html b/ui/src/app/editor/dialog/welcome-tour/welcome-tour.component.html
similarity index 100%
rename from ui/src/app/editor-v2/dialog/welcome-tour/welcome-tour.component.html
rename to ui/src/app/editor/dialog/welcome-tour/welcome-tour.component.html
diff --git a/ui/src/app/editor-v2/dialog/welcome-tour/welcome-tour.component.scss b/ui/src/app/editor/dialog/welcome-tour/welcome-tour.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/dialog/welcome-tour/welcome-tour.component.scss
rename to ui/src/app/editor/dialog/welcome-tour/welcome-tour.component.scss
diff --git a/ui/src/app/editor-v2/dialog/welcome-tour/welcome-tour.component.ts b/ui/src/app/editor/dialog/welcome-tour/welcome-tour.component.ts
similarity index 100%
rename from ui/src/app/editor-v2/dialog/welcome-tour/welcome-tour.component.ts
rename to ui/src/app/editor/dialog/welcome-tour/welcome-tour.component.ts
diff --git a/ui/src/app/editor-v2/editor.component.html b/ui/src/app/editor/editor.component.html
similarity index 100%
rename from ui/src/app/editor-v2/editor.component.html
rename to ui/src/app/editor/editor.component.html
diff --git a/ui/src/app/editor-v2/editor.component.scss b/ui/src/app/editor/editor.component.scss
similarity index 100%
rename from ui/src/app/editor-v2/editor.component.scss
rename to ui/src/app/editor/editor.component.scss
diff --git a/ui/src/app/editor-v2/editor.component.ts b/ui/src/app/editor/editor.component.ts
similarity index 97%
rename from ui/src/app/editor-v2/editor.component.ts
rename to ui/src/app/editor/editor.component.ts
index f7a3229..20560eb 100644
--- a/ui/src/app/editor-v2/editor.component.ts
+++ b/ui/src/app/editor/editor.component.ts
@@ -19,17 +19,17 @@
 import {Component, Inject, OnInit} from "@angular/core";
 import {EditorService} from "./services/editor.service";
 import {
-    DataProcessorInvocation,
-    DataSinkInvocation,
-    DataSourceDescription,
-    SpDataSet,
-    SpDataStream
+  DataProcessorInvocation,
+  DataSinkInvocation,
+  DataSourceDescription,
+  SpDataSet,
+  SpDataStream
 } from "../core-model/gen/streampipes-model";
 import {PipelineElementService} from "../platform-services/apis/pipeline-element.service";
 import {
-    PipelineElementConfig,
-    PipelineElementType,
-    PipelineElementUnion
+  PipelineElementConfig,
+  PipelineElementType,
+  PipelineElementUnion
 } from "./model/editor.model";
 import {PipelineElementTypeUtils} from "./utils/editor.utils";
 import {AuthStatusService} from "../services/auth-status.service";
diff --git a/ui/src/app/editor/editor.controller.ts b/ui/src/app/editor/editor.controller.ts
deleted file mode 100644
index b308d3f..0000000
--- a/ui/src/app/editor/editor.controller.ts
+++ /dev/null
@@ -1,282 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-import * as angular from 'angular';
-import {AuthStatusService} from "../services/auth-status.service";
-import {RestApi} from "../services/rest-api.service";
-import {ShepherdService} from "../services/tour/shepherd.service";
-import {JsplumbBridge} from "../editor-v2/services/jsplumb-bridge.service";
-import {EditorDialogManager} from "../editor-v2/services/editor-dialog-manager.service";
-
-export class EditorCtrl {
-
-    $rootScope: any;
-    RestApi: RestApi;
-    $stateParams: any;
-    $window: any;
-    JsplumbBridge: JsplumbBridge;
-    EditorDialogManager: EditorDialogManager;
-    AuthStatusService: AuthStatusService;
-    currentElements: any;
-    allElements: any;
-    currentModifiedPipelineId: any;
-    selectedTab: any;
-    minimizedEditorStand: any;
-    rawPipelineModel: any;
-    activeType: any;
-    tabs: any;
... 1106 lines suppressed ...