refactor: removed the usage of the NCode

frontend/src/App.vue

@@ -4,9 +4,6 @@ import NewKeyDialog from './components/dialogs/NewKeyDialog.vue'
 import PreferencesDialog from './components/dialogs/PreferencesDialog.vue'
 import RenameKeyDialog from './components/dialogs/RenameKeyDialog.vue'
 import SetTtlDialog from './components/dialogs/SetTtlDialog.vue'
-import hljs from 'highlight.js/lib/core'
-import json from 'highlight.js/lib/languages/json'
-import plaintext from 'highlight.js/lib/languages/plaintext'
 import AddFieldsDialog from './components/dialogs/AddFieldsDialog.vue'
 import AppContent from './AppContent.vue'
 import GroupDialog from './components/dialogs/GroupDialog.vue'
@@ -22,9 +19,6 @@ import { darkThemeOverrides, themeOverrides } from '@/utils/theme.js'
 import AboutDialog from '@/components/dialogs/AboutDialog.vue'
 import FlushDbDialog from '@/components/dialogs/FlushDbDialog.vue'
 
-hljs.registerLanguage('json', json)
-hljs.registerLanguage('plaintext', plaintext)
-
 const prefStore = usePreferencesStore()
 const connectionStore = useConnectionStore()
 const i18n = useI18n()
@@ -57,7 +51,6 @@ watch(
 
 <template>
     <n-config-provider
-        :hljs="hljs"
         :inline-theme-disabled="true"
         :locale="prefStore.themeLocale"
         :theme="prefStore.isDark ? darkTheme : undefined"

frontend/src/components/content_value/ContentValueHash.vue

@@ -3,7 +3,7 @@ import { computed, h, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import ContentToolbar from './ContentToolbar.vue'
 import AddLink from '@/components/icons/AddLink.vue'
-import { NButton, NCode, NIcon, useThemeVars } from 'naive-ui'
+import { NButton, NIcon, useThemeVars } from 'naive-ui'
 import { types, types as redisTypes } from '@/consts/support_redis_type.js'
 import EditableTableColumn from '@/components/common/EditableTableColumn.vue'
 import useDialogStore from 'stores/dialog.js'
@@ -126,7 +126,7 @@ const valueColumn = computed(() => ({
     // },
     render: (row) => {
         if (displayCode.value) {
-            return h(NCode, { language: 'json', wordWrap: true, code: row.dv || row.v })
+            return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
     },

frontend/src/components/content_value/ContentValueList.vue

@@ -3,7 +3,7 @@ import { computed, h, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import ContentToolbar from './ContentToolbar.vue'
 import AddLink from '@/components/icons/AddLink.vue'
-import { NButton, NCode, NIcon, useThemeVars } from 'naive-ui'
+import { NButton, NIcon, useThemeVars } from 'naive-ui'
 import { isEmpty, size } from 'lodash'
 import { types, types as redisTypes } from '@/consts/support_redis_type.js'
 import EditableTableColumn from '@/components/common/EditableTableColumn.vue'
@@ -102,7 +102,7 @@ const valueColumn = computed(() => ({
     },
     render: (row) => {
         if (displayCode.value) {
-            return h(NCode, { language: 'json', wordWrap: true, code: row.dv || row.v })
+            return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
     },

frontend/src/components/content_value/ContentValueSet.vue

@@ -3,7 +3,7 @@ import { computed, h, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import ContentToolbar from './ContentToolbar.vue'
 import AddLink from '@/components/icons/AddLink.vue'
-import { NButton, NCode, NIcon, useThemeVars } from 'naive-ui'
+import { NButton, NIcon, useThemeVars } from 'naive-ui'
 import { isEmpty, size } from 'lodash'
 import useDialogStore from 'stores/dialog.js'
 import { types, types as redisTypes } from '@/consts/support_redis_type.js'
@@ -101,7 +101,7 @@ const valueColumn = computed(() => ({
     },
     render: (row) => {
         if (displayCode.value) {
-            return h(NCode, { language: 'json', wordWrap: true, code: row.dv || row.v })
+            return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
     },

frontend/src/components/content_value/ContentValueStream.vue

@@ -3,7 +3,7 @@ import { computed, h, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import ContentToolbar from './ContentToolbar.vue'
 import AddLink from '@/components/icons/AddLink.vue'
-import { NButton, NCode, NIcon, useThemeVars } from 'naive-ui'
+import { NButton, NIcon, useThemeVars } from 'naive-ui'
 import { types, types as redisTypes } from '@/consts/support_redis_type.js'
 import EditableTableColumn from '@/components/common/EditableTableColumn.vue'
 import useDialogStore from 'stores/dialog.js'
@@ -94,7 +94,7 @@ const valueColumn = computed(() => ({
     },
     // sorter: (row1, row2) => row1.value - row2.value,
     render: (row) => {
-        return h(NCode, { language: 'json', wordWrap: true, code: row.dv })
+        return h('pre', {}, row.dv)
     },
 }))
 const actionColumn = {

frontend/src/components/content_value/ContentValueZSet.vue

@@ -3,7 +3,7 @@ import { computed, h, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import ContentToolbar from './ContentToolbar.vue'
 import AddLink from '@/components/icons/AddLink.vue'
-import { NButton, NCode, NIcon, useThemeVars } from 'naive-ui'
+import { NButton, NIcon, useThemeVars } from 'naive-ui'
 import { types, types as redisTypes } from '@/consts/support_redis_type.js'
 import EditableTableColumn from '@/components/common/EditableTableColumn.vue'
 import { isEmpty, size } from 'lodash'
@@ -151,7 +151,7 @@ const valueColumn = computed(() => ({
     // sorter: (row1, row2) => row1.value - row2.value,
     render: (row) => {
         if (displayCode.value) {
-            return h(NCode, { language: 'json', wordWrap: true, code: row.dv || row.v })
+            return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
     },