Update triage status in the ui without page reloading

Author: ksy36

server/frontend/src/components/Buckets/View.vue

@@ -32,21 +32,19 @@
             </td>
             <td v-else>
               No bug associated.
-              <span
-                v-if="bucket.triage_status"
-                data-testid="triage-status-display"
+              <span v-if="triageStatus" data-testid="triage-status-display"
                 >Marked triaged as:
                 <strong data-testid="triage-status-label">
-                  {{ bucket.triage_status_display }}
+                  {{ triageStatusDisplay }}
                 </strong>
-                on {{ formatDate(bucket.triaged_at) }}.</span
+                on {{ formatDate(triagedAt) }}.</span
               >
               <br v-if="canEdit" /><br v-if="canEdit" />
               <div v-if="canEdit" class="btn-group">
                 <assignbutton :bucket="bucket.id" :providers="providers" />
                 <TriageBucketDropdown
                   :bucket-id="bucket.id"
-                  :current-status="bucket.triage_status"
+                  :current-status="triageStatus"
                   :choices="bucket.triage_status_choices || []"
                   @update="handleTriageStatusUpdate"
                 />
@@ -309,6 +307,9 @@ export default {
       reports: null,
       sortKeys: [...defaultSortKeys],
       totalPages: 1,
+      triageStatus: this.bucket.triage_status,
+      triageStatusDisplay: this.bucket.triage_status_display,
+      triagedAt: this.bucket.triaged_at,
     };
   },
   computed: {
@@ -530,8 +531,13 @@ export default {
     },
     async handleTriageStatusUpdate(newStatus) {
       try {
-        const data = await updateBucketTriageStatus(this.bucket.id, newStatus);
-        window.location.href = data.url;
+        const { bucket } = await updateBucketTriageStatus(
+          this.bucket.id,
+          newStatus,
+        );
+        this.triageStatus = bucket.triage_status;
+        this.triageStatusDisplay = bucket.triage_status_display;
+        this.triagedAt = bucket.triaged_at;
       } catch (err) {
         swal("Oops", errorParser(err), "error");
       }

server/reportmanager/serializers.py

@@ -80,7 +80,7 @@ def to_internal_value(self, data):
 
     def to_representation(self, obj):
         serialized = super().to_representation(obj)
-        serialized["size"] = obj.size
+        serialized["size"] = getattr(obj, "size", None)
         serialized["latest_entry_id"] = getattr(obj, "latest_entry_id", None)
         serialized["latest_report"] = getattr(obj, "latest_report", None)
         serialized["priority_score"] = getattr(obj, "priority_score", None)

server/reportmanager/views.py

@@ -1120,6 +1120,7 @@ def __validate(self, bucket, submit_save, reassign, limit, offset, created):
                 data["url"] = reverse(
                     "reportmanager:bucketview", kwargs={"sig_id": bucket.pk}
                 )
+            data["bucket"] = self.get_serializer(bucket).data
         else:
             data["warning_message"] = "This is a preview, don't forget to save!"