fix: resolve redux store circular dependencies

Author: KrumTy

redisinsight/ui/src/services/apiService.ts

@@ -7,7 +7,7 @@ import { isNumber } from 'lodash'
 import { sessionStorageService } from 'uiSrc/services'
 import { BrowserStorageItem } from 'uiSrc/constants'
 import { CLOUD_AUTH_API_ENDPOINTS, CustomHeaders } from 'uiSrc/constants/api'
-import { store } from 'uiSrc/slices/store'
+import { store } from 'uiSrc/slices/store-dynamic'
 import { logoutUserAction } from 'uiSrc/slices/oauth/cloud'
 import { setConnectivityError } from 'uiSrc/slices/app/connectivity'
 import { getConfig } from 'uiSrc/config'

redisinsight/ui/src/slices/app/context.ts

@@ -52,7 +52,7 @@ import {
   RedisResponseBuffer,
   StateAppContext,
 } from '../interfaces'
-import { AppDispatch, RootState } from '../store'
+import type { AppDispatch, RootState } from '../store'
 
 export const initialState: StateAppContext = {
   workspace:

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

@@ -100,7 +100,7 @@ import {
   SearchHistoryItem,
   SearchMode,
 } from '../interfaces/keys'
-import { AppDispatch, RootState } from '../store'
+import type { AppDispatch, RootState } from '../store'
 import { StreamViewType } from '../interfaces/stream'
 import { EditorType, RedisResponseBuffer, RedisString } from '../interfaces'
 

redisinsight/ui/src/slices/instances/instances.ts

@@ -28,7 +28,7 @@ import { ExportDatabase } from 'apiSrc/modules/database/models/export-database'
 
 import { fetchMastersSentinelAction } from './sentinel'
 import { fetchTags } from './tags'
-import { AppDispatch, RootState } from '../store'
+import type { AppDispatch, RootState } from '../store'
 import {
   addErrorNotification,
   addInfiniteNotification,

redisinsight/ui/src/slices/store-dynamic.ts

@@ -0,0 +1,23 @@
+/* eslint-disable global-require */
+import type { RootState, AppDispatch } from './store'
+
+// Importing store methods dynamically to avoid circular dependencies
+
+const getState = (): RootState => {
+  const { store } = require('uiSrc/slices/store')
+  return store.getState() as RootState
+}
+
+const dispatch: AppDispatch = (action: any) => {
+  const { store } = require('uiSrc/slices/store')
+  return store.dispatch(action)
+}
+
+const store = {
+  getState,
+  dispatch,
+}
+
+export { store }
+
+export { RootState, AppDispatch }

redisinsight/ui/src/slices/store.ts

@@ -151,5 +151,6 @@ const store = configureStore({
 
 export { store }
 
+export type ReduxStore = typeof store
 export type RootState = ReturnType<typeof rootReducer>
 export type AppDispatch = typeof store.dispatch

redisinsight/ui/src/slices/tests/browser/rejson.setJsonDataAction.spec.ts

@@ -4,27 +4,6 @@ import { EditorType } from 'uiSrc/slices/interfaces'
 
 const mockStore = configureStore([thunk])
 
-const originalConsoleError = console.error
-
-// Suppress Redux warnings about missing reducers
-beforeAll(() => {
-  console.error = (...args: any[]) => {
-    const message = args[0]
-    if (
-      typeof message === 'string' &&
-      message.includes('No reducer provided for key')
-    ) {
-      return
-    }
-
-    originalConsoleError(...args)
-  }
-})
-
-afterAll(() => {
-  console.error = originalConsoleError
-})
-
 describe('setReJSONDataAction', () => {
   let store: any
   let sendEventTelemetryMock: jest.Mock

redisinsight/ui/src/telemetry/checkAnalytics.ts

@@ -1,5 +1,5 @@
 import { get } from 'lodash'
-import { store } from 'uiSrc/slices/store'
+import { store } from 'uiSrc/slices/store-dynamic'
 
 // Check is user give access to collect his events
 export const checkIsAnalyticsGranted = (): boolean =>

redisinsight/ui/src/telemetry/telemetryUtils.ts

@@ -14,7 +14,7 @@ import {
   RedisModulesKeyType,
 } from 'uiSrc/telemetry/interfaces'
 import { apiService } from 'uiSrc/services'
-import { store } from 'uiSrc/slices/store'
+import { store } from 'uiSrc/slices/store-dynamic'
 import { getInstanceInfo } from 'uiSrc/services/database/instancesService'
 import { AdditionalRedisModule } from 'apiSrc/modules/database/models/additional.redis.module'
 import { IRedisModulesSummary, MatchType, RedisModules } from './interfaces'

redisinsight/ui/src/utils/capability.ts

@@ -1,5 +1,5 @@
 import { OAuthSocialSource, RedisDefaultModules } from 'uiSrc/slices/interfaces'
-import { store } from 'uiSrc/slices/store'
+import { store } from 'uiSrc/slices/store-dynamic'
 import { Nullable } from 'uiSrc/utils'
 import { findMarkdownPath } from 'uiSrc/utils/workbench'