Skip to content

Commit 79e23a9

Browse files
committed
automatically provide localised Date for SSR in RelativeTime
1 parent 4b823ff commit 79e23a9

File tree

1 file changed

+13
-2
lines changed

1 file changed

+13
-2
lines changed
Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,19 @@
1+
import React from 'react'
12
import {RelativeTimeElement} from '@github/relative-time-element'
23
import type {ComponentProps} from '../utils/types'
34
import {createComponent} from '../utils/custom-element'
45

5-
const RelativeTime = createComponent(RelativeTimeElement, 'relative-time')
6+
const RelativeTimeComponent = createComponent(RelativeTimeElement, 'relative-time')
7+
8+
export type RelativeTimeProps = ComponentProps<typeof RelativeTimeComponent>
9+
10+
const localeOptions: Intl.DateTimeFormatOptions = {month: 'short', day: 'numeric', year: 'numeric'}
11+
function RelativeTime({date, ...props}: RelativeTimeProps) {
12+
return (
13+
<RelativeTimeComponent {...props} date={date}>
14+
${date?.toLocaleDateString('en', localeOptions) || ''}
15+
</RelativeTimeComponent>
16+
)
17+
}
618

7-
export type RelativeTimeProps = ComponentProps<typeof RelativeTime>
819
export default RelativeTime

0 commit comments

Comments
 (0)