Merge branch 'main' into fe/feature/RI-3426_Invalid_format_warning

# Conflicts:
#	redisinsight/ui/src/constants/browser.ts
#	redisinsight/ui/src/pages/browser/components/hash-details/HashDetails.tsx
#	redisinsight/ui/src/pages/browser/components/list-details/ListDetails.tsx

Author: egor-zalenski

.gitignore

@@ -58,3 +58,6 @@ vendor
 
 # Parcel
 .parcel-cache
+
+# caches
+.temp_cache

configs/webpack.config.web.dev.babel.js

@@ -5,6 +5,7 @@
  * https://webpack.js.org/concepts/hot-module-replacement/
  */
 
+import path from 'path';
 import webpack from 'webpack';
 import { merge } from 'webpack-merge';
 import ip from 'ip';
@@ -21,6 +22,18 @@ export default merge(commonConfig, {
 
   mode: 'development',
 
+  cache: {
+    type: 'filesystem',
+    allowCollectingMemory: true,
+    cacheDirectory: path.resolve(__dirname, '../.temp_cache'),
+    name: 'webpack',
+    maxAge: 86_400_000, // 1 day
+    buildDependencies: {
+      // This makes all dependencies of this file - build dependencies
+      config: [__filename],
+    }
+  },
+
   devtool: 'source-map',
 
   entry: [

redisinsight/ui/src/constants/browser.ts

@@ -4,6 +4,7 @@ export const TEXT_UNPRINTABLE_CHARACTERS = {
   title: 'Non-printable characters have been detected',
   text: 'Use Workbench or CLI to edit without data loss.',
 }
+export const TEXT_DISABLED_FORMATTER_EDITING = 'Cannot edit the value in this format'
 
 export const TEXT_INVALID_VALUE = {
   title: 'Value will be saved as Unicode',

redisinsight/ui/src/pages/browser/components/hash-details/HashDetails.tsx

@@ -40,7 +40,14 @@ import { selectedKeyDataSelector, keysSelector, selectedKeySelector } from 'uiSr
 import { connectedInstanceSelector } from 'uiSrc/slices/instances/instances'
 import { SCAN_COUNT_DEFAULT } from 'uiSrc/constants/api'
 import HelpTexts from 'uiSrc/constants/help-texts'
-import { KeyTypes, OVER_RENDER_BUFFER_COUNT, TableCellAlignment, TEXT_INVALID_VALUE, TEXT_UNPRINTABLE_CHARACTERS } from 'uiSrc/constants'
+import {
+  KeyTypes,
+  OVER_RENDER_BUFFER_COUNT,
+  TableCellAlignment,
+  TEXT_INVALID_VALUE,
+  TEXT_DISABLED_FORMATTER_EDITING,
+  TEXT_UNPRINTABLE_CHARACTERS
+} from 'uiSrc/constants'
 import { getColumnWidth } from 'uiSrc/components/virtual-grid'
 import { StopPropagation } from 'uiSrc/components/virtual-table'
 import { stringToBuffer } from 'uiSrc/utils/formatters/bufferFormatters'
@@ -414,7 +421,7 @@ const HashDetails = (props: Props) => {
         return (
           <StopPropagation>
             <div className="value-table-actions">
-              <EuiToolTip content={!isEditable ? 'Cannot change data in this format' : null}>
+              <EuiToolTip content={!isEditable ? TEXT_DISABLED_FORMATTER_EDITING : null}>
                 <EuiButtonIcon
                   iconType="pencil"
                   aria-label="Edit field"

redisinsight/ui/src/pages/browser/components/key-details-header/KeyDetailsHeader.tsx

@@ -19,7 +19,15 @@ import AutoSizer from 'react-virtualized-auto-sizer'
 
 import { GroupBadge } from 'uiSrc/components'
 import InlineItemEditor from 'uiSrc/components/inline-item-editor/InlineItemEditor'
-import { KEY_TYPES_ACTIONS, KeyTypes, LENGTH_NAMING_BY_TYPE, ModulesKeyTypes, STREAM_ADD_ACTION, TEXT_UNPRINTABLE_CHARACTERS } from 'uiSrc/constants'
+import {
+  KEY_TYPES_ACTIONS,
+  KeyTypes,
+  LENGTH_NAMING_BY_TYPE,
+  ModulesKeyTypes,
+  STREAM_ADD_ACTION,
+  TEXT_DISABLED_FORMATTER_EDITING,
+  TEXT_UNPRINTABLE_CHARACTERS
+} from 'uiSrc/constants'
 import { AddCommonFieldsFormConfig } from 'uiSrc/pages/browser/components/add-key/constants/fields-config'
 import { initialKeyInfo, keysSelector, selectedKeyDataSelector, selectedKeySelector } from 'uiSrc/slices/browser/keys'
 import { streamSelector } from 'uiSrc/slices/browser/stream'
@@ -393,7 +401,7 @@ const KeyDetailsHeader = ({
         {KEY_TYPES_ACTIONS[keyType] && 'editItem' in KEY_TYPES_ACTIONS[keyType] && (
           <div className={styles.actionBtn}>
             <EuiToolTip
-              content={!isEditable ? 'Cannot change data in this format' : null}
+              content={!isEditable ? TEXT_DISABLED_FORMATTER_EDITING : null}
             >
               <EuiButtonIcon
                 disabled={!isEditable}

redisinsight/ui/src/pages/browser/components/list-details/ListDetails.tsx

@@ -23,7 +23,14 @@ import { SCAN_COUNT_DEFAULT } from 'uiSrc/constants/api'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances/instances'
 import { RedisResponseBuffer } from 'uiSrc/slices/interfaces'
 import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent } from 'uiSrc/telemetry'
-import { KeyTypes, OVER_RENDER_BUFFER_COUNT, TableCellAlignment, TEXT_INVALID_VALUE, TEXT_UNPRINTABLE_CHARACTERS } from 'uiSrc/constants'
+import {
+  KeyTypes,
+  OVER_RENDER_BUFFER_COUNT,
+  TableCellAlignment,
+  TEXT_INVALID_VALUE,
+  TEXT_DISABLED_FORMATTER_EDITING,
+  TEXT_UNPRINTABLE_CHARACTERS
+} from 'uiSrc/constants'
 import {
   bufferToSerializedFormat,
   bufferToString,
@@ -360,7 +367,7 @@ const ListDetails = (props: Props) => {
         return (
           <StopPropagation>
             <div className="value-table-actions">
-              <EuiToolTip content={!isEditable ? 'Cannot change data in this format' : null}>
+              <EuiToolTip content={!isEditable ? TEXT_DISABLED_FORMATTER_EDITING : null}>
                 <EuiButtonIcon
                   iconType="pencil"
                   aria-label="Edit element"

tests/e2e/tests/critical-path/browser/formatters.e2e.ts

@@ -197,7 +197,7 @@ notEditableFormattersSet.forEach(formatter => {
                 // Hover on disabled button
                 await t.hover(editBtn);
                 // Verify tooltip content
-                await t.expect(browserPage.tooltip.textContent).contains('Cannot change data in this format', 'Tooltip has wrong text');
+                await t.expect(browserPage.tooltip.textContent).contains('Cannot edit the value in this format', 'Tooltip has wrong text');
             }
         }
     });