parent
8f84ae5a51
commit
ef44c19e8a
|
@ -126,6 +126,7 @@
|
|||
import { htmlToPlainText } from '../../_utils/htmlToPlainText'
|
||||
import { measureText } from '../../_utils/measureText'
|
||||
import { LONG_POST_LENGTH, LONG_POST_TEXT } from '../../_static/statuses'
|
||||
import { absoluteDateFormatter } from '../../_utils/formatters'
|
||||
|
||||
const INPUT_TAGS = new Set(['a', 'button', 'input', 'textarea'])
|
||||
const isUserInputElement = node => INPUT_TAGS.has(node.localName)
|
||||
|
@ -241,6 +242,7 @@
|
|||
return getAccountAccessibleName(originalAccount, $omitEmojiInDisplayNames)
|
||||
},
|
||||
createdAtDate: ({ originalStatus }) => originalStatus.created_at,
|
||||
absoluteFormattedDate: ({ createdAtDate }) => absoluteDateFormatter.format(new Date(createdAtDate)),
|
||||
timeagoFormattedDate: ({ createdAtDate }) => formatTimeagoDate(createdAtDate),
|
||||
reblog: ({ status }) => status.reblog,
|
||||
ariaLabel: ({ originalAccount, account, plainTextContent, timeagoFormattedDate, spoilerText,
|
||||
|
@ -267,7 +269,7 @@
|
|||
account, accountId, uuid, isStatusInNotification, isStatusInOwnThread,
|
||||
originalAccount, originalAccountId, spoilerShown, visibility, replyShown,
|
||||
replyVisibility, spoilerText, originalStatus, originalStatusId, inReplyToId,
|
||||
createdAtDate, timeagoFormattedDate, shortcutScope }) => ({
|
||||
createdAtDate, timeagoFormattedDate, shortcutScope, absoluteFormattedDate }) => ({
|
||||
notification,
|
||||
notificationId,
|
||||
status,
|
||||
|
@ -290,7 +292,8 @@
|
|||
inReplyToId,
|
||||
createdAtDate,
|
||||
timeagoFormattedDate,
|
||||
shortcutScope
|
||||
shortcutScope,
|
||||
absoluteFormattedDate
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,9 +2,11 @@
|
|||
<ExternalLink className="status-absolute-date"
|
||||
href={originalStatus.url}
|
||||
showIcon={true}
|
||||
ariaLabel="{formattedDate} (opens in new window)"
|
||||
ariaLabel="{displayAbsoluteFormattedDate} (opens in new window)"
|
||||
>
|
||||
<time datetime={createdAtDate} title={formattedDate}>{formattedDate}</time>
|
||||
<time datetime={createdAtDate} title={absoluteFormattedDate}>
|
||||
{displayAbsoluteFormattedDate}
|
||||
</time>
|
||||
</ExternalLink>
|
||||
{#if applicationName}
|
||||
{#if applicationWebsite}
|
||||
|
@ -132,7 +134,7 @@
|
|||
<script>
|
||||
import ExternalLink from '../ExternalLink.html'
|
||||
import { store } from '../../_store/store'
|
||||
import { getDateFormatter, getShortDateFormatter } from '../../_utils/formatters'
|
||||
import { absoluteDateFormatter, shortAbsoluteDateFormatter } from '../../_utils/formatters'
|
||||
import { on } from '../../_utils/eventBus'
|
||||
|
||||
export default {
|
||||
|
@ -170,10 +172,9 @@
|
|||
}
|
||||
return originalStatus.favourites_count || 0
|
||||
},
|
||||
formattedDate: ({ createdAtDate, $isMobileSize }) => {
|
||||
let formatter = $isMobileSize ? getShortDateFormatter() : getDateFormatter()
|
||||
return formatter.format(new Date(createdAtDate))
|
||||
},
|
||||
displayAbsoluteFormattedDate: ({ createdAtDate, $isMobileSize }) => (
|
||||
$isMobileSize ? shortAbsoluteDateFormatter : absoluteDateFormatter).format(new Date(createdAtDate)
|
||||
),
|
||||
reblogsLabel: ({ numReblogs }) => {
|
||||
// TODO: intl
|
||||
return numReblogs === 1
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
href="/statuses/{originalStatusId}"
|
||||
focus-key={focusKey}
|
||||
>
|
||||
<time datetime={createdAtDate} title={timeagoFormattedDate}
|
||||
<time datetime={createdAtDate} title={absoluteFormattedDate}
|
||||
aria-label="{timeagoFormattedDate} – click to show thread">
|
||||
{timeagoFormattedDate}
|
||||
</time>
|
||||
|
|
|
@ -1,29 +1,15 @@
|
|||
let dateFormatter
|
||||
export const absoluteDateFormatter = new Intl.DateTimeFormat('en-US', {
|
||||
year: 'numeric',
|
||||
month: 'long',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})
|
||||
|
||||
export function getDateFormatter () {
|
||||
if (!dateFormatter) {
|
||||
dateFormatter = new Intl.DateTimeFormat('en-US', {
|
||||
year: 'numeric',
|
||||
month: 'long',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})
|
||||
}
|
||||
return dateFormatter
|
||||
}
|
||||
|
||||
let shortDateFormatter
|
||||
|
||||
export function getShortDateFormatter () {
|
||||
if (!shortDateFormatter) {
|
||||
shortDateFormatter = new Intl.DateTimeFormat('en-US', {
|
||||
year: 'numeric',
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})
|
||||
}
|
||||
return shortDateFormatter
|
||||
}
|
||||
export const shortAbsoluteDateFormatter = new Intl.DateTimeFormat('en-US', {
|
||||
year: 'numeric',
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})
|
||||
|
|
Loading…
Reference in New Issue