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