Skip to content

Commit

Permalink
docs: apply suggestions from code review
Browse files Browse the repository at this point in the history
Co-authored-by: Anton Arnautov <[email protected]>
  • Loading branch information
MartinCupela and arnautov-anton authored Jun 14, 2024
1 parent 493c06c commit 0e1d194
Showing 1 changed file with 3 additions and 3 deletions.
6 changes: 3 additions & 3 deletions docusaurus/docs/React/guides/date-time-formatting.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -144,15 +144,15 @@ const CustomMessageTimestamp = (props: MessageTimestampProps) => (
);
```

Now we can apply custom configuration in all the translation JSON files. It could look similar to the following example key-value pair.
Now we can apply custom configuration in all the translation JSON files. It could look similar to the following key-value pair example.

```json
{
"timestamp/SystemMessage": "{{ timestamp | timestampFormatter(format: YYYY) }}"
}
```

Besides overriding the formatting parameters above, we can customize the translation key via `timestampTranslationKey` prop all the above components (`DateSeparator`, `EventComponent`, `MessageTimestamp`).
Besides overriding the formatting parameters above, we can customize the translation key via `timestampTranslationKey` prop in all of the above mentioned components (`DateSeparator`, `EventComponent`, `MessageTimestamp`).

```tsx
import { MessageTimestampProps, MessageTimestamp } from 'stream-chat-react';
Expand All @@ -176,7 +176,7 @@ Let's dissect the example:
- variable `timestamp` is the name of variable which value will be inserted into the string
- value separator `|` signals the separation between the interpolated value and the formatting function name
- `timestampFormatter` is the name of the formatting function that is used to convert the `timestamp` value into desired format
- the `timestampFormatter` is can be passed the same parameters as the React components (`calendar`, `calendarFormats`, `format`) as if the function was called with these values. The values can be simple scalar values as well as objects (note `calendarFormats` should be an object)
- the `timestampFormatter` can be passed the same parameters as the React components (`calendar`, `calendarFormats`, `format`) as if the function was called with these values. The values can be simple scalar values as well as objects (note `calendarFormats` should be an object)

:::note
The described rules follow the formatting rules required by the i18n library used under the hood - `i18next`. You can learn more about the rules in [the formatting section of the `i18next` documentation](https://www.i18next.com/translation-function/formatting#basic-usage).
Expand Down

0 comments on commit 0e1d194

Please sign in to comment.