73 lines
1.6 KiB
TypeScript
73 lines
1.6 KiB
TypeScript
import React from 'react';
|
|
import { view } from 'react-easy-state';
|
|
import { Link } from 'react-router-dom';
|
|
import { Icon } from 'antd';
|
|
import { RouteComponentProps, withRouter } from 'react-router';
|
|
import store from 'src/store';
|
|
import Example from './Example';
|
|
import EMAILS from './emails';
|
|
import './index.less';
|
|
|
|
type Props = RouteComponentProps<any>;
|
|
|
|
interface State {
|
|
examples: any;
|
|
}
|
|
|
|
class Emails extends React.Component<Props, State> {
|
|
state: State = {
|
|
examples: {},
|
|
};
|
|
|
|
componentDidMount() {
|
|
const { type } = this.props.match.params;
|
|
if (type && !store.emailExamples[type]) {
|
|
store.getEmailExample(type);
|
|
}
|
|
}
|
|
|
|
componentDidUpdate(prevProps: Props) {
|
|
const { type } = this.props.match.params;
|
|
const prevType = prevProps.match.params.type;
|
|
if (type && type !== prevType && !store.emailExamples[type]) {
|
|
store.getEmailExample(type);
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const { type } = this.props.match.params;
|
|
|
|
let content;
|
|
if (type) {
|
|
content = <Example email={store.emailExamples[type]} />;
|
|
} else {
|
|
content = EMAILS.map(e => (
|
|
<Link key={e.id} to={`/emails/${e.id}`}>
|
|
<div className="Emails-email">
|
|
<h2>
|
|
{e.title} <small>({e.id})</small>
|
|
</h2>
|
|
<p>{e.description}</p>
|
|
</div>
|
|
</Link>
|
|
));
|
|
}
|
|
|
|
return (
|
|
<div className="Emails">
|
|
<h1>
|
|
{type && (
|
|
<Link to="/emails">
|
|
<Icon type="arrow-left" />
|
|
</Link>
|
|
)}
|
|
Emails
|
|
</h1>
|
|
{content}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default withRouter(view(Emails));
|