Fix header

This commit is contained in:
dominik-zeglen 2019-11-12 13:27:40 +01:00
parent 4ab886a7ca
commit 0dfe0de548

View file

@ -3,21 +3,15 @@ import CardContent from "@material-ui/core/CardContent";
import { makeStyles } from "@material-ui/core/styles";
import TextField from "@material-ui/core/TextField";
import Typography from "@material-ui/core/Typography";
import moment from "moment-timezone";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
import CardTitle from "@saleor/components/CardTitle";
import Grid from "@saleor/components/Grid";
import Hr from "@saleor/components/Hr";
import Skeleton from "@saleor/components/Skeleton";
import { commonMessages } from "@saleor/intl";
import { CustomerDetails_user } from "../../types/CustomerDetails";
const useStyles = makeStyles(theme => ({
cardTitle: {
height: 64
},
content: {
paddingTop: theme.spacing(2)
},
@ -29,8 +23,7 @@ const useStyles = makeStyles(theme => ({
}
}));
export interface CustomerDetailsProps {
customer: CustomerDetails_user;
export interface CustomerInfoProps {
data: {
firstName: string;
lastName: string;
@ -45,8 +38,8 @@ export interface CustomerDetailsProps {
onChange: (event: React.ChangeEvent<any>) => void;
}
const CustomerDetails: React.FC<CustomerDetailsProps> = props => {
const { customer, data, disabled, errors, onChange } = props;
const CustomerInfo: React.FC<CustomerInfoProps> = props => {
const { data, disabled, errors, onChange } = props;
const classes = useStyles(props);
const intl = useIntl();
@ -54,24 +47,11 @@ const CustomerDetails: React.FC<CustomerDetailsProps> = props => {
return (
<Card>
<CardTitle
className={classes.cardTitle}
title={
<>
<FormattedMessage {...commonMessages.generalInformations} />
{customer && customer.dateJoined ? (
<Typography variant="caption" component="div">
<FormattedMessage
defaultMessage="Customer since: {date}"
description="section subheader"
values={{
date: moment(customer.dateJoined).format("MMM YYYY")
}}
defaultMessage="Personal Informations"
description="customer informations, header"
/>
</Typography>
) : (
<Skeleton style={{ width: "10rem" }} />
)}
</>
}
/>
<CardContent className={classes.content}>
@ -124,5 +104,5 @@ const CustomerDetails: React.FC<CustomerDetailsProps> = props => {
</Card>
);
};
CustomerDetails.displayName = "CustomerDetails";
export default CustomerDetails;
CustomerInfo.displayName = "CustomerInfo";
export default CustomerInfo;