Add safe JSON parsing utility to RepoTabs component (#1050)

* Draft MR

* Add safe JSON parsing utility to RepoTabs component

---------

Co-authored-by: HiveerLi <[email protected]>

Author: hiveer

frontend/src/components/shared/RepoTabs.vue

@@ -241,7 +241,7 @@
           :maxReplica="repoDetail.maxReplica"
           :minReplica="repoDetail.minReplica"
           :clusterId="repoDetail.clusterId"
-          :variables="repoDetail.engineArgs ? JSON.parse(repoDetail.engineArgs) : {}"
+          :variables="safeJsonParse(repoDetail.engineArgs) ? JSON.parse(repoDetail.engineArgs) : {}"
         />
       </template>
     </tab-container>
@@ -277,6 +277,7 @@
   import { ref, computed, onMounted } from 'vue'
   import { ElMessage } from 'element-plus'
   import { useI18n } from 'vue-i18n'
+  import { safeJsonParse } from '../../packs/utils'
 
   const { t } = useI18n()
 

frontend/src/packs/utils.js

@@ -57,4 +57,30 @@ export const ToUnauthorizedPage = () => {
   setTimeout(() => {
     location.href = '/errors/unauthorized'
   }, 300)
+}
+
+export const randomUUID = () => {
+  const hexDigits = '0123456789abcdef'
+  let uuid = ''
+
+  for (let i = 0; i < 36; i++) {
+    if (i === 8 || i === 13 || i === 18 || i === 23) {
+      uuid += '-'
+    } else if (i === 14) {
+      uuid += '4'
+    } else if (i === 19) {
+      uuid += hexDigits[Math.floor(Math.random() * 4) + 8]
+    } else {
+      uuid += hexDigits[Math.floor(Math.random() * 16)]
+    }
+  }
+  return uuid
+}
+
+export const safeJsonParse = (str) => {
+  try {
+    return JSON.parse(str)
+  } catch (e) {
+    return null
+  }
 }