#RI-3995 - add key into list

redisinsight/ui/src/constants/keys.ts

@@ -1,4 +1,5 @@
 import { StreamViewType } from 'uiSrc/slices/interfaces/stream'
+import { ApiEndpoints } from 'uiSrc/constants'
 import { CommandGroup } from './commands'
 
 export enum KeyTypes {
@@ -180,6 +181,17 @@ export enum KeyValueFormat {
   Pickle = 'Pickle',
 }
 
+export const ENDPOINT_BASED_ON_KEY_TYPE = Object.freeze({
+  [KeyTypes.ZSet]: ApiEndpoints.ZSET,
+  [KeyTypes.Set]: ApiEndpoints.SET,
+  [KeyTypes.String]: ApiEndpoints.STRING,
+  [KeyTypes.Hash]: ApiEndpoints.HASH,
+  [KeyTypes.List]: ApiEndpoints.LIST,
+  [KeyTypes.ReJSON]: ApiEndpoints.REJSON,
+  [KeyTypes.Stream]: ApiEndpoints.STREAMS,
+})
+
+export type EndpointBasedOnKeyType = keyof (typeof ENDPOINT_BASED_ON_KEY_TYPE)
 export enum SearchHistoryMode {
   Pattern = 'pattern',
   Redisearch = 'redisearch'

redisinsight/ui/src/slices/browser/keys.ts

@@ -7,6 +7,8 @@ import {
   BrowserStorageItem,
   KeyTypes,
   KeyValueFormat,
+  EndpointBasedOnKeyType,
+  ENDPOINT_BASED_ON_KEY_TYPE,
   SearchHistoryMode,
   SortOrder
 } from 'uiSrc/constants'
@@ -26,6 +28,7 @@ import { DEFAULT_SEARCH_MATCH, SCAN_COUNT_DEFAULT } from 'uiSrc/constants/api'
 import { getBasedOnViewTypeEvent, sendEventTelemetry, TelemetryEvent, getAdditionalAddedEventData, getMatchType } from 'uiSrc/telemetry'
 import successMessages from 'uiSrc/components/notifications/success-messages'
 import { IKeyPropTypes } from 'uiSrc/constants/prop-types/keys'
+import { resetBrowserTree } from 'uiSrc/slices/app/context'
 
 import {
   CreateListWithExpireDto,
@@ -304,6 +307,16 @@ const keysSlice = createSlice({
       state.addKey = {
         ...state.addKey,
         loading: false,
+        error: '',
+      }
+    },
+    updateKeyList: (state, { payload }) => {
+      state.data?.keys.unshift({ name: payload.keyName })
+
+      state.data = {
+        ...state.data,
+        total: state.data.total + 1,
+        scanned: state.data.scanned + 1,
       }
     },
     addKeyFailure: (state, { payload }) => {
@@ -409,8 +422,9 @@ export const {
   defaultSelectedKeyActionFailure,
   setLastBatchPatternKeys,
   addKey,
-  addKeySuccess,
+  updateKeyList,
   addKeyFailure,
+  addKeySuccess,
   resetAddKey,
   deleteKey,
   deleteKeySuccess,
@@ -715,12 +729,14 @@ export function refreshKeyInfoAction(key: RedisResponseBuffer) {
 
 function addTypedKey(
   data: any,
-  endpoint: ApiEndpoints,
+  keyType: KeyTypes,
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     dispatch(addKey())
+    const endpoint = ENDPOINT_BASED_ON_KEY_TYPE[keyType as EndpointBasedOnKeyType]
+
     try {
       const state = stateInit()
       const { encoding } = state.app.info
@@ -735,6 +751,7 @@ function addTypedKey(
           onSuccessAction()
         }
         dispatch(addKeySuccess())
+        dispatch<any>(addKeyIntoList({ key: data.keyName, keyType }))
         dispatch(
           addMessageNotification(successMessages.ADDED_NEW_KEY(data.keyName))
         )
@@ -767,8 +784,7 @@ export function addHashKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.HASH
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.Hash, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -777,8 +793,7 @@ export function addZsetKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.ZSET
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.ZSet, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -787,8 +802,7 @@ export function addSetKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.SET
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.Set, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -797,8 +811,7 @@ export function addStringKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.STRING
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.String, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -807,8 +820,7 @@ export function addListKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.LIST
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.List, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -817,8 +829,7 @@ export function addReJSONKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.REJSON
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.ReJSON, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -827,8 +838,7 @@ export function addStreamKey(
   onSuccessAction?: () => void,
   onFailAction?: () => void
 ) {
-  const endpoint = ApiEndpoints.STREAMS
-  return addTypedKey(data, endpoint, onSuccessAction, onFailAction)
+  return addTypedKey(data, KeyTypes.Stream, onSuccessAction, onFailAction)
 }
 
 // Asynchronous thunk action
@@ -1147,6 +1157,25 @@ export function editKeyFromList(data: { key: RedisResponseBuffer, newKey: RedisR
   }
 }
 
+export function addKeyIntoList({ key, keyType }: { key: RedisString, keyType: KeyTypes }) {
+  return async (dispatch: AppDispatch, stateInit: () => RootState) => {
+    const state = stateInit()
+    const { viewType, filter, search } = state.browser.keys
+
+    if (search && search !== '*') {
+      return null
+    }
+
+    if (!filter || filter === keyType) {
+      if (viewType !== KeyViewType.Tree) {
+        dispatch(resetBrowserTree())
+      }
+      return dispatch(updateKeyList({ keyName: key, keyType }))
+    }
+    return null
+  }
+}
+
 export function editKeyTTLFromList(data: [RedisResponseBuffer, number]) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     const state = stateInit()