diff --git a/frontend/src/components/Tabs/Tab.vue b/frontend/src/components/Tabs/Tab.vue
deleted file mode 100644
index 32d97c22e..000000000
--- a/frontend/src/components/Tabs/Tab.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<template>
-  <div
-    class="tab-pane"
-    v-show="active"
-    :id="id || title"
-    :class="{ active: active }"
-    :aria-expanded="active"
-  >
-    <slot></slot>
-  </div>
-</template>
-<script>
-export default {
-  name: 'tab-pane',
-  props: ['title', 'id'],
-  inject: ['addTab', 'removeTab'],
-  data() {
-    return {
-      active: false,
-    }
-  },
-  mounted() {
-    this.addTab(this)
-  },
-  destroyed() {
-    if (this.$el && this.$el.parentNode) {
-      this.$el.parentNode.removeChild(this.$el)
-    }
-    this.removeTab(this)
-  },
-}
-</script>
-<style></style>
diff --git a/frontend/src/components/Tabs/Tabs.vue b/frontend/src/components/Tabs/Tabs.vue
deleted file mode 100644
index 211c8d0cd..000000000
--- a/frontend/src/components/Tabs/Tabs.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div>
-    <div
-      :class="[
-        { 'col-md-4': vertical && !tabNavWrapperClasses },
-        { 'col-12': centered && !tabNavWrapperClasses },
-        tabNavWrapperClasses,
-      ]"
-    >
-      <b-nav
-        class="nav-pills"
-        role="tablist"
-        :class="[
-          `nav-pills-${type}`,
-          { 'flex-column': vertical },
-          { 'justify-content-center': centered },
-          tabNavClasses,
-        ]"
-      >
-        <b-nav-item
-          v-for="tab in tabs"
-          class="active"
-          data-toggle="tab"
-          role="tablist"
-          :active="tab.active"
-          :key="tab.id"
-          :href="`#${tab.id}`"
-          @click.prevent="activateTab(tab)"
-          :aria-expanded="tab.active"
-        >
-          <tab-item-content :tab="tab"></tab-item-content>
-        </b-nav-item>
-      </b-nav>
-    </div>
-    <div
-      class="tab-content"
-      :class="[
-        { 'tab-space': !vertical },
-        { 'col-md-8': vertical && !tabContentClasses },
-        tabContentClasses,
-      ]"
-    >
-      <slot></slot>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'tabs',
-  components: {
-    TabItemContent: {
-      props: ['tab'],
-      render(h) {
-        return h('div', [this.tab.$slots.title || this.tab.title])
-      },
-    },
-  },
-  provide() {
-    return {
-      addTab: this.addTab,
-      removeTab: this.removeTab,
-    }
-  },
-  props: {
-    type: {
-      type: String,
-      default: 'primary',
-      validator: (value) => {
-        const acceptedValues = ['primary', 'info', 'success', 'warning', 'danger']
-        return acceptedValues.indexOf(value) !== -1
-      },
-    },
-    activeTab: {
-      type: String,
-      default: '',
-      description: 'Active tab name',
-    },
-    tabNavWrapperClasses: {
-      type: [String, Object],
-      default: '',
-      description: 'ul wrapper css classes',
-    },
-    tabNavClasses: {
-      type: [String, Object],
-      default: '',
-      description: 'ul css classes',
-    },
-    tabContentClasses: {
-      type: [String, Object],
-      default: '',
-      description: 'tab content css classes',
-    },
-    vertical: Boolean,
-    centered: Boolean,
-    value: String,
-  },
-  data() {
-    return {
-      tabs: [],
-    }
-  },
-  methods: {
-    findAndActivateTab(title) {
-      const tabToActivate = this.tabs.find((t) => t.title === title)
-      if (tabToActivate) {
-        this.activateTab(tabToActivate)
-      }
-    },
-    activateTab(tab) {
-      if (this.handleClick) {
-        this.handleClick(tab)
-      }
-      this.deactivateTabs()
-      tab.active = true
-    },
-    deactivateTabs() {
-      this.tabs.forEach((tab) => {
-        tab.active = false
-      })
-    },
-    addTab(tab) {
-      const index = this.$slots.default.indexOf(tab.$vnode)
-      if (!this.activeTab && index === 0) {
-        tab.active = true
-      }
-      if (this.activeTab === tab.name) {
-        tab.active = true
-      }
-      this.tabs.splice(index, 0, tab)
-    },
-    removeTab(tab) {
-      const tabs = this.tabs
-      const index = tabs.indexOf(tab)
-      if (index > -1) {
-        tabs.splice(index, 1)
-      }
-    },
-  },
-  mounted() {
-    this.$nextTick(() => {
-      if (this.value) {
-        this.findAndActivateTab(this.value)
-      }
-    })
-  },
-  watch: {
-    value(newVal) {
-      this.findAndActivateTab(newVal)
-    },
-  },
-}
-</script>
-
-<style scoped></style>
diff --git a/frontend/src/components/index.js b/frontend/src/components/index.js
index 57d9d6a68..7e8285d0f 100755
--- a/frontend/src/components/index.js
+++ b/frontend/src/components/index.js
@@ -1,11 +1,9 @@
 import BaseNav from './Navbar/BaseNav'
 import NavbarToggleButton from './Navbar/NavbarToggleButton'
 
-import TabPane from './Tabs/Tab.vue'
-import Tabs from './Tabs/Tabs.vue'
 import Collapse from './Collapse/Collapse.vue'
 import CollapseItem from './Collapse/CollapseItem.vue'
 
 import SidebarPlugin from './SidebarPlugin'
 
-export { SidebarPlugin, BaseNav, NavbarToggleButton, TabPane, Tabs, Collapse, CollapseItem }
+export { SidebarPlugin, BaseNav, NavbarToggleButton, Collapse, CollapseItem }