Skip to content
This repository was archived by the owner on Jun 1, 2022. It is now read-only.

Commit 7f0a37a

Browse files
mojo9492mojo9492
committed
DrawerMenu UserApi
1 parent 0c743a0 commit 7f0a37a

1 file changed

Lines changed: 71 additions & 73 deletions

File tree

‎client/src/Event/EventDetails.tsx‎

Lines changed: 71 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -12,82 +12,80 @@ interface EventDetailsProps {
1212
tsrEvent: TsrEvent;
1313
}
1414

15-
export const EventDetails = React.memo(
16-
({ tsrEvent }: EventDetailsProps): ReactElement => {
17-
const startEndDate = (startDate: Moment, endDate: Moment): ReactElement => {
18-
if (startDate.isSame(endDate)) {
19-
return <DetailRow label="Date" description={longDateFormat(startDate)} />;
20-
} else {
21-
return (
22-
<>
23-
<DetailRow label="Start Date" description={longDateFormat(startDate)} />
24-
<DetailRow label="End Date" description={longDateFormat(endDate)} />
25-
</>
26-
);
27-
}
28-
};
15+
export const EventDetails = React.memo(({ tsrEvent }: EventDetailsProps): ReactElement => {
16+
const startEndDate = (startDate: Moment, endDate: Moment): ReactElement => {
17+
if (startDate.isSame(endDate)) {
18+
return <DetailRow label="Date" description={longDateFormat(startDate)} />;
19+
} else {
20+
return (
21+
<>
22+
<DetailRow label="Start Date" description={longDateFormat(startDate)} />
23+
<DetailRow label="End Date" description={longDateFormat(endDate)} />
24+
</>
25+
);
26+
}
27+
};
2928

30-
const longDateFormat = (date: Moment): string =>
31-
`${date.local().format(LONG_DATE_TIME_FORMAT)} (${userTimeZone()})`;
29+
const longDateFormat = (date: Moment): string =>
30+
`${date.local().format(LONG_DATE_TIME_FORMAT)} (${userTimeZone()})`;
3231

33-
const dateLastModifiedFormat = (dateLastModified: Moment): string => {
34-
const diffMoment = moment.duration(currentTimeUtc().diff(dateLastModified));
35-
let numOfTime = 0;
36-
let unitOfTime = "";
37-
if (diffMoment.days() >= 7) {
38-
return dateLastModified.format(SHORT_DATE_FORMAT);
39-
} else if (diffMoment.days() > 0) {
40-
numOfTime = diffMoment.days();
41-
unitOfTime = "day";
42-
} else if (diffMoment.hours() > 0) {
43-
numOfTime = diffMoment.hours();
44-
unitOfTime = "hour";
45-
} else if (diffMoment.minutes() > 5) {
46-
numOfTime = diffMoment.minutes();
47-
unitOfTime = "minute";
48-
} else {
49-
return "just now...";
50-
}
51-
if (numOfTime > 1) {
52-
unitOfTime = `${unitOfTime}s`;
53-
}
54-
return `${numOfTime} ${unitOfTime} ago`;
55-
};
32+
const dateLastModifiedFormat = (dateLastModified: Moment): string => {
33+
const diffMoment = moment.duration(currentTimeUtc().diff(dateLastModified));
34+
let numOfTime = 0;
35+
let unitOfTime = "";
36+
if (diffMoment.days() >= 7) {
37+
return dateLastModified.format(SHORT_DATE_FORMAT);
38+
} else if (diffMoment.days() > 0) {
39+
numOfTime = diffMoment.days();
40+
unitOfTime = "day";
41+
} else if (diffMoment.hours() > 0) {
42+
numOfTime = diffMoment.hours();
43+
unitOfTime = "hour";
44+
} else if (diffMoment.minutes() > 5) {
45+
numOfTime = diffMoment.minutes();
46+
unitOfTime = "minute";
47+
} else {
48+
return "just now...";
49+
}
50+
if (numOfTime > 1) {
51+
unitOfTime = `${unitOfTime}s`;
52+
}
53+
return `${numOfTime} ${unitOfTime} ago`;
54+
};
5655

57-
const mapOrganizations = () => {
58-
const orgArray = tsrEvent.organizations.map((org) => org.organizationDisplayName);
59-
return orgArray.join("; ");
60-
};
56+
const mapOrganizations = () => {
57+
const orgArray = tsrEvent.organizations.map((org) => org.organizationDisplayName);
58+
return orgArray.join("; ");
59+
};
6160

62-
return (
63-
<>
64-
<DetailRow
65-
label="Event Type"
66-
description={
67-
tsrEvent.eventType
68-
? tsrEvent.eventType.displayName.charAt(0).toUpperCase() +
69-
tsrEvent.eventType.displayName.slice(1)
70-
: "No Event Type"
71-
}
72-
/>
73-
{startEndDate(moment.utc(tsrEvent.startDate), moment.utc(tsrEvent.endDate))}
74-
<DetailRow label="Organization" description={mapOrganizations()} />
75-
<DetailRow
76-
label="Event Created By"
77-
description={`${tsrEvent.audit.createdByDisplayName}, (${moment
78-
.utc(tsrEvent.audit.createdDate)
79-
.local()
80-
.format(SHORT_DATE_FORMAT)})`}
81-
/>
82-
<DetailRow
83-
label="Last Modified By"
84-
description={`${
85-
tsrEvent.audit.lastModifiedByDisplayName
86-
}, ${dateLastModifiedFormat(moment(tsrEvent.audit.lastModifiedDate))}`}
87-
/>
88-
</>
89-
);
90-
},
91-
);
61+
return (
62+
<>
63+
<DetailRow
64+
label="Event Type"
65+
description={
66+
tsrEvent.eventType
67+
? tsrEvent.eventType.displayName.charAt(0).toUpperCase() +
68+
tsrEvent.eventType.displayName.slice(1)
69+
: "No Event Type"
70+
}
71+
/>
72+
{startEndDate(moment.utc(tsrEvent.startDate), moment.utc(tsrEvent.endDate))}
73+
<DetailRow label="Organization" description={mapOrganizations()} />
74+
<DetailRow
75+
label="Event Created By"
76+
description={`${tsrEvent.audit.createdByDisplayName}, (${moment
77+
.utc(tsrEvent.audit.createdDate)
78+
.local()
79+
.format(SHORT_DATE_FORMAT)})`}
80+
/>
81+
<DetailRow
82+
label="Last Modified By"
83+
description={`${tsrEvent.audit.lastModifiedByDisplayName}, ${dateLastModifiedFormat(
84+
moment(tsrEvent.audit.lastModifiedDate),
85+
)}`}
86+
/>
87+
</>
88+
);
89+
});
9290

9391
EventDetails.displayName = "EventDetails";

0 commit comments

Comments
 (0)