From 8a5c907f685e5436e73ab5257e83875d9cb81aad Mon Sep 17 00:00:00 2001
From: Elena Makarova <el-makarova@yandex-team.ru>
Date: Wed, 25 Dec 2024 16:04:14 +0300
Subject: [PATCH 1/3] fix(Cluster): show loader if capabilities not loaded
---
src/containers/App/Content.tsx | 14 +++++++++-----
src/store/reducers/capabilities/hooks.ts | 2 +-
2 files changed, 10 insertions(+), 6 deletions(-)
diff --git a/src/containers/App/Content.tsx b/src/containers/App/Content.tsx
index 6f05e1fa8..6ca0f63d4 100644
--- a/src/containers/App/Content.tsx
+++ b/src/containers/App/Content.tsx
@@ -178,8 +178,7 @@ function DataWrapper({children}: {children: React.ReactNode}) {
return (
<GetUser>
<GetNodesList />
- <GetCapabilities />
- {children}
+ <GetCapabilities>{children}</GetCapabilities>
</GetUser>
);
}
@@ -199,9 +198,14 @@ function GetNodesList() {
return null;
}
-function GetCapabilities() {
- useCapabilitiesQuery();
- return null;
+function GetCapabilities({children}: {children: React.ReactNode}) {
+ const {isLoading} = useCapabilitiesQuery();
+
+ return (
+ <LoaderWrapper loading={isLoading} size="l">
+ {children}
+ </LoaderWrapper>
+ );
}
interface ContentWrapperProps {
diff --git a/src/store/reducers/capabilities/hooks.ts b/src/store/reducers/capabilities/hooks.ts
index cafdfdda7..cdf026748 100644
--- a/src/store/reducers/capabilities/hooks.ts
+++ b/src/store/reducers/capabilities/hooks.ts
@@ -15,7 +15,7 @@ function useDatabaseFromQuery() {
export function useCapabilitiesQuery() {
const database = useDatabaseFromQuery();
- capabilitiesApi.useGetClusterCapabilitiesQuery({database});
+ return capabilitiesApi.useGetClusterCapabilitiesQuery({database});
}
export function useCapabilitiesLoaded() {
From 225f4c5cd0397aa9f892ac652ff24bbde14dd36f Mon Sep 17 00:00:00 2001
From: Elena Makarova <el-makarova@yandex-team.ru>
Date: Wed, 25 Dec 2024 16:17:44 +0300
Subject: [PATCH 2/3] fix: typecheck
---
src/store/reducers/capabilities/hooks.ts | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/src/store/reducers/capabilities/hooks.ts b/src/store/reducers/capabilities/hooks.ts
index cdf026748..3f33f44f0 100644
--- a/src/store/reducers/capabilities/hooks.ts
+++ b/src/store/reducers/capabilities/hooks.ts
@@ -15,7 +15,8 @@ function useDatabaseFromQuery() {
export function useCapabilitiesQuery() {
const database = useDatabaseFromQuery();
- return capabilitiesApi.useGetClusterCapabilitiesQuery({database});
+ const result = capabilitiesApi.useGetClusterCapabilitiesQuery({database});
+ return result;
}
export function useCapabilitiesLoaded() {
From 6d6ed98da42e774b896f537619fc989c7e06dca9 Mon Sep 17 00:00:00 2001
From: Elena Makarova <el-makarova@yandex-team.ru>
Date: Wed, 25 Dec 2024 16:23:35 +0300
Subject: [PATCH 3/3] fix: typecheck
---
src/containers/App/Content.tsx | 7 ++++---
src/store/reducers/capabilities/hooks.ts | 3 +--
2 files changed, 5 insertions(+), 5 deletions(-)
diff --git a/src/containers/App/Content.tsx b/src/containers/App/Content.tsx
index 6ca0f63d4..eb39f719f 100644
--- a/src/containers/App/Content.tsx
+++ b/src/containers/App/Content.tsx
@@ -12,7 +12,7 @@ import type {SlotComponent} from '../../components/slots/types';
import routes from '../../routes';
import type {RootState} from '../../store';
import {authenticationApi} from '../../store/reducers/authentication/authentication';
-import {useCapabilitiesQuery} from '../../store/reducers/capabilities/hooks';
+import {useCapabilitiesLoaded, useCapabilitiesQuery} from '../../store/reducers/capabilities/hooks';
import {nodesListApi} from '../../store/reducers/nodesList';
import {cn} from '../../utils/cn';
import {lazyComponent} from '../../utils/lazyComponent';
@@ -199,10 +199,11 @@ function GetNodesList() {
}
function GetCapabilities({children}: {children: React.ReactNode}) {
- const {isLoading} = useCapabilitiesQuery();
+ useCapabilitiesQuery();
+ const capabilitiesLoaded = useCapabilitiesLoaded();
return (
- <LoaderWrapper loading={isLoading} size="l">
+ <LoaderWrapper loading={!capabilitiesLoaded} size="l">
{children}
</LoaderWrapper>
);
diff --git a/src/store/reducers/capabilities/hooks.ts b/src/store/reducers/capabilities/hooks.ts
index 3f33f44f0..cafdfdda7 100644
--- a/src/store/reducers/capabilities/hooks.ts
+++ b/src/store/reducers/capabilities/hooks.ts
@@ -15,8 +15,7 @@ function useDatabaseFromQuery() {
export function useCapabilitiesQuery() {
const database = useDatabaseFromQuery();
- const result = capabilitiesApi.useGetClusterCapabilitiesQuery({database});
- return result;
+ capabilitiesApi.useGetClusterCapabilitiesQuery({database});
}
export function useCapabilitiesLoaded() {