diff --git a/src/components/Place/PlaceDescription/PlaceDescription.tsx b/src/components/Place/PlaceDescription/PlaceDescription.tsx index 383edcb4..b289b807 100644 --- a/src/components/Place/PlaceDescription/PlaceDescription.tsx +++ b/src/components/Place/PlaceDescription/PlaceDescription.tsx @@ -8,6 +8,7 @@ import { TrackingPlacesSearchContext } from "../../../context/TrackingContext" import { AggregatePlaceAttributes } from "../../../entities/Place/types" import { explorerUrl } from "../../../entities/Place/utils" import { SegmentPlace } from "../../../modules/segment" +import { getImageUrl } from "../../../utils/image" import FavoriteBox from "../../Button/FavoriteBox" import JumpInPositionButton from "../../Button/JumpInPositionButton" import ShareBox from "../../Button/ShareBox" @@ -60,7 +61,7 @@ export default React.memo(function PlaceDescription( style={ !loading && place?.image ? { - backgroundImage: `url(${place.image})`, + backgroundImage: `url(${getImageUrl(place.image)})`, } : {} } diff --git a/src/components/Place/PlaceFeatured/PlaceFeatured.tsx b/src/components/Place/PlaceFeatured/PlaceFeatured.tsx index f45f729e..19746c5c 100644 --- a/src/components/Place/PlaceFeatured/PlaceFeatured.tsx +++ b/src/components/Place/PlaceFeatured/PlaceFeatured.tsx @@ -13,6 +13,7 @@ import { AggregatePlaceAttributes } from "../../../entities/Place/types" import { explorerUrl } from "../../../entities/Place/utils" import locations from "../../../modules/locations" import { SegmentPlace } from "../../../modules/segment" +import { getImageUrl } from "../../../utils/image" import UserCount from "../../Label/UserCount/UserCount" import "./PlaceFeatured.css" @@ -37,7 +38,9 @@ export default React.memo(function PlaceFeatured(props: PlaceFeaturedProps) {
diff --git a/src/components/World/WorldDescription/WorldDescription.tsx b/src/components/World/WorldDescription/WorldDescription.tsx index 6e92aba1..c374474c 100644 --- a/src/components/World/WorldDescription/WorldDescription.tsx +++ b/src/components/World/WorldDescription/WorldDescription.tsx @@ -7,6 +7,7 @@ import TokenList from "decentraland-gatsby/dist/utils/dom/TokenList" import { AggregatePlaceAttributes } from "../../../entities/Place/types" import { explorerUrl } from "../../../entities/Place/utils" import { SegmentPlace } from "../../../modules/segment" +import { getImageUrl } from "../../../utils/image" import FavoriteBox from "../../Button/FavoriteBox" import JumpInPositionButton from "../../Button/JumpInPositionButton" import ShareBox from "../../Button/ShareBox" @@ -58,7 +59,7 @@ export default React.memo(function WorldDescription( style={ !loading && world?.image ? { - backgroundImage: `url(${world.image})`, + backgroundImage: `url(${getImageUrl(world.image)})`, } : {} } diff --git a/src/utils/image.ts b/src/utils/image.ts new file mode 100644 index 00000000..ecff6bd0 --- /dev/null +++ b/src/utils/image.ts @@ -0,0 +1,8 @@ +import env from "decentraland-gatsby/dist/utils/env" + +export function getImageUrl(imageUrl?: string | null) { + if (env("NEW_ROLLOUT") && imageUrl && imageUrl.startsWith("/")) { + return `/places${imageUrl}` + } + return imageUrl +}