OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

[WIP] A better TODO message for the bulk add tool

Browse source
This commit is contained in:
Emi Matchu 2021-03-14 07:57:56 -07:00
parent d2eb941c24
commit f3f8f6748f
1 changed files with 19 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/app/WardrobePage/support/AllItemLayersSupportModal.js
View file

@ -28,6 +28,8 @@ import { EditIcon } from "@chakra-ui/icons";
import cachedZones from "../../cached-data/zones.json"; import cachedZones from "../../cached-data/zones.json";
function AllItemLayersSupportModal({ item, isOpen, onClose }) { function AllItemLayersSupportModal({ item, isOpen, onClose }) {
const [bulkAddProposal, setBulkAddProposal] = React.useState(null);
const { bodyBackground } = useCommonStyles(); const { bodyBackground } = useCommonStyles();
return ( return (
@ -44,7 +46,17 @@ function AllItemLayersSupportModal({ item, isOpen, onClose }) {
</ModalHeader> </ModalHeader>
<ModalCloseButton /> <ModalCloseButton />
<ModalBody paddingBottom="12"> <ModalBody paddingBottom="12">
<BulkAddBodySpecificAssetsForm /> <BulkAddBodySpecificAssetsForm onSubmit={setBulkAddProposal} />
<Box height="8" />
{bulkAddProposal ? (
<>
TODO: Show assets {bulkAddProposal.minAssetId}–
{Number(bulkAddProposal.minAssetId) + 53}, tenatively applied to
zone {bulkAddProposal.zoneId}
</>
) : (
""
)}
<Box height="8" /> <Box height="8" />
<AllItemLayersSupportModalContent item={item} /> <AllItemLayersSupportModalContent item={item} />
</ModalBody> </ModalBody>
@ -54,13 +66,13 @@ function AllItemLayersSupportModal({ item, isOpen, onClose }) {
); );
} }
function BulkAddBodySpecificAssetsForm() { function BulkAddBodySpecificAssetsForm({ onSubmit }) {
const zones = [...cachedZones].sort((a, b) => const zones = [...cachedZones].sort((a, b) =>
`${a.label} (${a.id})`.localeCompare(`${b.label} (${b.id})`) `${a.label} (${a.id})`.localeCompare(`${b.label} (${b.id})`)
); );
const [minAssetId, setMinAssetId] = React.useState(null); const [minAssetId, setMinAssetId] = React.useState(null);
const [selectedZoneId, setSelectedZoneId] = React.useState(zones[0].id); const [zoneId, setZoneId] = React.useState(zones[0].id);
return ( return (
<Flex <Flex
@ -71,7 +83,7 @@ function BulkAddBodySpecificAssetsForm() {
transition="0.2s all" transition="0.2s all"
onSubmit={(e) => { onSubmit={(e) => {
e.preventDefault(); e.preventDefault();
alert("TODO!"); onSubmit({ minAssetId, zoneId });
}} }}
> >
<Tooltip <Tooltip
@ -127,8 +139,8 @@ function BulkAddBodySpecificAssetsForm() {
<Select <Select
size="xs" size="xs"
width="20ch" width="20ch"
value={selectedZoneId} value={zoneId}
onChange={(e) => setSelectedZoneId(e.target.value)} onChange={(e) => setZoneId(e.target.value)}
> >
{zones.map((zone) => ( {zones.map((zone) => (
<option key={zone.id} value={zone.id}> <option key={zone.id} value={zone.id}>
@ -137,7 +149,7 @@ function BulkAddBodySpecificAssetsForm() {
))} ))}
</Select> </Select>
<Box width="2" /> <Box width="2" />
<Button type="submit" size="xs"> <Button type="submit" size="xs" isDisabled={minAssetId == null}>
Preview Preview
</Button> </Button>
</Flex> </Flex>