1 files changed, 61 insertions, 0 deletions
diff --git a/app/assets/javascripts/design_management_legacy/index.js b/app/assets/javascripts/design_management_legacy/index.js
new file mode 100644
index 00000000000..1fc5779515a
--- /dev/null
+++ b/app/assets/javascripts/design_management_legacy/index.js
@@ -0,0 +1,61 @@
+// This application is being moved, please do not touch this files
+// Please see https://gitlab.com/gitlab-org/gitlab/-/issues/14744#note_364468096 for details
+
+import $ from 'jquery';
+import Vue from 'vue';
+import createRouter from './router';
+import App from './components/app.vue';
+import apolloProvider from './graphql';
+import getDesignListQuery from './graphql/queries/get_design_list.query.graphql';
+import { DESIGNS_ROUTE_NAME, ROOT_ROUTE_NAME } from './router/constants';
+
+export default () => {
+  const el = document.querySelector('.js-design-management');
+  const badge = document.querySelector('.js-designs-count');
+  const { issueIid, projectPath, issuePath } = el.dataset;
+  const router = createRouter(issuePath);
+
+  $('.js-issue-tabs').on('shown.bs.tab', ({ target: { id } }) => {
+    if (id === 'designs' && router.currentRoute.name === ROOT_ROUTE_NAME) {
+      router.push({ name: DESIGNS_ROUTE_NAME });
+    } else if (id === 'discussion') {
+      router.push({ name: ROOT_ROUTE_NAME });
+    }
+  });
+
+  apolloProvider.clients.defaultClient.cache.writeData({
+    data: {
+      projectPath,
+      issueIid,
+      activeDiscussion: {
+        __typename: 'ActiveDiscussion',
+        id: null,
+        source: null,
+      },
+    },
+  });
+
+  apolloProvider.clients.defaultClient
+    .watchQuery({
+      query: getDesignListQuery,
+      variables: {
+        fullPath: projectPath,
+        iid: issueIid,
+        atVersion: null,
+      },
+    })
+    .subscribe(({ data }) => {
+      if (badge) {
+        badge.textContent = data.project.issue.designCollection.designs.edges.length;
+      }
+    });
+
+  return new Vue({
+    el,
+    router,
+    apolloProvider,
+    render(createElement) {
+      return createElement(App);
+    },
+  });
+};