diff --git a/newIDE/app/src/AssetStore/AssetCard.js b/newIDE/app/src/AssetStore/AssetCard.js index 3a87c733f9..c7e8379204 100644 --- a/newIDE/app/src/AssetStore/AssetCard.js +++ b/newIDE/app/src/AssetStore/AssetCard.js @@ -11,6 +11,7 @@ import { CorsAwareImage } from '../UI/CorsAwareImage'; import CheckeredBackground from '../ResourcesList/CheckeredBackground'; import AuthorizedAssetImage from './PrivateAssets/AuthorizedAssetImage'; import { textEllipsisStyle } from '../UI/TextEllipsis'; +import { capitalize } from 'lodash'; const paddingSize = 10; const styles = { @@ -99,7 +100,7 @@ export const AssetCard = ({ id, assetShortHeader, size }: Props) => { }} > - {assetShortHeader.name} + {capitalize(assetShortHeader.name)} {assetShortHeader.shortDescription && ( diff --git a/newIDE/app/src/AssetStore/AssetDetails.js b/newIDE/app/src/AssetStore/AssetDetails.js index 55cb596a3e..2a28f8c7ec 100644 --- a/newIDE/app/src/AssetStore/AssetDetails.js +++ b/newIDE/app/src/AssetStore/AssetDetails.js @@ -41,6 +41,7 @@ import { getPixelatedImageRendering } from '../Utils/CssHelpers'; import ArrowRight from '../UI/CustomSvgIcons/ArrowRight'; import ArrowLeft from '../UI/CustomSvgIcons/ArrowLeft'; import PublicProfileDialog from '../Profile/PublicProfileDialog'; +import { capitalize } from 'lodash'; const FIXED_HEIGHT = 250; const FIXED_WIDTH = 300; @@ -75,9 +76,6 @@ const styles = { }, }; -const makeFirstLetterUppercase = (str: string) => - str.charAt(0).toUpperCase() + str.slice(1); - type Props = {| onTagSelection: (tag: string) => void, assetShortHeader: AssetShortHeader, @@ -298,7 +296,7 @@ export const AssetDetails = React.forwardRef( - {assetShortHeader.name} + {capitalize(assetShortHeader.name)} {!areAuthorsLoading && ( @@ -350,7 +348,7 @@ export const AssetDetails = React.forwardRef( { onTagSelection(tag); }} @@ -468,7 +466,7 @@ export const AssetDetails = React.forwardRef( value={animation.name} label={ !isAnimationNameEmpty - ? makeFirstLetterUppercase(animation.name) + ? capitalize(animation.name) : t`Default` // Display default for animations with no name. } shouldNotTranslate={!isAnimationNameEmpty}