Skip to content

Commit 79d7b67

Browse files
dbaduramrCherry97
dbadura
and
mrCherry97
authored
refactor: Kyma Modules move queries to separate file (#3637)
* move queries to separate file * fix acc resources counter * fix acc resources counter * get rid of useGet in Add Modules and add skips * get rid of useGet in kyma create view * idk how to name it * hakunamatata * being blind is not a crime --------- Co-authored-by: mrCherry97 <mwisnia97@gmail.com>
1 parent 043e79e commit 79d7b67

File tree

7 files changed

+152
-128
lines changed

7 files changed

+152
-128
lines changed

‎src/components/Clusters/views/ClusterOverview/ClusterDetails.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { DynamicPageComponent } from 'shared/components/DynamicPageComponent/Dyn
77
import ResourceDetailsCard from 'shared/components/ResourceDetails/ResourceDetailsCard';
88
import { Button, Text } from '@ui5/webcomponents-react';
99
import { CountingCard } from 'shared/components/CountingCard/CountingCard';
10-
import { useKymaModulesQuery } from 'components/KymaModules/KymaModulesQuery';
10+
import { useKymaModulesQuery } from 'components/KymaModules/kymaModulesQueries';
1111
import { useUrl } from 'hooks/useUrl';
1212
import { useNavigate } from 'react-router-dom';
1313
import { spacing } from '@ui5/webcomponents-react-base';

‎src/components/KymaModules/KymaModulesAddModule.js‎

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,16 @@ import { useCallback, useEffect, useState } from 'react';
22
import { MessageStrip } from '@ui5/webcomponents-react';
33
import { spacing } from '@ui5/webcomponents-react-base';
44
import { useTranslation } from 'react-i18next';
5-
import { useGet } from 'shared/hooks/BackendAPI/useGet';
65
import { ResourceForm } from 'shared/ResourceForm';
76
import { Spinner } from 'shared/components/Spinner/Spinner';
87
import ModulesCard from './ModulesCard';
9-
import './KymaModulesAddModule.scss';
108
import { cloneDeep } from 'lodash';
9+
import {
10+
useModulesReleaseQuery,
11+
useModuleTemplatesQuery,
12+
} from './kymaModulesQueries';
13+
14+
import './KymaModulesAddModule.scss';
1115

1216
export default function KymaModulesAddModule({
1317
resourceName,
@@ -21,10 +25,6 @@ export default function KymaModulesAddModule({
2125
}) {
2226
const { t } = useTranslation();
2327

24-
const modulesResourceUrl = `/apis/operator.kyma-project.io/v1beta2/moduletemplates`;
25-
26-
const modulesReleaseMetaResourceUrl = `/apis/operator.kyma-project.io/v1beta2/modulereleasemetas`;
27-
2828
const [resource, setResource] = useState(cloneDeep(kymaResource));
2929

3030
const [selectedModules, setSelectedModules] = useState([]);
@@ -48,13 +48,10 @@ export default function KymaModulesAddModule({
4848
}
4949
}, [setKymaResource, kymaResource, selectedModules, activeKymaModules]);
5050

51-
const { data: modules } = useGet(modulesResourceUrl, {
52-
pollingInterval: 3000,
51+
const { data: moduleReleaseMetas } = useModulesReleaseQuery({
5352
skip: !resourceName,
5453
});
55-
56-
const { data: moduleReleaseMetas } = useGet(modulesReleaseMetaResourceUrl, {
57-
pollingInterval: 3000,
54+
const { data: moduleTemplates } = useModuleTemplatesQuery({
5855
skip: !resourceName,
5956
});
6057

@@ -99,7 +96,7 @@ export default function KymaModulesAddModule({
9996
);
10097
}
10198

102-
const modulesAddData = modules?.items.reduce((acc, module) => {
99+
const modulesAddData = moduleTemplates?.items.reduce((acc, module) => {
103100
const name = module.metadata.labels['operator.kyma-project.io/module-name'];
104101
const existingModule = acc.find(item => item.name === name);
105102
const isAlreadyInstalled = initialUnchangedResource?.spec?.modules?.find(

‎src/components/KymaModules/KymaModulesCreate.js‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import { useTranslation } from 'react-i18next';
77
import { useUrl } from 'hooks/useUrl';
88

99
import { useNotification } from 'shared/contexts/NotificationContext';
10-
import { useGet } from 'shared/hooks/BackendAPI/useGet';
1110
import { useUpdate } from 'shared/hooks/BackendAPI/useMutation';
1211
import { useSingleGet } from 'shared/hooks/BackendAPI/useGet';
1312
import { HttpError } from 'shared/hooks/BackendAPI/config';
@@ -33,6 +32,10 @@ import { isResourceEditedState } from 'state/resourceEditedAtom';
3332
import { ManagedWarnings } from './ManagedWarnings';
3433
import { ChannelWarning } from './ChannelWarning';
3534
import { UnmanagedModuleInfo } from './UnmanagedModuleInfo';
35+
import {
36+
useModulesReleaseQuery,
37+
useModuleTemplatesQuery,
38+
} from './kymaModulesQueries';
3639

3740
export default function KymaModulesCreate({ resource, ...props }) {
3841
const { t } = useTranslation();
@@ -43,20 +46,17 @@ export default function KymaModulesCreate({ resource, ...props }) {
4346
const setIsFormOpen = useSetRecoilState(isFormOpenState);
4447

4548
const resourceName = kymaResource?.metadata.name;
46-
const modulesResourceUrl = `/apis/operator.kyma-project.io/v1beta2/moduletemplates`;
47-
48-
const modulesReleaseMetaResourceUrl = `/apis/operator.kyma-project.io/v1beta2/modulereleasemetas`;
49-
50-
const { data: modules, loading: lodingModules } = useGet(modulesResourceUrl, {
51-
pollingInterval: 3000,
52-
skip: !resourceName,
53-
});
5449

5550
const {
5651
data: moduleReleaseMetas,
5752
loading: loadingModulesReleaseMetas,
58-
} = useGet(modulesReleaseMetaResourceUrl, {
59-
pollingInterval: 3000,
53+
} = useModulesReleaseQuery({
54+
skip: !resourceName,
55+
});
56+
const {
57+
data: moduleTemplates,
58+
loading: lodingModuleTemplates,
59+
} = useModuleTemplatesQuery({
6060
skip: !resourceName,
6161
});
6262

@@ -79,7 +79,7 @@ export default function KymaModulesCreate({ resource, ...props }) {
7979
onSave: false,
8080
});
8181

82-
if (lodingModules || loadingModulesReleaseMetas) {
82+
if (lodingModuleTemplates || loadingModulesReleaseMetas) {
8383
return (
8484
<div style={{ height: 'calc(100vh - 14rem)' }}>
8585
<Spinner />
@@ -128,7 +128,7 @@ export default function KymaModulesCreate({ resource, ...props }) {
128128
setShowManagedBox({ isOpen: true, onSave: false });
129129
};
130130

131-
const installedModules = modules?.items.filter(module => {
131+
const installedModules = moduleTemplates?.items.filter(module => {
132132
const name =
133133
module.metadata?.labels['operator.kyma-project.io/module-name'];
134134
return (

‎src/components/KymaModules/KymaModulesList.js‎

Lines changed: 57 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,14 @@ import jsyaml from 'js-yaml';
44

55
import { ResourceDetails } from 'shared/components/ResourceDetails/ResourceDetails';
66
import {
7-
DynamicPageHeader,
7+
Badge,
88
Button,
9+
DynamicPageHeader,
910
FlexBox,
10-
Text,
11-
Badge,
1211
List,
13-
StandardListItem,
1412
MessageStrip,
13+
StandardListItem,
14+
Text,
1515
} from '@ui5/webcomponents-react';
1616

1717
import { HintButton } from 'shared/components/DescriptionHint/DescriptionHint';
@@ -28,11 +28,11 @@ import { ExternalLink } from 'shared/components/ExternalLink/ExternalLink';
2828
import { EMPTY_TEXT_PLACEHOLDER } from 'shared/constants';
2929
import KymaModulesCreate from './KymaModulesCreate';
3030
import {
31+
apiGroup,
32+
apiVersion,
3133
ReleaseChannelDescription,
3234
ResourceDescription,
3335
resourceType,
34-
apiGroup,
35-
apiVersion,
3636
} from 'components/KymaModules';
3737
import { useSetRecoilState } from 'recoil';
3838
import { columnLayoutState } from 'state/columnLayoutAtom';
@@ -45,6 +45,10 @@ import { ModuleStatus } from './components/ModuleStatus';
4545
import { cloneDeep } from 'lodash';
4646
import { StatusBadge } from 'shared/components/StatusBadge/StatusBadge';
4747
import { useNavigate } from 'react-router-dom';
48+
import {
49+
useModulesReleaseQuery,
50+
useModuleTemplatesQuery,
51+
} from './kymaModulesQueries';
4852

4953
export default function KymaModulesList({
5054
DeleteMessageBox,
@@ -56,7 +60,6 @@ export default function KymaModulesList({
5660
resourceUrl,
5761
kymaResource,
5862
kymaResourceLoading,
59-
kymaResourcesLoading,
6063
kymaResourceState,
6164
selectedModules,
6265
setOpenedModuleIndex,
@@ -83,29 +86,21 @@ export default function KymaModulesList({
8386

8487
const namespace = 'kyma-system';
8588

86-
const modulesResourceUrl = `/apis/operator.kyma-project.io/v1beta2/moduletemplates`;
87-
const modulesReleaseMetaResourceUrl = `/apis/operator.kyma-project.io/v1beta2/modulereleasemetas`;
88-
89-
const { data: moduleReleaseMetas } = useGet(modulesReleaseMetaResourceUrl, {
90-
pollingInterval: 3000,
89+
const { data: moduleReleaseMetas } = useModulesReleaseQuery({
9190
skip: !resourceName,
9291
});
93-
94-
const { data: modules, loading: modulesLoading } = useGet(
95-
modulesResourceUrl,
96-
{
97-
pollingInterval: 3000,
98-
skip: !resourceName,
99-
},
100-
);
92+
const {
93+
data: moduleTemplates,
94+
loading: moduleTemplateLoading,
95+
} = useModuleTemplatesQuery({ skip: !resourceName });
10196

10297
const crdUrl = `/apis/apiextensions.k8s.io/v1/customresourcedefinitions`;
10398
const { data: crds } = useGet(crdUrl, {
10499
pollingInterval: 5000,
105100
});
106101
const [chosenModuleIndex, setChosenModuleIndex] = useState(null);
107102

108-
if (kymaResourcesLoading || modulesLoading || kymaResourceLoading) {
103+
if (moduleTemplateLoading || kymaResourceLoading) {
109104
return <Spinner />;
110105
}
111106

@@ -125,22 +120,25 @@ export default function KymaModulesList({
125120

126121
const ModulesList = resource => {
127122
const findModule = (moduleName, channel, version) => {
128-
// This change was made due to changes in modules and should be simplified once all modules migrate
129-
const moduleWithoutInfo = modules?.items?.find(
130-
module =>
123+
// This change was made due to changes in moduleTemplates and should be simplified once all moduleTemplates migrate
124+
const moduleTemplateWithoutInfo = moduleTemplates?.items?.find(
125+
moduleTemplate =>
131126
moduleName ===
132-
module.metadata.labels['operator.kyma-project.io/module-name'] &&
133-
module.spec.channel === channel,
127+
moduleTemplate.metadata.labels[
128+
'operator.kyma-project.io/module-name'
129+
] && moduleTemplate.spec.channel === channel,
134130
);
135-
const moduleWithInfo = modules?.items?.find(
136-
module =>
131+
const moduleWithInfo = moduleTemplates?.items?.find(
132+
moduleTemplate =>
137133
moduleName ===
138-
module.metadata.labels['operator.kyma-project.io/module-name'] &&
139-
!module.spec.channel &&
140-
module.spec.version === version,
134+
moduleTemplate.metadata.labels[
135+
'operator.kyma-project.io/module-name'
136+
] &&
137+
!moduleTemplate.spec.channel &&
138+
moduleTemplate.spec.version === version,
141139
);
142140

143-
return moduleWithInfo ?? moduleWithoutInfo;
141+
return moduleWithInfo ?? moduleTemplateWithoutInfo;
144142
};
145143

146144
const findModuleReleaseMeta = moduleName => {
@@ -487,27 +485,33 @@ export default function KymaModulesList({
487485
mode="None"
488486
separators="All"
489487
>
490-
{getAssociatedResources().map(assResource => (
491-
<StandardListItem
492-
onClick={e => {
493-
e.preventDefault();
494-
handleItemClick(
495-
assResource.kind,
496-
assResource.group,
497-
assResource.version,
498-
);
499-
}}
500-
type="Active"
501-
key={`${assResource.kind}-${assResource.group}-${assResource.version}`}
502-
additionalText={
503-
resourceCounts[
504-
`${assResource.kind}-${assResource.group}-${assResource.version}`
505-
] || t('common.headers.loading')
506-
}
507-
>
508-
{pluralize(assResource?.kind)}
509-
</StandardListItem>
510-
))}
488+
{getAssociatedResources().map(assResource => {
489+
const resourceCount =
490+
resourceCounts[
491+
`${assResource.kind}-${assResource.group}-${assResource.version}`
492+
];
493+
494+
return (
495+
<StandardListItem
496+
onClick={e => {
497+
e.preventDefault();
498+
handleItemClick(
499+
assResource.kind,
500+
assResource.group,
501+
assResource.version,
502+
);
503+
}}
504+
type="Active"
505+
key={`${assResource.kind}-${assResource.group}-${assResource.version}`}
506+
additionalText={
507+
(resourceCount === 0 ? '0' : resourceCount) ||
508+
t('common.headers.loading')
509+
}
510+
>
511+
{pluralize(assResource?.kind)}
512+
</StandardListItem>
513+
);
514+
})}
511515
</List>
512516
</>
513517
)

‎src/components/KymaModules/KymaModulesQuery.js‎

Lines changed: 0 additions & 30 deletions
This file was deleted.

0 commit comments

Comments
 (0)