# General Translation Changelog: gt-react 10.16.0: Localised relative time strings
URL: https://generaltranslation.com/en-GB/blog/gt-react_v10_16_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2026-04-01

## Overview

New [`<RelativeTime>`](/docs/react/reference/components/relative-time) variable component for rendering localised relative time strings like &quot;2 hours ago&quot; or &quot;in 3 days&quot;. Uses [`Intl.RelativeTimeFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat) under the hood.

| Package              | Version |
| -------------------- | ------- |
| `gt-react`           | 10.16.0 |
| `gt-next`            | 6.15.0  |
| `generaltranslation` | 8.2.0   |

## Usage

### Auto-select unit from a Date

Pass a `Date` and the component picks the best unit automatically:

```jsx
import { RelativeTime } from "gt-react";

<RelativeTime>{post.createdAt}</RelativeTime>
// "2 hours ago", "in 3 days", etc.
```


### Explicit value and unit

Specify an exact value and unit, matching the `Intl.RelativeTimeFormat` API:

```jsx
import { RelativeTime } from "gt-react";

<RelativeTime value={3} unit="day" />
// "in 3 days"
```


### Inside translations

Wrap [`<RelativeTime>`](/docs/react/reference/components/relative-time) in [`<T>`](/docs/react/reference/components/t) to include it in translated sentences:

```jsx
import { T, RelativeTime } from "gt-react";

<T id="commentPosted">
  Posted <RelativeTime>{comment.createdAt}</RelativeTime>
</T>
```

## Hydration safety

[`<RelativeTime>`](/docs/react/reference/components/relative-time) computes relative time locally, which can cause hydration mismatches in server-rendered apps. Pin `baseDate` to avoid this:

```jsx
const now = new Date();

<RelativeTime baseDate={now}>{post.createdAt}</RelativeTime>
```

## Core utilities

Two new formatting functions are also available in `generaltranslation`:

* `formatRelativeTimeFromDate(date, options)` — standalone function
* `GT.formatRelativeTimeFromDate(date, options)` — class method

## Links

* [`<RelativeTime>` API reference](/docs/react/reference/components/relative-time)
* [Using variable components](/docs/react/guides/formatting-variables)
* [PR #1153](https://github.com/generaltranslation/gt/pull/1153)

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.