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.
46 lines
1.3 KiB
46 lines
1.3 KiB
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> |
|
); |
|
}
|
|
|