Skip to content

Commit 468b424

Browse files
KonradPietochaKonradPietocha
committed
PR corrections
1 parent 5f214eb commit 468b424

File tree

4 files changed

+167
-133
lines changed

4 files changed

+167
-133
lines changed

‎src/components/KymaModules/KymaModulesList.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ export default function KymaModulesList({
6767
customComponents={[
6868
resource => (
6969
<ModulesList
70+
key="kyma-modules-list"
7071
resource={resource}
7172
moduleTemplates={moduleTemplates}
7273
resourceName={resourceName}

‎src/components/KymaModules/components/ModulesList.tsx‎

Lines changed: 15 additions & 131 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import { useTranslation } from 'react-i18next';
33
import { useSetRecoilState } from 'recoil';
44
import jsyaml from 'js-yaml';
5-
import { Button, Tag, Text } from '@ui5/webcomponents-react';
5+
import { Button } from '@ui5/webcomponents-react';
66
import pluralize from 'pluralize';
77
import {
88
findModuleStatus,
@@ -11,11 +11,8 @@ import {
1111
KymaResourceStatusModuleType,
1212
KymaResourceType,
1313
ModuleTemplateListType,
14-
ModuleTemplateType,
1514
} from '../support';
1615
import { UnmanagedModuleInfo } from './UnmanagedModuleInfo';
17-
import { ModuleStatus, resolveType } from './ModuleStatus';
18-
import { useModulesReleaseQuery } from '../kymaModulesQueries';
1916
import { useUrl } from 'hooks/useUrl';
2017
import { extractApiGroupVersion } from 'resources/Roles/helpers';
2118
import {
@@ -24,15 +21,9 @@ import {
2421
ShowCreate,
2522
} from 'state/columnLayoutAtom';
2623
import { isFormOpenState } from 'state/formOpenAtom';
27-
import { EMPTY_TEXT_PLACEHOLDER } from 'shared/constants';
2824
import { useGet, useGetList } from 'shared/hooks/BackendAPI/useGet';
2925
import { GenericList } from 'shared/components/GenericList/GenericList';
30-
import { StatusBadge } from 'shared/components/StatusBadge/StatusBadge';
31-
import { ExternalLink } from 'shared/components/ExternalLink/ExternalLink';
32-
33-
type ModuleReleaseMetasType = {
34-
items: { spec: { moduleName: string; beta: boolean } }[];
35-
};
26+
import { ModulesListRows } from './ModulesListRows';
3627

3728
type CustomResourceDefinitionsType = {
3829
items: {
@@ -67,9 +58,6 @@ export const ModulesList = ({
6758
handleResourceDelete,
6859
}: ModulesListProps) => {
6960
const { t } = useTranslation();
70-
const { data: moduleReleaseMetas } = useModulesReleaseQuery({
71-
skip: !resourceName,
72-
});
7361
const { data: kymaExt } = useGetList(
7462
(ext: { metadata: { labels: Record<string, string> } }) =>
7563
ext.metadata.labels['app.kubernetes.io/part-of'] === 'Kyma',
@@ -104,12 +92,6 @@ export const ModulesList = ({
10492
setIsFormOpen(state => ({ ...state, formOpen: true }));
10593
};
10694

107-
const findModuleReleaseMeta = (moduleName: string) => {
108-
return (moduleReleaseMetas as ModuleReleaseMetasType | null)?.items.find(
109-
item => item.spec.moduleName === moduleName,
110-
);
111-
};
112-
11395
const findExtension = (resourceKind: string) => {
11496
return (kymaExt as { data: { general: string } }[] | null)?.find(ext => {
11597
const { resource: extensionResource } =
@@ -118,16 +100,6 @@ export const ModulesList = ({
118100
});
119101
};
120102

121-
const checkBeta = (
122-
module: ModuleTemplateType | undefined,
123-
currentModuleReleaseMeta?: { spec: { moduleName: string; beta: boolean } },
124-
) => {
125-
return (
126-
module?.metadata.labels['operator.kyma-project.io/beta'] === 'true' ||
127-
currentModuleReleaseMeta?.spec?.beta === true
128-
);
129-
};
130-
131103
const findCrd = (resourceKind: string) => {
132104
return (crds as CustomResourceDefinitionsType | null)?.items?.find(
133105
crd => crd.spec?.names?.kind === resourceKind,
@@ -173,102 +145,6 @@ export const ModulesList = ({
173145
);
174146
};
175147

176-
const rowRenderer = (resource: {
177-
name: string;
178-
channel: string;
179-
version: string;
180-
resource: { kind: string };
181-
}) => {
182-
const moduleStatus = findModuleStatus(kymaResource, resource.name);
183-
const showDetailsLink = hasDetailsLink(resource);
184-
const moduleIndex = kymaResource?.spec?.modules?.findIndex(
185-
kymaResourceModule => {
186-
return kymaResourceModule?.name === resource?.name;
187-
},
188-
);
189-
190-
const currentModuleTemplate = findModuleTemplate(
191-
moduleTemplates,
192-
resource?.name,
193-
resource?.channel || kymaResource?.spec?.channel,
194-
resource?.version,
195-
);
196-
197-
const moduleDocs =
198-
currentModuleTemplate?.spec?.info?.documentation ||
199-
currentModuleTemplate?.metadata?.annotations[
200-
'operator.kyma-project.io/doc-url'
201-
];
202-
203-
const currentModuleReleaseMeta = findModuleReleaseMeta(resource.name);
204-
205-
const isChannelOverriden =
206-
kymaResource?.spec?.modules?.[moduleIndex]?.channel !== undefined;
207-
208-
return [
209-
// Name
210-
<>
211-
{showDetailsLink ? (
212-
<Text style={{ fontWeight: 'bold', color: 'var(--sapLinkColor)' }}>
213-
{resource.name}
214-
</Text>
215-
) : (
216-
resource.name
217-
)}
218-
{checkBeta(currentModuleTemplate, currentModuleReleaseMeta) ? (
219-
<Tag
220-
className="sap-margin-begin-tiny"
221-
hideStateIcon
222-
colorScheme="3"
223-
design="Set2"
224-
>
225-
{t('kyma-modules.beta')}
226-
</Tag>
227-
) : null}
228-
</>,
229-
// Namespace
230-
moduleStatus?.resource?.metadata?.namespace || EMPTY_TEXT_PLACEHOLDER,
231-
// Channel
232-
<>
233-
{moduleStatus?.channel
234-
? moduleStatus?.channel
235-
: kymaResource?.spec?.modules?.[moduleIndex]?.channel ||
236-
kymaResource?.spec?.channel}
237-
{isChannelOverriden ? (
238-
<Tag
239-
hideStateIcon
240-
design="Set2"
241-
colorScheme="5"
242-
className="sap-margin-begin-tiny"
243-
>
244-
{t('kyma-modules.channel-overridden')}
245-
</Tag>
246-
) : (
247-
''
248-
)}
249-
</>,
250-
// Version
251-
moduleStatus?.version || EMPTY_TEXT_PLACEHOLDER,
252-
// Module State
253-
<ModuleStatus key="module-state" resource={resource} />,
254-
// Installation State
255-
<StatusBadge
256-
key="installation-state"
257-
resourceKind="kymas"
258-
type={resolveType(moduleStatus?.state ?? '')}
259-
tooltipContent={moduleStatus?.message}
260-
>
261-
{moduleStatus?.state || 'Unknown'}
262-
</StatusBadge>,
263-
// Documentation
264-
moduleDocs ? (
265-
<ExternalLink url={moduleDocs}>{t('common.headers.link')}</ExternalLink>
266-
) : (
267-
EMPTY_TEXT_PLACEHOLDER
268-
),
269-
];
270-
};
271-
272148
const customColumnLayout = (resource: { name: string }) => {
273149
return {
274150
resourceName: resource?.name,
@@ -329,11 +205,11 @@ export const ModulesList = ({
329205
);
330206
const moduleCr = connectedModule?.spec?.data;
331207
moduleStatus.resource = {
332-
kind: moduleCr?.kind,
333-
apiVersion: moduleCr?.apiVersion,
208+
kind: moduleCr.kind,
209+
apiVersion: moduleCr.apiVersion,
334210
metadata: {
335-
name: moduleCr?.metadata?.name,
336-
namespace: moduleCr?.metadata?.namespace,
211+
name: moduleCr.metadata.name,
212+
namespace: moduleCr.metadata.namespace,
337213
},
338214
};
339215
}
@@ -435,7 +311,15 @@ export const ModulesList = ({
435311
getEntries(resource?.status?.modules, resource?.spec?.modules) as any
436312
}
437313
headerRenderer={headerRenderer}
438-
rowRenderer={rowRenderer}
314+
rowRenderer={resource =>
315+
ModulesListRows({
316+
resourceName,
317+
resource,
318+
kymaResource,
319+
moduleTemplates,
320+
hasDetailsLink,
321+
})
322+
}
439323
noHideFields={['Name', '', 'Namespace']}
440324
displayArrow
441325
title={'Modules'}

‎src/components/KymaModules/components/ModulesListRows.tsx‎

Lines changed: 150 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,150 @@
1+
import { Tag, Text } from '@ui5/webcomponents-react';
2+
import {
3+
findModuleStatus,
4+
findModuleTemplate,
5+
KymaResourceType,
6+
ModuleTemplateListType,
7+
ModuleTemplateType,
8+
} from '../support';
9+
import { EMPTY_TEXT_PLACEHOLDER } from 'shared/constants';
10+
import { useTranslation } from 'react-i18next';
11+
import { useModulesReleaseQuery } from '../kymaModulesQueries';
12+
import { ModuleStatus, resolveType } from './ModuleStatus';
13+
import { StatusBadge } from 'shared/components/StatusBadge/StatusBadge';
14+
import { ExternalLink } from 'shared/components/ExternalLink/ExternalLink';
15+
16+
type RowResourceType = {
17+
name: string;
18+
channel: string;
19+
version: string;
20+
resource: { kind: string };
21+
};
22+
23+
type ModuleReleaseMetasType = {
24+
items: { spec: { moduleName: string; beta: boolean } }[];
25+
};
26+
27+
type ModulesListRowsProps = {
28+
resourceName: string;
29+
resource: RowResourceType;
30+
kymaResource: KymaResourceType;
31+
moduleTemplates: ModuleTemplateListType;
32+
hasDetailsLink: (resource: RowResourceType) => boolean;
33+
};
34+
35+
export const ModulesListRows = ({
36+
resourceName,
37+
resource,
38+
kymaResource,
39+
moduleTemplates,
40+
hasDetailsLink,
41+
}: ModulesListRowsProps) => {
42+
const { t } = useTranslation();
43+
const { data: moduleReleaseMetas } = useModulesReleaseQuery({
44+
skip: !resourceName,
45+
});
46+
const findModuleReleaseMeta = (moduleName: string) => {
47+
return (moduleReleaseMetas as ModuleReleaseMetasType | null)?.items.find(
48+
item => item.spec.moduleName === moduleName,
49+
);
50+
};
51+
52+
const checkBeta = (
53+
module: ModuleTemplateType | undefined,
54+
currentModuleReleaseMeta?: { spec: { moduleName: string; beta: boolean } },
55+
) => {
56+
return (
57+
module?.metadata.labels['operator.kyma-project.io/beta'] === 'true' ||
58+
currentModuleReleaseMeta?.spec?.beta === true
59+
);
60+
};
61+
62+
const moduleStatus = findModuleStatus(kymaResource, resource.name);
63+
const showDetailsLink = hasDetailsLink(resource);
64+
const moduleIndex = kymaResource?.spec?.modules?.findIndex(
65+
kymaResourceModule => {
66+
return kymaResourceModule?.name === resource?.name;
67+
},
68+
);
69+
70+
const currentModuleTemplate = findModuleTemplate(
71+
moduleTemplates,
72+
resource?.name,
73+
resource?.channel || kymaResource?.spec?.channel,
74+
resource?.version,
75+
);
76+
77+
const moduleDocs =
78+
currentModuleTemplate?.spec?.info?.documentation ||
79+
currentModuleTemplate?.metadata?.annotations[
80+
'operator.kyma-project.io/doc-url'
81+
];
82+
83+
const currentModuleReleaseMeta = findModuleReleaseMeta(resource.name);
84+
85+
const isChannelOverriden =
86+
kymaResource?.spec?.modules?.[moduleIndex]?.channel !== undefined;
87+
88+
return [
89+
// Name
90+
<>
91+
{showDetailsLink ? (
92+
<Text style={{ fontWeight: 'bold', color: 'var(--sapLinkColor)' }}>
93+
{resource.name}
94+
</Text>
95+
) : (
96+
resource.name
97+
)}
98+
{checkBeta(currentModuleTemplate, currentModuleReleaseMeta) ? (
99+
<Tag
100+
className="sap-margin-begin-tiny"
101+
hideStateIcon
102+
colorScheme="3"
103+
design="Set2"
104+
>
105+
{t('kyma-modules.beta')}
106+
</Tag>
107+
) : null}
108+
</>,
109+
// Namespace
110+
moduleStatus?.resource?.metadata?.namespace || EMPTY_TEXT_PLACEHOLDER,
111+
// Channel
112+
<>
113+
{moduleStatus?.channel
114+
? moduleStatus?.channel
115+
: kymaResource?.spec?.modules?.[moduleIndex]?.channel ||
116+
kymaResource?.spec?.channel}
117+
{isChannelOverriden ? (
118+
<Tag
119+
hideStateIcon
120+
design="Set2"
121+
colorScheme="5"
122+
className="sap-margin-begin-tiny"
123+
>
124+
{t('kyma-modules.channel-overridden')}
125+
</Tag>
126+
) : (
127+
''
128+
)}
129+
</>,
130+
// Version
131+
moduleStatus?.version || EMPTY_TEXT_PLACEHOLDER,
132+
// Module State
133+
<ModuleStatus key="module-state" resource={resource} />,
134+
// Installation State
135+
<StatusBadge
136+
key="installation-state"
137+
resourceKind="kymas"
138+
type={resolveType(moduleStatus?.state ?? '')}
139+
tooltipContent={moduleStatus?.message}
140+
>
141+
{moduleStatus?.state || 'Unknown'}
142+
</StatusBadge>,
143+
// Documentation
144+
moduleDocs ? (
145+
<ExternalLink url={moduleDocs}>{t('common.headers.link')}</ExternalLink>
146+
) : (
147+
EMPTY_TEXT_PLACEHOLDER
148+
),
149+
];
150+
};

‎src/components/KymaModules/support.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -134,8 +134,7 @@ export const findModuleStatus = (
134134
moduleName: string,
135135
) => {
136136
return kymaResource?.status?.modules?.find(
137-
(module: { name: string; version?: string; state?: string }) =>
138-
moduleName === module?.name,
137+
(module: { name: string }) => moduleName === module?.name,
139138
);
140139
};
141140

0 commit comments

Comments
 (0)