| | |
| | | import { Droppable } from '@hello-pangea/dnd'; |
| | | import { Box, Stack, Typography } from '@mui/material'; |
| | | |
| | | import { Deal } from '../types'; |
| | | import { DealCard } from './MissionCard'; |
| | | import { useConfigurationContext } from '../root/ConfigurationContext'; |
| | | import { findDealLabel } from './deal'; |
| | | import { MissionCard } from './MissionCard'; |
| | | |
| | | export const MissionColumn = ({ stage, deals, }) => { |
| | | const totalAmount = deals.reduce((sum, deal) => sum + deal.amount, 0); |
| | | export const MissionColumn = ({ stage, missions, }) => { |
| | | |
| | | const { dealStages } = useConfigurationContext(); |
| | | return ( |
| | | <Box |
| | | sx={{ |
| | |
| | | > |
| | | <Stack alignItems="center"> |
| | | <Typography variant="subtitle1"> |
| | | {findDealLabel(dealStages, stage)} |
| | | 1 |
| | | {/* {findDealLabel(dealStages, stage)} */} |
| | | </Typography> |
| | | <Typography |
| | | variant="subtitle1" |
| | | color="text.secondary" |
| | | fontSize="small" |
| | | > |
| | | {totalAmount.toLocaleString('en-US', { |
| | | notation: 'compact', |
| | | style: 'currency', |
| | | currency: 'USD', |
| | | currencyDisplay: 'narrowSymbol', |
| | | minimumSignificantDigits: 3, |
| | | })} |
| | | 2 |
| | | </Typography> |
| | | </Stack> |
| | | <Droppable droppableId={stage}> |
| | |
| | | }, |
| | | }} |
| | | > |
| | | {deals.map((deal, index) => ( |
| | | <DealCard key={deal.id} deal={deal} index={index} /> |
| | | {missions.map((mission, idx) => ( |
| | | <MissionCard key={mission.id} mission={mission} index={idx} /> |
| | | ))} |
| | | {droppableProvided.placeholder} |
| | | </Box> |