Fix duplicating table and page in left sidebar

web-frontend/modules/builder/components/sidebar/SidebarComponentBuilder.vue

@@ -25,6 +25,15 @@
             :page="page"
           ></SidebarItemBuilder>
         </ul>
+        <ul v-if="pendingJobs.length" class="tree__subs">
+          <component
+            :is="getPendingJobComponent(job)"
+            v-for="job in pendingJobs"
+            :key="job.id"
+            :job="job"
+          >
+          </component>
+        </ul>
         <a
           v-if="
             $hasPermission(
@@ -82,6 +91,13 @@ export default {
         .map((page) => page)
         .sort((a, b) => a.order - b.order)
     },
+    pendingJobs() {
+      return this.$store.getters['job/getAll'].filter((job) =>
+        this.$registry
+          .get('job', job.type)
+          .isJobPartOfApplication(job, this.application)
+      )
+    },
   },
   methods: {
     selected(application) {
@@ -102,6 +118,9 @@ export default {
         notifyIf(error, 'page')
       }
     },
+    getPendingJobComponent(job) {
+      return this.$registry.get('job', job.type).getSidebarComponent()
+    },
   },
 }
 </script>

web-frontend/modules/database/components/sidebar/Sidebar.vue

@@ -39,6 +39,15 @@
           :table="table"
         ></SidebarItem>
       </ul>
+      <ul v-if="pendingJobs.length" class="tree__subs">
+        <component
+          :is="getPendingJobComponent(job)"
+          v-for="job in pendingJobs"
+          :key="job.id"
+          :job="job"
+        >
+        </component>
+      </ul>
       <a
         v-if="
           $hasPermission(
@@ -88,6 +97,13 @@ export default {
         .map((table) => table)
         .sort((a, b) => a.order - b.order)
     },
+    pendingJobs() {
+      return this.$store.getters['job/getAll'].filter((job) =>
+        this.$registry
+          .get('job', job.type)
+          .isJobPartOfApplication(job, this.application)
+      )
+    },
     ...mapGetters({ isAppSelected: 'application/isSelected' }),
   },
   methods: {
@@ -109,6 +125,9 @@ export default {
         notifyIf(error, 'table')
       }
     },
+    getPendingJobComponent(job) {
+      return this.$registry.get('job', job.type).getSidebarComponent()
+    },
   },
 }
 </script>