diff --git a/src/app/WardrobePage/support/Metadata.js b/src/app/WardrobePage/support/Metadata.js index 514505dc..30262948 100644 --- a/src/app/WardrobePage/support/Metadata.js +++ b/src/app/WardrobePage/support/Metadata.js @@ -5,7 +5,7 @@ import { Box } from "@chakra-ui/react"; * Metadata is a UI component for showing metadata about something, as labels * and their values. */ -function Metadata({ children, ...otherProps }) { +function Metadata({ children, ...props }) { return ( {children} ); } -function MetadataLabel({ children }) { +function MetadataLabel({ children, ...props }) { return ( - + {children} ); } -function MetadataValue({ children }) { +function MetadataValue({ children, ...props }) { return ( - + {children} ); diff --git a/src/app/WardrobePage/support/PosePickerSupport.js b/src/app/WardrobePage/support/PosePickerSupport.js index 03713247..aa263cf4 100644 --- a/src/app/WardrobePage/support/PosePickerSupport.js +++ b/src/app/WardrobePage/support/PosePickerSupport.js @@ -11,6 +11,8 @@ import { Wrap, WrapItem, useDisclosure, + UnorderedList, + ListItem, } from "@chakra-ui/react"; import { ArrowBackIcon, @@ -55,6 +57,10 @@ function PosePickerSupport({ imageUrl(size: SIZE_600) canvasMovieLibraryUrl } + restrictedZones { + id + label @client + } # For AppearanceLayerSupportModal to know the name species { @@ -185,7 +191,7 @@ function PosePickerSupport({ .map((layer) => [`${layer.zone.label} (${layer.zone.id})`, layer]) .sort((a, b) => a[0].localeCompare(b[0])) .map(([text, layer]) => ( - + + Restricts: + + {currentPetAppearance.restrictedZones.length > 1 ? ( + + {currentPetAppearance.restrictedZones + .map((zone) => `${zone.label} (${zone.id})`) + .sort((a, b) => a[0].localeCompare(b[0])) + .map((zoneText) => ( + {zoneText} + ))} + + ) : ( + + None + + )} + );