diff --git a/src/components/Atlas/Atlas.tsx b/src/components/Atlas/Atlas.tsx index a3983c152..b12b294ac 100644 --- a/src/components/Atlas/Atlas.tsx +++ b/src/components/Atlas/Atlas.tsx @@ -19,6 +19,7 @@ const Atlas: React.FC = props => { emptyTiles, showOwner, showOperator, + showTenant, showControls, hasPopup, className, @@ -79,32 +80,37 @@ const Atlas: React.FC = props => { [props.x, props.y, landId, isEstate, selection] ) - const shouldShowLayer = (tile?: LandTile, showOwner?: boolean, showOperator?: boolean) => { - return !!tile && ((showOwner && tile.land.role === RoleType.OWNER) || (showOperator && tile.land.role === RoleType.OPERATOR)) + const shouldShowLayer = (tile?: LandTile, showOwner?: boolean, showOperator?: boolean, showTenant?: boolean) => { + return ( + !!tile && + ((showOwner && tile.land.role === RoleType.OWNER) || + (showOperator && tile.land.role === RoleType.OPERATOR) || + (showTenant && tile.land.role === RoleType.TENANT)) + ) } const landLayer: Layer = useCallback( (x, y) => { const id = coordsToId(x, y) const tile = landTiles[id] - if (shouldShowLayer(tile, showOwner, showOperator)) { + if (shouldShowLayer(tile, showOwner, showOperator, showTenant)) { return tile || null } return null }, - [landTiles, showOwner, showOperator] + [landTiles, showOwner, showOperator, showTenant] ) const unoccupiedLayer: Layer = useCallback( (x, y) => { const id = coordsToId(x, y) const tile = landTiles[id] - if (shouldShowLayer(tile, showOwner, showOperator)) { + if (shouldShowLayer(tile, showOwner, showOperator, showTenant)) { return emptyTiles[id] || null } return null }, - [emptyTiles, landTiles, showOwner, showOperator] + [emptyTiles, landTiles, showOwner, showOperator, showTenant] ) const handleHover = useCallback( diff --git a/src/components/Atlas/Atlas.types.ts b/src/components/Atlas/Atlas.types.ts index 6db6b1d50..936c6a898 100644 --- a/src/components/Atlas/Atlas.types.ts +++ b/src/components/Atlas/Atlas.types.ts @@ -9,6 +9,7 @@ export type Props = Partial & { landTiles: Record emptyTiles: Record showOperator?: boolean + showTenant?: boolean showControls?: boolean landId?: string showOwner?: boolean diff --git a/src/components/LandDetailPage/LandDetailPage.tsx b/src/components/LandDetailPage/LandDetailPage.tsx index 87f1615ff..7afa2e45e 100644 --- a/src/components/LandDetailPage/LandDetailPage.tsx +++ b/src/components/LandDetailPage/LandDetailPage.tsx @@ -274,8 +274,8 @@ export default class LandDetailPage extends React.PureComponent { {land.operators.length > 0 ? ( - {land.operators.map(operator => ( - + {land.operators.map((operator, index) => ( + ))} diff --git a/src/components/Modals/DeployModal/DeployToLand/DeployToLand.tsx b/src/components/Modals/DeployModal/DeployToLand/DeployToLand.tsx index d466bcd95..70e629a7a 100644 --- a/src/components/Modals/DeployModal/DeployToLand/DeployToLand.tsx +++ b/src/components/Modals/DeployModal/DeployToLand/DeployToLand.tsx @@ -230,7 +230,7 @@ export default class DeployToLand extends React.PureComponent { } renderMap = () => { - const { ethAddress, media, project, deployments, deploymentsByCoord, landTiles, isLoggedIn } = this.props + const { media, project, deployments, deploymentsByCoord, landTiles, isLoggedIn } = this.props const deployment = getDeployment(project, deployments) return (
@@ -242,7 +242,6 @@ export default class DeployToLand extends React.PureComponent {
{ handleSelectPlacement = () => { const { placement } = this.state const { onConfirmPlacement } = this.props - const overlappedDeployment = this.getOverlappedDeployemnt() + const overlappedDeployment = this.getOverlappedDeployment() if (placement) { overlappedDeployment ? onConfirmPlacement(placement, overlappedDeployment.id) : onConfirmPlacement(placement) } @@ -158,7 +158,7 @@ export default class LandAtlas extends React.PureComponent { return input } - getOverlappedDeployemnt = () => { + getOverlappedDeployment = () => { const { deploymentsByCoord, project } = this.props const { placement } = this.state if (project && placement) { @@ -197,7 +197,7 @@ export default class LandAtlas extends React.PureComponent { const parcelCount = Object.keys(landTiles).length const [targetX, targetY] = currentLandId ? idToCoords(currentLandId) : [0, 0] const target: Coordinate = { x: targetX, y: targetY } - const overlappedDeployment = this.getOverlappedDeployemnt() + const overlappedDeployment = this.getOverlappedDeployment() const conflictingDeployment = overlappedDeployment && deployment && @@ -238,6 +238,8 @@ export default class LandAtlas extends React.PureComponent {
{ <>
{deployments.map(deployment => ( - + ))}
{t('analytics.notice')}
diff --git a/src/modules/land/utils.ts b/src/modules/land/utils.ts index e25bc20ef..4869ef706 100644 --- a/src/modules/land/utils.ts +++ b/src/modules/land/utils.ts @@ -39,25 +39,25 @@ export const colorByRole: Record = { export const emptyColorByRole: Record = { [RoleType.OWNER]: '#ab2039', [RoleType.OPERATOR]: '#8f1d9b', - [RoleType.TENANT]: '#8f1d9b' + [RoleType.TENANT]: '#D18157' } export const selectionBorderColorByRole: Record = { [RoleType.OWNER]: '#ff8199', [RoleType.OPERATOR]: '#d742e8', - [RoleType.TENANT]: '#d742e8' + [RoleType.TENANT]: '#FEBD9A' } export const hoverFillByRole = { [RoleType.OWNER]: '#ff8199', [RoleType.OPERATOR]: '#d742e8', - [RoleType.TENANT]: '#d742e8' + [RoleType.TENANT]: '#FEBD9A' } export const hoverStrokeByRole = { [RoleType.OWNER]: '#fcc6d1', [RoleType.OPERATOR]: '#ef5eff', - [RoleType.TENANT]: '#ef5eff' + [RoleType.TENANT]: '#FED5BF' } export const getSelection = (land: Land) =>