From 419ed287604e8b0af2512bebb8fd7c92045e8694 Mon Sep 17 00:00:00 2001 From: Roman Sergeenko Date: Thu, 5 Sep 2024 14:35:29 +0200 Subject: [PATCH 1/4] #RI-6081 - fix reset context when switch database happens on the same page --- redisinsight/ui/src/pages/instance/InstancePage.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/redisinsight/ui/src/pages/instance/InstancePage.tsx b/redisinsight/ui/src/pages/instance/InstancePage.tsx index 5cc9477449..220d238588 100644 --- a/redisinsight/ui/src/pages/instance/InstancePage.tsx +++ b/redisinsight/ui/src/pages/instance/InstancePage.tsx @@ -70,7 +70,10 @@ const InstancePage = ({ routes = [] }: Props) => { }, [pathname]) useEffect(() => { - if (isShouldChildrenRerender) setIsShouldChildrenRerender(false) + if (isShouldChildrenRerender) { + dispatch(resetDatabaseContext()) + setIsShouldChildrenRerender(false) + } }, [isShouldChildrenRerender]) if (isShouldChildrenRerender) { From 0c23dbe8777ae7e736e8d1e491dd89074be72973 Mon Sep 17 00:00:00 2001 From: Roman Sergeenko Date: Fri, 6 Sep 2024 10:40:40 +0200 Subject: [PATCH 2/4] #RI-6081 - try to fix context --- redisinsight/ui/src/pages/browser/BrowserPage.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/redisinsight/ui/src/pages/browser/BrowserPage.tsx b/redisinsight/ui/src/pages/browser/BrowserPage.tsx index ce76ff629b..b38c66dcf3 100644 --- a/redisinsight/ui/src/pages/browser/BrowserPage.tsx +++ b/redisinsight/ui/src/pages/browser/BrowserPage.tsx @@ -33,6 +33,7 @@ import { setBrowserPanelSizes, setLastPageContext, setBrowserBulkActionOpen, + appContextSelector, } from 'uiSrc/slices/app/context' import { resetErrors } from 'uiSrc/slices/app/notifications' import { RedisResponseBuffer } from 'uiSrc/slices/interfaces' @@ -66,6 +67,8 @@ const BrowserPage = () => { keyList: { selectedKey: selectedKeyContext }, bulkActions: { opened: bulkActionOpenContext }, } = useSelector(appContextBrowser) + const { contextInstanceId } = useSelector(appContextSelector) + const { isBrowserFullScreen } = useSelector(keysSelector) const { type } = useSelector(selectedKeyDataSelector) ?? { type: '', length: 0 } const { viewType, searchMode } = useSelector(keysSelector) @@ -73,7 +76,11 @@ const BrowserPage = () => { const [isPageViewSent, setIsPageViewSent] = useState(false) const [arePanelsCollapsed, setArePanelsCollapsed] = useState(isOneSideMode(!!openedSidePanel)) - const [selectedKey, setSelectedKey] = useState>(selectedKeyContext) + const [selectedKey, setSelectedKey] = useState>( + contextInstanceId === instanceId + ? selectedKeyContext + : null + ) const [isAddKeyPanelOpen, setIsAddKeyPanelOpen] = useState(false) const [isCreateIndexPanelOpen, setIsCreateIndexPanelOpen] = useState(false) const [isBulkActionsPanelOpen, setIsBulkActionsPanelOpen] = useState(bulkActionOpenContext) From 47b746980612a2573d22016bbfc68faffd41f99c Mon Sep 17 00:00:00 2001 From: Roman Sergeenko Date: Fri, 6 Sep 2024 12:57:26 +0200 Subject: [PATCH 3/4] #RI-6081 - fix context selected key --- redisinsight/ui/src/pages/browser/BrowserPage.tsx | 12 +++++------- redisinsight/ui/src/services/hooks/index.ts | 1 + .../ui/src/services/hooks/useStateWithContext.ts | 11 +++++++++++ 3 files changed, 17 insertions(+), 7 deletions(-) create mode 100644 redisinsight/ui/src/services/hooks/useStateWithContext.ts diff --git a/redisinsight/ui/src/pages/browser/BrowserPage.tsx b/redisinsight/ui/src/pages/browser/BrowserPage.tsx index b38c66dcf3..41e0322071 100644 --- a/redisinsight/ui/src/pages/browser/BrowserPage.tsx +++ b/redisinsight/ui/src/pages/browser/BrowserPage.tsx @@ -43,6 +43,7 @@ import { KeyViewType } from 'uiSrc/slices/interfaces/keys' import { SCAN_COUNT_DEFAULT, SCAN_TREE_COUNT_DEFAULT } from 'uiSrc/constants/api' import OnboardingStartPopover from 'uiSrc/pages/browser/components/onboarding-start-popover' import { sidePanelsSelector } from 'uiSrc/slices/panels/sidePanels' +import { useStateWithContext } from 'uiSrc/services/hooks' import BrowserSearchPanel from './components/browser-search-panel' import BrowserLeftPanel from './components/browser-left-panel' import BrowserRightPanel from './components/browser-right-panel' @@ -76,15 +77,12 @@ const BrowserPage = () => { const [isPageViewSent, setIsPageViewSent] = useState(false) const [arePanelsCollapsed, setArePanelsCollapsed] = useState(isOneSideMode(!!openedSidePanel)) - const [selectedKey, setSelectedKey] = useState>( - contextInstanceId === instanceId - ? selectedKeyContext - : null - ) const [isAddKeyPanelOpen, setIsAddKeyPanelOpen] = useState(false) const [isCreateIndexPanelOpen, setIsCreateIndexPanelOpen] = useState(false) const [isBulkActionsPanelOpen, setIsBulkActionsPanelOpen] = useState(bulkActionOpenContext) + const [selectedKey, setSelectedKey] = useStateWithContext>(selectedKeyContext, null) + const [sizes, setSizes] = useState(panelSizes) const prevSelectedType = useRef(type) @@ -125,8 +123,8 @@ const BrowserPage = () => { }, [isBulkActionsPanelOpen]) useEffect(() => { - setSelectedKey(selectedKeyContext) - }, [selectedKeyContext]) + if (contextInstanceId === instanceId) setSelectedKey(selectedKeyContext) + }, [selectedKeyContext, contextInstanceId]) useEffect(() => { selectedKeyRef.current = selectedKey diff --git a/redisinsight/ui/src/services/hooks/index.ts b/redisinsight/ui/src/services/hooks/index.ts index e7bf515ac4..4b1ac5c8b8 100644 --- a/redisinsight/ui/src/services/hooks/index.ts +++ b/redisinsight/ui/src/services/hooks/index.ts @@ -1,3 +1,4 @@ export * from './hooks' export * from './useWebworkers' export * from './useCabability' +export * from './useStateWithContext' diff --git a/redisinsight/ui/src/services/hooks/useStateWithContext.ts b/redisinsight/ui/src/services/hooks/useStateWithContext.ts new file mode 100644 index 0000000000..13c5c3cfe3 --- /dev/null +++ b/redisinsight/ui/src/services/hooks/useStateWithContext.ts @@ -0,0 +1,11 @@ +import { useSelector } from 'react-redux' +import { useState } from 'react' +import { useParams } from 'react-router-dom' +import { appContextSelector } from 'uiSrc/slices/app/context' + +export const useStateWithContext = (value: T, initialValue: T) => { + const { instanceId } = useParams<{ instanceId: string }>() + const { contextInstanceId } = useSelector(appContextSelector) + + return useState(instanceId === contextInstanceId ? value : initialValue) +} From cd840bf743fda5d5dcb6a41867de9d48a4dcfe07 Mon Sep 17 00:00:00 2001 From: Roman Sergeenko Date: Fri, 6 Sep 2024 13:33:06 +0200 Subject: [PATCH 4/4] #RI-6081 - fix tests --- redisinsight/ui/src/pages/browser/BrowserPage.test.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/redisinsight/ui/src/pages/browser/BrowserPage.test.tsx b/redisinsight/ui/src/pages/browser/BrowserPage.test.tsx index 11257771d5..4158cd7a47 100644 --- a/redisinsight/ui/src/pages/browser/BrowserPage.test.tsx +++ b/redisinsight/ui/src/pages/browser/BrowserPage.test.tsx @@ -51,6 +51,7 @@ const selectKey = (state: any, selectedKey: any, data?: any = {}) => { ...state.app, context: { ...state.app.context, + contextInstanceId: 'instanceId', browser: { ...state.app.context.browser, bulkActions: {