24 lines
558 B
JavaScript
24 lines
558 B
JavaScript
import { Box } from '../../components';
|
|
|
|
export const BeakerContents = props => {
|
|
const { beakerLoaded, beakerContents } = props;
|
|
return (
|
|
<Box>
|
|
{!beakerLoaded && (
|
|
<Box color="label">
|
|
No beaker loaded.
|
|
</Box>
|
|
) || beakerContents.length === 0 && (
|
|
<Box color="label">
|
|
Beaker is empty.
|
|
</Box>
|
|
)}
|
|
{beakerContents.map(chemical => (
|
|
<Box key={chemical.name} color="label">
|
|
{chemical.volume} units of {chemical.name}
|
|
</Box>
|
|
))}
|
|
</Box>
|
|
);
|
|
};
|