fix: Dashboard abort partition api call issue (#4430)

- #4428 

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Improved handling of query aborting for enhanced efficiency in
asynchronous operations.
  
- **Bug Fixes**
- Enhanced robustness of data conversion by implementing safer property
access methods, reducing runtime errors related to undefined or null
values.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Author: ktx-abhay

web/src/composables/dashboard/usePanelDataLoader.ts

@@ -313,6 +313,10 @@ export const usePanelDataLoader = (
           queries: queryResults.map((it: any) => it?.metadata),
         };
       } else {
+        // copy of current abortController
+        // which is used to check whether the current query has been aborted
+        const abortControllerRef = abortController;
+
         // reset old state data
         state.data = [];
         state.metadata = {
@@ -369,6 +373,11 @@ export const usePanelDataLoader = (
               traceparent,
             });
 
+            // if aborted, return
+            if (abortControllerRef?.signal?.aborted) {
+              return;
+            }
+
             // partition array from api response
             const partitionArr = res?.data?.partitions ?? [];
 
@@ -387,10 +396,6 @@ export const usePanelDataLoader = (
 
             const currentQueryIndex = state.data.length - 1;
 
-            // copy of current abortController
-            // which is used to check whether the current query has been aborted
-            const abortControllerRef = abortController;
-
             // Update the metadata for the current query
             Object.assign(state.metadata.queries[currentQueryIndex], metadata);
 
@@ -399,6 +404,8 @@ export const usePanelDataLoader = (
 
             // loop on all partitions and call search api for each partition
             for (let i = partitionArr.length - 1; i >= 0; i--) {
+              state.loading = true;
+
               const partition = partitionArr[i];
 
               if (abortControllerRef?.signal?.aborted) {
@@ -436,9 +443,9 @@ export const usePanelDataLoader = (
                 searchRes.data.is_partial != true
               ) {
                 // abort on unmount
-                if (abortController) {
+                if (abortControllerRef) {
                   // this will stop partition api call
-                  abortController.abort();
+                  abortControllerRef?.abort();
                 }
 
                 // throw error
@@ -447,6 +454,11 @@ export const usePanelDataLoader = (
                 );
               }
 
+              // if the query is aborted or the response is partial, break the loop
+              if (abortControllerRef?.signal?.aborted) {
+                break;
+              }
+
               state.data[currentQueryIndex] = [
                 ...searchRes.data.hits,
                 ...(state.data[currentQueryIndex] ?? []),
@@ -455,11 +467,6 @@ export const usePanelDataLoader = (
               // update result metadata
               state.resultMetaData[currentQueryIndex] = searchRes.data ?? {};
 
-              // if the query is aborted or the response is partial, break the loop
-              if (abortControllerRef?.signal?.aborted) {
-                break;
-              }
-
               if (searchRes.data.is_partial == true) {
                 // set the new start time as the start time of query
                 state.resultMetaData[currentQueryIndex].new_end_time =
@@ -515,8 +522,8 @@ export const usePanelDataLoader = (
             state.loading = false;
 
             // abort on done
-            if (abortController) {
-              abortController.abort();
+            if (abortControllerRef) {
+              abortControllerRef?.abort();
             }
           }
         }

web/src/utils/dashboard/convertSQLData.ts

@@ -236,7 +236,7 @@ export const convertSQLData = async (
     }
 
     // Extract and process metaDataStartTime
-    const metaDataStartTime = metadata.queries[0].startTime.toString();
+    const metaDataStartTime = metadata?.queries[0]?.startTime?.toString() ?? 0;
     const startTime = new Date(parseInt(metaDataStartTime) / 1000);
 
     // Calculate the binnedDate
@@ -264,7 +264,7 @@ export const convertSQLData = async (
     }
 
     // Extract and process metaDataEndTime
-    const metaDataEndTime = metadata.queries[0].endTime.toString();
+    const metaDataEndTime = metadata?.queries[0]?.endTime?.toString() ?? 0;
     const endTime = new Date(parseInt(metaDataEndTime) / 1000);
 
     const xAxisKeysWithoutTimeStamp = getXAxisKeys().filter(