From 023d392560cdeb21bf23a09dc8d6c49fd3446548 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sybren=20A=2E=20St=C3=BCvel?= <sybren@blender.org>
Date: Mon, 1 Aug 2022 18:44:50 +0200
Subject: [PATCH] Web: resize the Tasks table after loading the job blocklist

Emit a 'reshuffled' event to let the job view resize the tasks table.
---
 web/app/src/components/jobs/Blocklist.vue | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/web/app/src/components/jobs/Blocklist.vue b/web/app/src/components/jobs/Blocklist.vue
index a0ff9f58..c7950806 100644
--- a/web/app/src/components/jobs/Blocklist.vue
+++ b/web/app/src/components/jobs/Blocklist.vue
@@ -26,10 +26,12 @@
 import { apiClient } from '@/stores/api-query-count';
 import { JobsApi } from '@/manager-api';
 import LinkWorker from '@/components/LinkWorker.vue';
-import { watch, onMounted, inject, ref } from 'vue'
+import { watch, onMounted, inject, ref, nextTick } from 'vue'
 
 // jobID should be the job UUID string.
 const props = defineProps(['jobID']);
+const emit = defineEmits(['reshuffled'])
+
 const jobsApi = new JobsApi(apiClient);
 const isVisible = inject("isVisible");
 const isFetching = ref(false);
@@ -44,9 +46,7 @@ function refreshBlocklist() {
   isFetching.value = true;
   jobsApi.fetchJobBlocklist(props.jobID)
     .then((newBlocklist) => {
-      console.log(`received blocklist for job ${props.jobID}`, newBlocklist);
       blocklist.value = newBlocklist;
-      // TODO: remit 'reshuffled' & handle in parent.
     })
     .catch((error) => {
       errorMsg.value = error.message;
@@ -57,6 +57,9 @@ function refreshBlocklist() {
 }
 
 watch(() => props.jobID, refreshBlocklist);
+watch(blocklist, () => {
+  nextTick(() => { emit("reshuffled") })
+})
 watch(isVisible, refreshBlocklist);
 onMounted(refreshBlocklist);
 </script>