1 files changed, 12 insertions, 16 deletions

diff --git a/app/assets/javascripts/repository/index.js b/app/assets/javascripts/repository/index.js
index 187bbfed125..7f72524b6fe 100644
--- a/app/assets/javascripts/repository/index.js
+++ b/app/assets/javascripts/repository/index.js
@@ -1,30 +1,22 @@
 import Vue from 'vue';
-import { escapeFileUrl } from '../lib/utils/url_utility';
+import { escapeFileUrl, joinPaths, webIDEUrl } from '../lib/utils/url_utility';
 import createRouter from './router';
 import App from './components/app.vue';
 import Breadcrumbs from './components/breadcrumbs.vue';
 import LastCommit from './components/last_commit.vue';
 import TreeActionLink from './components/tree_action_link.vue';
-import WebIdeLink from './components/web_ide_link.vue';
+import WebIdeLink from '~/vue_shared/components/web_ide_link.vue';
 import DirectoryDownloadLinks from './components/directory_download_links.vue';
 import apolloProvider from './graphql';
 import { setTitle } from './utils/title';
 import { updateFormAction } from './utils/dom';
-import { parseBoolean } from '../lib/utils/common_utils';
+import { convertObjectPropsToCamelCase, parseBoolean } from '../lib/utils/common_utils';
 import { __ } from '../locale';
 
 export default function setupVueRepositoryList() {
   const el = document.getElementById('js-tree-list');
   const { dataset } = el;
-  const {
-    canPushCode,
-    projectPath,
-    projectShortPath,
-    forkPath,
-    ref,
-    escapedRef,
-    fullName,
-  } = dataset;
+  const { projectPath, projectShortPath, ref, escapedRef, fullName } = dataset;
   const router = createRouter(projectPath, escapedRef);
 
   apolloProvider.clients.defaultClient.cache.writeData({
@@ -121,6 +113,10 @@ export default function setupVueRepositoryList() {
   const webIdeLinkEl = document.getElementById('js-tree-web-ide-link');
 
   if (webIdeLinkEl) {
+    const { ideBasePath, ...options } = convertObjectPropsToCamelCase(
+      JSON.parse(webIdeLinkEl.dataset.options),
+    );
+
     // eslint-disable-next-line no-new
     new Vue({
       el: webIdeLinkEl,
@@ -128,10 +124,10 @@ export default function setupVueRepositoryList() {
       render(h) {
         return h(WebIdeLink, {
           props: {
-            projectPath,
-            refSha: ref,
-            forkPath,
-            canPushCode: parseBoolean(canPushCode),
+            webIdeUrl: webIDEUrl(
+              joinPaths('/', ideBasePath, 'edit', ref, '-', this.$route.params.path || '', '/'),
+            ),
+            ...options,
           },
         });
       },