From ce238107050aa14c5b2c0e8a64fc5f530ab44c5c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sybren=20A=2E=20St=C3=BCvel?= <sybren@blender.org>
Date: Tue, 18 Oct 2022 10:50:26 +0200
Subject: [PATCH] Cleanup: move JS code close to HTML

Move the JavaScript code in `PopoverEditableJobPriority.vue` up so it sits
next to the HTML.
---
 .../components/PopoverEditableJobPriority.vue | 84 +++++++++----------
 1 file changed, 42 insertions(+), 42 deletions(-)

diff --git a/web/app/src/components/PopoverEditableJobPriority.vue b/web/app/src/components/PopoverEditableJobPriority.vue
index 03307e8b..7fa73011 100644
--- a/web/app/src/components/PopoverEditableJobPriority.vue
+++ b/web/app/src/components/PopoverEditableJobPriority.vue
@@ -22,6 +22,48 @@
   </div>
 </template>
 
+<script setup>
+import { ref } from 'vue';
+
+import { useNotifs } from '@/stores/notifications';
+import { apiClient } from '@/stores/api-query-count';
+import { JobsApi, JobPriorityChange } from '@/manager-api';
+
+const props = defineProps({
+  jobId: String,
+  priority: Number
+});
+
+// Init notification state
+const notifs = useNotifs();
+
+// Init internal state
+const priorityState = ref(props.priority);
+const showPopover = ref(false);
+const errorMessage = ref('');
+
+// Methods
+function updateJobPriority() {
+  const jobPriorityChange = new JobPriorityChange(priorityState.value);
+  const jobsAPI = new JobsApi(apiClient);
+  return jobsAPI.setJobPriority(props.jobId, jobPriorityChange)
+    .then(() => {
+      notifs.add(`Updated job priority to ${priorityState.value}`)
+      showPopover.value = false;
+      errorMessage.value = '';
+    })
+    .catch((err) => {
+      errorMessage.value = err.body.message;
+    });
+}
+
+function togglePopover() {
+  // 'reset' the priorityState to match the actual priority
+  priorityState.value = props.priority;
+  showPopover.value = !showPopover.value;
+}
+</script>
+
 <style scoped>
 .popover-toggle {
   cursor: pointer;
@@ -91,45 +133,3 @@
   color: var(--color-danger);
 }
 </style>
-
-<script setup>
-import { ref } from 'vue';
-
-import { useNotifs } from '@/stores/notifications';
-import { apiClient } from '@/stores/api-query-count';
-import { JobsApi, JobPriorityChange } from '@/manager-api';
-
-const props = defineProps({
-  jobId: String,
-  priority: Number
-});
-
-// Init notification state
-const notifs = useNotifs();
-
-// Init internal state
-const priorityState = ref(props.priority);
-const showPopover = ref(false);
-const errorMessage = ref('');
-
-// Methods
-function updateJobPriority() {
-  const jobPriorityChange = new JobPriorityChange(priorityState.value);
-  const jobsAPI = new JobsApi(apiClient);
-  return jobsAPI.setJobPriority(props.jobId, jobPriorityChange)
-    .then(() => {
-      notifs.add(`Updated job priority to ${priorityState.value}`)
-      showPopover.value = false;
-      errorMessage.value = '';
-    })
-    .catch((err) => {
-      errorMessage.value = err.body.message;
-    });
-}
-
-function togglePopover() {
-  // 'reset' the priorityState to match the actual priority
-  priorityState.value = props.priority;
-  showPopover.value = !showPopover.value;
-}
-</script>