diff --git a/lib/pipeline/addon/components/pipeline-codemirror/component.js b/lib/pipeline/addon/components/pipeline-codemirror/component.js
index 4da3c037c..0808e4194 100644
--- a/lib/pipeline/addon/components/pipeline-codemirror/component.js
+++ b/lib/pipeline/addon/components/pipeline-codemirror/component.js
@@ -1,5 +1,5 @@
 import Component from 'ember-component';
-import injectService from 'ember-service/inject';
+import { inject as service } from '@ember/service';
 import observer from 'ember-metal/observer';
 import { bind, once, scheduleOnce } from 'ember-runloop';
 import CodeMirror from 'codemirror';
@@ -9,7 +9,7 @@ export default Component.extend({
   layout,
   tagName: 'textarea',
 
-  codeMirror: injectService(),
+  codeMirror: service(),
 
   didInsertElement() {
     this._super(...arguments);
@@ -17,7 +17,6 @@ export default Component.extend({
       var cur = editor.getCursor();
       var end = cur.ch, start = end;
       var matched = this.get('codeMirror').getMatchedHint(editor.getValue(),editor);
-      console.log(matched);
       return {list: matched.matchedArry, from: CodeMirror.Pos(cur.line, start - matched.index), to: CodeMirror.Pos(cur.line, end)};
     });
     this._codeMirror = this.get('codeMirror').fromTextArea(this.get('elementId'), this.get('element'));
diff --git a/lib/pipeline/addon/components/pipeline-input-var-hint/component.js b/lib/pipeline/addon/components/pipeline-input-var-hint/component.js
index 883247650..8d0b3e9c5 100644
--- a/lib/pipeline/addon/components/pipeline-input-var-hint/component.js
+++ b/lib/pipeline/addon/components/pipeline-input-var-hint/component.js
@@ -1,5 +1,6 @@
 import Component from '@ember/component';
 import { inject as service } from '@ember/service';
+import { singleton } from 'pipeline/utils/pipelineStep';
 
 export default Component.extend({
   hintAry: null,
@@ -7,10 +8,6 @@ export default Component.extend({
   positionX: 0,
   positionY: 0,
   codeMirror: service(),
-  didInsertElement(){
-    debugger
-    this.get('codeMirror').set('hintAry', this.get('hintAry'));
-  },
   positionStyle: function(){
     var positionX = this.get('positionX'), positionY=this.get('positionY');
     return [
@@ -157,6 +154,7 @@ export default Component.extend({
   },
   didInsertElement() {
     this._super(...arguments);
+    singleton.hintAry = this.get('hintAry');
     this.$(document).on('keyup', 'input:not(.js-disable-hint)', (e) => {
       $.fn.E_INPUT_HINT.startHint(e.target, ( /*hint*/ ) => {});
     })
diff --git a/lib/pipeline/addon/components/pipeline-logs/component.js b/lib/pipeline/addon/components/pipeline-logs/component.js
index 0bcd16f61..2782d1ab7 100644
--- a/lib/pipeline/addon/components/pipeline-logs/component.js
+++ b/lib/pipeline/addon/components/pipeline-logs/component.js
@@ -12,7 +12,6 @@ export default Component.extend(ThrottledResize, {
   showProtip: true,
   status: 'connecting',
   socket: null,
-  pipeline: service(),
   logHeight: 300,
   globalStore: service(),
   onlyCombinedLog: true,
@@ -74,31 +73,6 @@ export default Component.extend(ThrottledResize, {
       inst = this.get('instance');
       var isFollow = ($body.scrollTop() + $body.outerHeight() + 10) >= body.scrollHeight;
 
-
-      // var logs = '';
-      // message.trim().split(/\n/).forEach((line) => {
-      //   var match = line.match(/^\[?([^ \]]+)\]?\s?/);
-      //   var dateStr, msg;
-      //   if (match) {
-      //     msg = line.substr(match[0].length);
-      //     var date = new Date(match[1] * 1);
-      //     dateStr = '<span class="log-date">' + Util.escapeHtml(date.toLocaleDateString()) + ' ' + Util.escapeHtml(date.toLocaleTimeString()) + ' </span>';
-      //   } else {
-      //     msg = line;
-      //     dateStr = '<span class="log-date">Unknown Date</span>';
-      //   }
-
-      //   // body.insertAdjacentHTML('beforeend',
-      //   //   '<div class="log-msg">' +
-      //   //   dateStr +
-      //   //   AnsiUp.ansi_to_html(Util.escapeHtml(msg)) +
-      //   //   '</div>'
-      //   // );
-      //   logs += '<div class="log-msg">' +
-      //     dateStr +
-      //     AnsiUp.ansi_to_html(Util.escapeHtml(msg)) +
-      //     '</div>';
-      // });
       var logs = message;
 
       var logsAry = inst.activityLogs;
@@ -113,10 +87,7 @@ export default Component.extend(ThrottledResize, {
     };
 
     var activity = inst.activity;
-    // var params = `?activityId=${activity.id}&stageOrdinal=${inst.stageIndex}&stepOrdinal=${inst.stepIndex}`;
-    // var url = ("ws://" + window.location.host + this.get('pipeline.pipelinesEndpoint') + '/ws/log' + params);
-    // var socket = new WebSocket(url);
-    // this.set('socket', socket);
+
     let fetchLog = ()=>{
       if(inst.stageIndex===-1||inst.stepIndex===-1){
         return
diff --git a/lib/pipeline/addon/components/pipeline-stages/component.js b/lib/pipeline/addon/components/pipeline-stages/component.js
index cceb098a5..48e31f0ea 100644
--- a/lib/pipeline/addon/components/pipeline-stages/component.js
+++ b/lib/pipeline/addon/components/pipeline-stages/component.js
@@ -22,15 +22,7 @@ export default Component.extend({
   dragDom: null,
   model: null,
   pipeline: null,
-  envvars: ['CICD_GIT_COMMIT',
-'CICD_GIT_REPO_NAME',
-'CICD_GIT_BRANCH',
-'CICD_GIT_URL',
-'CICD_PIPELINE_ID',
-'CICD_PIPELINE_NAME',
-'CICD_TRIGGER_TYPE',
-'CICD_EXECUTION_ID',
-'CICD_EXECUTION_SEQUENCE'].map(ele=>`\${${ele}}`),
+  envvars: '[]',
   systemVars: null,
   envvarsLoading: true,
   modalService: service('modal'),
@@ -39,6 +31,7 @@ export default Component.extend({
   }.property('editable'),
   init() {
     this._super(...arguments);
+    this.set('envvars', JSON.parse(this.get('envvars')).map(ele=>`\${${ele}}`));
   },
   actions: {
     dragStart: function(content, e) {
diff --git a/lib/pipeline/addon/new-pipeline/route.js b/lib/pipeline/addon/new-pipeline/route.js
index 3ea0651fe..e10a95002 100644
--- a/lib/pipeline/addon/new-pipeline/route.js
+++ b/lib/pipeline/addon/new-pipeline/route.js
@@ -32,7 +32,13 @@ export default Route.extend({
     let accounts = globalStore.findAll('sourceCodeCredential');
     let clusterPipeline = globalStore.find('clusterPipeline', `${clusterId}:${clusterId}`, {forceReload: true});
     let projectDockerCredentials = projectStore.all('dockerCredential');
-    return hash({accounts, clusterPipeline, projectDockerCredentials} ).then(({accounts, clusterPipeline, projectDockerCredentials})=>{
+    return clusterPipeline.then((pipeline)=>{
+      clusterPipeline = pipeline;
+      return clusterPipeline.followLink('envvars')
+    }).then((envvars)=>{
+      return hash({accounts, clusterPipeline, projectDockerCredentials,envvars})
+    })
+    .then(({accounts, clusterPipeline, projectDockerCredentials, envvars})=>{
       let pipeline = globalStore.createRecord({type:'pipeline', projectId , stages: this.get('precanStages')});
       if(!accounts.content.length){
         return {
@@ -40,6 +46,7 @@ export default Route.extend({
           accounts,
           clusterPipeline,
           projectDockerCredentials,
+          envvars,
           repositories: [],
           language: 'Custom'
         };
@@ -50,6 +57,7 @@ export default Route.extend({
             accounts,
             clusterPipeline,
             projectDockerCredentials,
+            envvars,
             repositories: res,
             language: 'Custom'
           }
diff --git a/lib/pipeline/addon/new-pipeline/template.hbs b/lib/pipeline/addon/new-pipeline/template.hbs
index 4b53c3df7..d9147880d 100644
--- a/lib/pipeline/addon/new-pipeline/template.hbs
+++ b/lib/pipeline/addon/new-pipeline/template.hbs
@@ -9,6 +9,7 @@
 <section class="pipeline-container">
   {{pipeline-stages
     clusterPipeline=model.clusterPipeline
+    envvars=model.envvars
     pipeline=model.pipeline
     stagesDraggable=true
     accounts=model.accounts
diff --git a/lib/pipeline/addon/pipeline/route.js b/lib/pipeline/addon/pipeline/route.js
index 2905aba1b..8220323c4 100644
--- a/lib/pipeline/addon/pipeline/route.js
+++ b/lib/pipeline/addon/pipeline/route.js
@@ -24,18 +24,25 @@ export default Route.extend({
     let accounts = globalStore.findAll('sourceCodeCredential');
     let clusterPipeline = globalStore.find('clusterPipeline', `${clusterId}:${clusterId}`);
     let projectDockerCredentials = projectStore.all('dockerCredential');
-    return hash({
+    return clusterPipeline.then((cPipeline)=>{
+      clusterPipeline = cPipeline;
+      return clusterPipeline.followLink('envvars')
+    }).then((envvars)=>{
+      return hash({
         pipeline,
         pipelineHistory,
         accounts,
         clusterPipeline, 
         projectDockerCredentials,
-      }).then(({
+        envvars
+      })
+    }).then(({
         pipeline,
         pipelineHistory,
         accounts,
         clusterPipeline, 
         projectDockerCredentials,
+        envvars
       })=>{
         var piplineObj;
         if(params.mode === 'duplicate'){
@@ -61,6 +68,7 @@ export default Route.extend({
             accounts,
             clusterPipeline, 
             projectDockerCredentials,
+            envvars,
             repositories: [],
           }
         }else{
@@ -73,6 +81,7 @@ export default Route.extend({
                   accounts,
                   clusterPipeline, 
                   projectDockerCredentials,
+                  envvars,
                   repositories: res,
                 }
               })
diff --git a/lib/pipeline/addon/pipeline/template.hbs b/lib/pipeline/addon/pipeline/template.hbs
index d68718f3a..d5584a4c6 100644
--- a/lib/pipeline/addon/pipeline/template.hbs
+++ b/lib/pipeline/addon/pipeline/template.hbs
@@ -16,6 +16,7 @@
 <section class="pipeline-container">
   {{pipeline-stages
     clusterPipeline=model.clusterPipeline
+    envvars=model.envvars
     pipeline=model.pipeline
     stagesDraggable=false
     accounts=model.accounts
diff --git a/lib/pipeline/addon/services/code-mirror.js b/lib/pipeline/addon/services/code-mirror.js
index cb220f762..0c16b8fcf 100644
--- a/lib/pipeline/addon/services/code-mirror.js
+++ b/lib/pipeline/addon/services/code-mirror.js
@@ -1,20 +1,14 @@
 import CodeMirror from 'codemirror';
 import Service from 'ember-service';
+import { singleton } from 'pipeline/utils/pipelineStep';
+import { set, get } from '@ember/object';
 
 export default Service.extend({
   init() {
     this._super(...arguments);
     this._instances = Object.create(null);
   },
-  hintAry: ['CICD_GIT_COMMIT',
-'CICD_GIT_REPO_NAME',
-'CICD_GIT_BRANCH',
-'CICD_GIT_URL',
-'CICD_PIPELINE_ID',
-'CICD_PIPELINE_NAME',
-'CICD_TRIGGER_TYPE',
-'CICD_EXECUTION_ID',
-'CICD_EXECUTION_SEQUENCE'].map(ele=>`\${${ele}}`),
+
   fromTextArea(id, textarea) {
     return this.registerInstance(id, CodeMirror.fromTextArea(textarea));
   },
@@ -37,7 +31,7 @@ export default Service.extend({
     delete this._instances[id];
   },
   getMatchedHint(value, editor) {
-    var hintAry = this.get('hintAry');
+    var hintAry = singleton.hintAry;
     var cur = editor.getCursor();
     var cursorPosition = cur.ch;
     var cursorValue = editor.getLine(cur.line).slice(0, cursorPosition);
diff --git a/lib/pipeline/addon/services/pipeline.js b/lib/pipeline/addon/services/pipeline.js
index 90c3b5632..9f31c19e0 100644
--- a/lib/pipeline/addon/services/pipeline.js
+++ b/lib/pipeline/addon/services/pipeline.js
@@ -1,7 +1,6 @@
 import Service from '@ember/service';
 import { inject as service } from '@ember/service';
 
-
 export default Service.extend({
   globalStore: service(),
   scope: service(),
diff --git a/lib/pipeline/addon/utils/pipelineStep.js b/lib/pipeline/addon/utils/pipelineStep.js
index 21092dc0a..aaeba56ac 100644
--- a/lib/pipeline/addon/utils/pipelineStep.js
+++ b/lib/pipeline/addon/utils/pipelineStep.js
@@ -1,5 +1,9 @@
 const DEFAULT_REGISTRY = 'index.docker.io';
 
+export let singleton = {
+  hintAry: []
+}
+
 export function analyzeImageRepo (images) {
   if(!images){
     return '';
@@ -35,6 +39,7 @@ export function analyzeImageRepo (images) {
 
   return output;
 }
+
 export const environmentTypes = [{
     label: 'C',
     value: 'gcc:latest',