You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.3 KiB
47 lines
1.3 KiB
3 years ago
|
import React from "react";
|
||
|
import Layout from "../layouts/Main";
|
||
|
import moment from "moment";
|
||
|
import ClientDetailHeader from "../components/ClientDetailHeader";
|
||
|
|
||
|
export default function Detail(props = { client, user }) {
|
||
|
const timelineComponent = props.client.events
|
||
|
.reverse()
|
||
|
.slice(0, 2)
|
||
|
.map((event) => {
|
||
|
return (
|
||
|
<div className="col-sm-5 my-1">
|
||
|
<div className="card h-100">
|
||
|
<div className="card-body">
|
||
|
<h5 className="card-title text-capitalize">
|
||
|
{event.eventType.replace("_", " ")}
|
||
|
</h5>
|
||
|
<h6 className="card-subtitle mb-2 text-muted">
|
||
|
{moment(event.createdAt).fromNow()}
|
||
|
</h6>
|
||
|
<p className="card-text text-capitalize">
|
||
|
{event.value?.replace("_", " ")}
|
||
|
</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
);
|
||
|
});
|
||
|
return (
|
||
|
<Layout user={props.user}>
|
||
|
<ClientDetailHeader {...props} />
|
||
|
|
||
|
<div className="jumbotron jumbotron-fluid row mt-4 py-1 mx-0">
|
||
|
{timelineComponent}
|
||
|
<div className="col-sm-2 d-flex align-items-center">
|
||
|
<a
|
||
|
className="btn btn-light my-2"
|
||
|
href={`/clients/${props.client._id}/timeline`}
|
||
|
>
|
||
|
View Full Timeline
|
||
|
</a>
|
||
|
</div>
|
||
|
</div>
|
||
|
</Layout>
|
||
|
);
|
||
|
}
|