import { Component } from "inferno";
import moment from "moment";
import { i18n } from "../../i18next";
-import { capitalizeFirstLetter, getLanguages } from "../../utils";
+import { capitalizeFirstLetter } from "../../utils";
import { Icon } from "./icon";
interface MomentTimeProps {
- data: {
- published?: string;
- when_?: string;
- updated?: string;
- };
+ published: string;
+ updated?: string;
showAgo?: boolean;
ignoreUpdated?: boolean;
}
constructor(props: any, context: any) {
super(props, context);
- let lang = getLanguages();
-
- moment.locale(lang);
+ moment.locale([...i18n.languages]);
}
createdAndModifiedTimes() {
- let created = this.props.data.published || this.props.data.when_;
- return `
- <div>
- <div>
- ${capitalizeFirstLetter(i18n.t("created"))}: ${this.format(created)}
- </div>
- <div>
- ${capitalizeFirstLetter(i18n.t("modified"))} ${this.format(
- this.props.data.updated
- )}
- </div>
- </div>`;
+ const updated = this.props.updated;
+ let line = `${capitalizeFirstLetter(i18n.t("created"))}: ${this.format(
+ this.props.published
+ )}`;
+ if (updated) {
+ line += `\n\n\n${capitalizeFirstLetter(i18n.t("modified"))} ${this.format(
+ updated
+ )}`;
+ }
+ return line;
}
render() {
- if (!this.props.ignoreUpdated && this.props.data.updated) {
+ if (!this.props.ignoreUpdated && this.props.updated) {
return (
<span
data-tippy-content={this.createdAndModifiedTimes()}
- data-tippy-allowHtml={true}
- className="font-italics pointer unselectable"
+ className="moment-time font-italics pointer unselectable"
>
- <Icon icon="edit-2" classes="icon-inline mr-1" />
- {moment.utc(this.props.data.updated).fromNow(!this.props.showAgo)}
+ <Icon icon="edit-2" classes="icon-inline me-1" />
+ {moment.utc(this.props.updated).fromNow(!this.props.showAgo)}
</span>
);
} else {
- let created = this.props.data.published || this.props.data.when_;
+ const published = this.props.published;
return (
<span
- className="pointer unselectable"
- data-tippy-content={this.format(created)}
+ className="moment-time pointer unselectable"
+ data-tippy-content={this.format(published)}
>
- {moment.utc(created).fromNow(!this.props.showAgo)}
+ {moment.utc(published).fromNow(!this.props.showAgo)}
</span>
);
}