www-new/components/EventSetting.tsx

36 lines
849 B
TypeScript

import React from "react";
import styles from "./EventSetting.module.css";
interface Props {
date: Date;
online: boolean;
location: string;
}
export function EventSetting(props: Props) {
const date = props.date.toLocaleDateString("en-US", {
day: "numeric",
month: "long",
year: "numeric",
});
const time = props.date.toLocaleTimeString("en-US", {
hour: "numeric",
minute: "numeric",
timeZoneName: "short",
});
const location = props.online ? `Online - ${props.location}` : props.location;
const separator = <span className={styles.separator}> | </span>;
return (
<div>
<time className={styles.setting} dateTime={props.date.toISOString()}>
{date}
</time>
{separator}
<span className={styles.setting}>{time}</span>
{separator}
{location}
</div>
);
}