From 52cd012a49eb230ec05af59920a26c24073ec0e0 Mon Sep 17 00:00:00 2001
From: portikM <maksym.portianoi@konghq.com>
Date: Mon, 3 Jun 2024 10:18:59 -0400
Subject: [PATCH] fix(*): add question marks before tostring [KHCP-12065]

---
 src/components/KCodeBlock/KCodeBlock.vue | 2 +-
 src/components/KInput/KInput.vue         | 4 ++--
 src/components/KTextArea/KTextArea.vue   | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/KCodeBlock/KCodeBlock.vue b/src/components/KCodeBlock/KCodeBlock.vue
index f1daf14fef..b5630959e0 100644
--- a/src/components/KCodeBlock/KCodeBlock.vue
+++ b/src/components/KCodeBlock/KCodeBlock.vue
@@ -396,7 +396,7 @@ const matchingLineNumbers = ref<number[]>([])
 const currentLineIndex = ref<null | number>(null)
 
 const totalLines = computed((): number[] => Array.from({ length: props.code?.split('\n').length }, (_, index) => index + 1))
-const maxLineNumberWidth = computed((): string => totalLines.value[totalLines.value.length - 1].toString().length + 'ch')
+const maxLineNumberWidth = computed((): string => totalLines.value[totalLines.value.length - 1]?.toString().length + 'ch')
 const linePrefix = computed((): string => props.id.toLowerCase().replace(/\s+/g, '-'))
 const isProcessing = computed((): boolean => props.processing || isProcessingInternally.value)
 const isShowingFilteredCode = computed((): boolean => isFilterMode.value && filteredCode.value !== '')
diff --git a/src/components/KInput/KInput.vue b/src/components/KInput/KInput.vue
index e6d0238000..2d41482156 100644
--- a/src/components/KInput/KInput.vue
+++ b/src/components/KInput/KInput.vue
@@ -198,8 +198,8 @@ const charLimitExceededErrorMessage = computed((): string => {
   }
 
   return modelValueChanged.value
-    ? `${currValue.value.toString().length} / ${props.characterLimit}`
-    : `${props.modelValue.toString().length} / ${props.characterLimit}`
+    ? `${currValue.value?.toString().length} / ${props.characterLimit}`
+    : `${props.modelValue?.toString().length} / ${props.characterLimit}`
 })
 
 const helpText = computed((): string => {
diff --git a/src/components/KTextArea/KTextArea.vue b/src/components/KTextArea/KTextArea.vue
index 4383d5a24b..7968bef1d4 100644
--- a/src/components/KTextArea/KTextArea.vue
+++ b/src/components/KTextArea/KTextArea.vue
@@ -200,7 +200,7 @@ const helpText = computed((): string => {
 
   // if character limit exceeded, return that error message
   if (charLimitExceeded.value) {
-    return `${currValue.value.toString().length} / ${characterLimit}`
+    return `${currValue.value?.toString().length} / ${characterLimit}`
   }
 
   // otherwise return the help text