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}