Merge pull request #246 from RedisInsight/feature/RI-6522_Long_vector…

…_string_is_not_displayed

#RI-6522 - [Regression] Long vector string is not displayed

l10n/bundle.l10n.json

@@ -310,6 +310,9 @@
   "Privacy": "Privacy",
   "To optimize your experience, Redis for VS Code uses third-party tools. All data collected is anonymized and will not be used for any purpose without your consent.": "To optimize your experience, Redis for VS Code uses third-party tools. All data collected is anonymized and will not be used for any purpose without your consent.",
   "Analytics": "Analytics",
+  "Auto refresh:": "Auto refresh:",
+  "Last refresh:": "Last refresh:",
+  "Auto Refresh": "Auto Refresh",
   "Add": "Add",
   "Release Notes": "Release Notes",
   "Redis for VS Code extension updated to {0}.": "Redis for VS Code extension updated to {0}."

src/webviews/src/modules/key-details/components/string-details/string-details-value/StringDetailsValue.spec.tsx

@@ -2,9 +2,11 @@ import React from 'react'
 import { instance, mock } from 'ts-mockito'
 
 import * as utils from 'uiSrc/utils'
-import { bufferToString } from 'uiSrc/utils'
+import { bufferToASCII, bufferToString } from 'uiSrc/utils'
 import { downloadFile } from 'uiSrc/utils/dom/downloadFile'
 import { useSelectedKeyStore } from 'uiSrc/store'
+import { KeyValueFormat } from 'uiSrc/constants'
+import * as useContext from 'uiSrc/store/hooks/use-context/useContext'
 import { render, screen, fireEvent, constants, waitForStack } from 'testSrc/helpers'
 import { StringDetailsValue, Props } from './StringDetailsValue'
 import * as useString from '../hooks/useStringStore'
@@ -146,6 +148,25 @@ describe('StringDetailsValue', () => {
     expect(screen.getByTestId(STRING_VALUE)).toHaveTextContent(`${bufferToString(constants.KEY_1_VALUE)}...`)
   })
 
+  it('Should render partValue in the Unicode format', async () => {
+    useStringStore.setState((state) => ({
+      ...state,
+      data: { value: constants.VECTOR_32_VALUE_1 },
+    }))
+
+    const useContextInContext = vi.spyOn(useContext, 'useContextInContext')
+    useContextInContext.mockImplementation(() => KeyValueFormat.Vector32Bit)
+
+    render(
+      <StringDetailsValue
+        {...instance(mockedProps)}
+      />,
+    )
+
+    expect(screen.getByTestId(STRING_VALUE)).toHaveTextContent('@...')
+    expect(screen.getByTestId(STRING_VALUE)).not.toHaveTextContent('[object Object]')
+  })
+
   it('Should not add "..." in the end of the full value', async () => {
     useStringStore.setState((state) => ({
       ...state,

src/webviews/src/modules/key-details/components/string-details/string-details-value/StringDetailsValue.tsx

@@ -25,6 +25,7 @@ import {
   decompressingBuffer,
 } from 'uiSrc/utils'
 import {
+  KeyValueFormat,
   TEXT_DISABLED_COMPRESSED_VALUE,
   TEXT_FAILED_CONVENT_FORMATTER,
   TEXT_INVALID_VALUE,
@@ -89,10 +90,15 @@ const StringDetailsValue = (props: Props) => {
     const { value: decompressedValue, isCompressed } = decompressingBuffer(initialValue, compressor)
 
     const initialValueString = bufferToString(decompressedValue, viewFormat)
-    const { value: formattedValue, isValid } = formattingBuffer(decompressedValue, viewFormatProp, { expanded: true })
+    const fullStringLoaded = isFullStringLoaded(initialValue?.data?.length, length)
+    const { value: formattedValue, isValid } = formattingBuffer(
+      decompressedValue,
+      fullStringLoaded ? viewFormatProp : KeyValueFormat.Unicode,
+      { expanded: true },
+    )
     setAreaValue(initialValueString)
 
-    setValue(!isFullStringLoaded(initialValue?.data?.length, length) ? `${formattedValue}...` : formattedValue)
+    setValue(!fullStringLoaded ? `${formattedValue}...` : formattedValue)
     setIsValid(isValid)
     setIsDisabled(
       !isNonUnicodeFormatter(viewFormatProp, isValid)
@@ -101,7 +107,7 @@ const StringDetailsValue = (props: Props) => {
     setIsEditable(
       !isCompressed
       && isFormatEditable(viewFormatProp)
-      && isFullStringLoaded(initialValue?.data?.length, length),
+      && fullStringLoaded,
     )
     setNoEditableText(isCompressed ? TEXT_DISABLED_COMPRESSED_VALUE : TEXT_FAILED_CONVENT_FORMATTER(viewFormatProp))
 

src/webviews/src/utils/formatters/bufferFormatters.ts

@@ -95,7 +95,7 @@ const bufferToASCII = (reply: RedisString): string => {
   return result
 }
 
-const anyToBuffer = (reply: UintArray): RedisString =>
+const anyToBuffer = (reply: UintArray | ArrayBuffer): RedisString =>
   ({ data: reply, type: RedisResponseBufferType.Buffer }) as RedisString
 
 const ASCIIToBuffer = (strInit: string) => {

src/webviews/test/helpers/constants.ts

@@ -2,7 +2,7 @@ import { v4 as uuidv4 } from 'uuid'
 import { DEFAULT_ERROR_MESSAGE, DEFAULT_SEARCH_MATCH, KeyTypes, VscodeMessageAction } from 'uiSrc/constants'
 import { CliAction, KeyInfo, SelectKeyAction } from 'uiSrc/interfaces'
 import { Certificate } from 'uiSrc/store/hooks/use-certificates-store/interface'
-import { UTF8ToArray, stringToBuffer } from 'uiSrc/utils'
+import { UTF8ToArray, anyToBuffer, stringToBuffer } from 'uiSrc/utils'
 import { Database } from 'uiSrc/store'
 import { SuperSelectOption } from 'uiSrc/components'
 
@@ -122,6 +122,8 @@ export const constants = {
   KEY_5_MEMBER_2: UTF8ToArray('member2'),
   KEY_5_MEMBER_3: UTF8ToArray('member3'),
 
+  VECTOR_32_VALUE_1: anyToBuffer(new Float32Array([2.0, 2.0, 2.0]).buffer),
+
   get LIST_DATA_RESPONSE() {
     return LIST_DATA_RESPONSE
   },