Skip to content

Instantly share code, notes, and snippets.

@dhamaniasad
Created August 29, 2019 23:18
Show Gist options
  • Save dhamaniasad/a110786a6b1984830a87b5c916aa6271 to your computer and use it in GitHub Desktop.
Save dhamaniasad/a110786a6b1984830a87b5c916aa6271 to your computer and use it in GitHub Desktop.
import React from 'react';
import {Typography, makeStyles, createStyles} from '@material-ui/core';
import {StatusUpdates,
Body
} from 'mock-data-service/types/OrderStatusContent';
export interface OrderStatusDescriptionProps {
currentStatus: string;
content: StatusUpdates;
}
// const orderStatusMapping: {[key: string]: keyof Body | undefined} = {
// 'ORDER RECEIVED': 'receivedFromPatient',
// 'PHARMACIST IS REVIEWING': 'pharmacistReviewing',
// 'PREPARING FOR SHIPMENT': 'filling',
// 'ORDER SHIPPED': 'shippedNoTracking',
// 'ORDER IS IN TRANSIT': 'shippedNoTracking',
// 'ORDER DELIVERED': 'shippedNoTracking'
// };
// const getOrderStatusMapping = (key: string): keyof Body | undefined => {
// if (key) {
// return orderStatusMapping[key];
// }
// return;
// };
const useStyles = makeStyles(() =>
createStyles({
statusUpdate: {
display: 'flex',
marginBottom: '20px',
maxWidth: '35.625rem',
padding: '20px',
paddingLeft: '30px'
},
orderStatusHeading: {
marginBottom: '10px'
},
orderStatusBody: {
paddingBottom: '20px'
}
})
);
export const OrderStatusDescription: React.FC<OrderStatusDescriptionProps> = ({currentStatus, content}) => {
const classes = useStyles();
const orderStatusMapping2: {[key: string]: string} = {
'ORDER RECEIVED': content.body.receivedFromPatient,
'PHARMACIST IS REVIEWING': content.body.pharmacistReviewing,
'PREPARING FOR SHIPMENT': content.body.filling,
'ORDER SHIPPED': content.body.shippedNoTracking,
'ORDER IS IN TRANSIT': content.body.shippedNoTracking,
'ORDER DELIVERED': content.body.shippedNoTracking
};
const orderStatusContentKey = orderStatusMapping2[currentStatus];
let description = '';
if (orderStatusContentKey as keyof Body) {
description = content.body[orderStatusContentKey];
}
return (
<div className={classes.statusUpdate}>
<div>
<Typography variant="h4" gutterBottom className={classes.orderStatusHeading}>
{currentStatus}
</Typography>
<Typography variant="body1" className={classes.orderStatusBody}>
{description}
</Typography>
</div>
</div>
);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment