@@ -16,7 +16,7 @@ import {
1616 ModuleTemplateListType ,
1717 ModuleTemplateType ,
1818} from 'components/KymaModules/support' ;
19- import { Button , Form , FormItem } from '@ui5/webcomponents-react' ;
19+ import { Button , Form , FormItem , MessageStrip } from '@ui5/webcomponents-react' ;
2020import { useContext , useEffect , useMemo , useState } from 'react' ;
2121import { UnsavedMessageBox } from 'shared/components/UnsavedMessageBox/UnsavedMessageBox' ;
2222import { createPortal } from 'react-dom' ;
@@ -32,6 +32,7 @@ import {
3232import { ModuleTemplatesContext } from 'components/KymaModules/providers/ModuleTemplatesProvider' ;
3333
3434import './CommunityModule.scss' ;
35+ import { capitalizeFirstLetter } from '@ui5/webcomponents-react-base' ;
3536
3637const isModuleInstalled = (
3738 foundModuleTemplate : ModuleTemplateType ,
@@ -125,7 +126,9 @@ function transformDataForDisplay(
125126) : ModuleDisplayInfo [ ] {
126127 return Array . from ( availableCommunityModules , ( [ moduleName , versions ] ) => {
127128 const formatDisplayText = ( v : VersionInfo ) : string => {
128- return `${ v . channel ? v . channel + ' ' : '' } (v${ v . version } )` ;
129+ return `${ v . channel ? capitalizeFirstLetter ( v . channel ) + ' ' : '' } (v${
130+ v . version
131+ } )`;
129132 } ;
130133
131134 return {
@@ -220,6 +223,7 @@ export default function CommunityModulesEdit() {
220223 return (
221224 < section >
222225 < UI5Panel
226+ testid = { 'community-modules-edit' }
223227 title = { '' }
224228 headerActions = {
225229 < Button
@@ -250,24 +254,34 @@ export default function CommunityModulesEdit() {
250254 className = "collapsible-margins"
251255 title = { t ( 'modules.community.title' ) }
252256 >
253- < div className = { 'edit' } >
254- { communityModulesToDisplay &&
255- communityModulesToDisplay . map ( ( module , idx ) => {
256- return (
257- < CommunityModuleVersionSelect
258- key = { `${ module . name } +${ idx } ` }
259- module = { module }
260- onChange = { onVersionChange (
261- communityModuleTemplates ,
262- installedCommunityModuleTemplates ,
263- communityModulesTemplatesToApply ,
264- setCommunityModulesTemplatesToApply ,
265- setIsResourceEdited ,
266- ) }
267- />
268- ) ;
269- } ) }
270- </ div >
257+ { installedCommunityModuleTemplates . items . length !== 0 ? (
258+ < div className = { 'edit' } >
259+ { communityModulesToDisplay &&
260+ communityModulesToDisplay . map ( ( module , idx ) => {
261+ return (
262+ < CommunityModuleVersionSelect
263+ key = { `${ module . name } +${ idx } ` }
264+ module = { module }
265+ onChange = { onVersionChange (
266+ communityModuleTemplates ,
267+ installedCommunityModuleTemplates ,
268+ communityModulesTemplatesToApply ,
269+ setCommunityModulesTemplatesToApply ,
270+ setIsResourceEdited ,
271+ ) }
272+ />
273+ ) ;
274+ } ) }
275+ </ div >
276+ ) : (
277+ < MessageStrip
278+ design = "Critical"
279+ hideCloseButton
280+ className = "sap-margin-top-small"
281+ >
282+ { t ( 'modules.community.no-modules-installed' ) }
283+ </ MessageStrip >
284+ ) }
271285 </ CollapsibleSection >
272286 </ div >
273287 </ FormItem >
0 commit comments