Skip to content

Commit

Permalink
chore: resolve conflicts from develop
Browse files Browse the repository at this point in the history
  • Loading branch information
khushal87 committed Aug 20, 2024
2 parents 3a13460 + 2df1b4d commit 2f541da
Show file tree
Hide file tree
Showing 2 changed files with 9 additions and 7 deletions.
4 changes: 3 additions & 1 deletion .styles/Vocab/Base/accept.txt
Original file line number Diff line number Diff line change
Expand Up @@ -40,4 +40,6 @@ virtualized
rncli
RNCLI
CDNs
haptics
haptics
async
Podfile
12 changes: 6 additions & 6 deletions docusaurus/docs/reactnative/guides/date-time-formatting.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ In this guide we will learn how date a time formatting can be customized within

## SDK components displaying date & time

The following components provided by the SDK display datetime:
The following components provided by the SDK display date time:

- `ChannelPreviewStatus` - Component showing last message date and time in `ChannelList`.
- `ImageGalleryHeader` - Component showing the header in the `ImageGallery`.
Expand All @@ -19,7 +19,7 @@ The following components provided by the SDK display datetime:

## Format Customization

The datetime format can be customized by providing date format through the `i18n` JSON.
The date time format can be customized by providing date format through the `i18n` JSON.

### Date & time formatting with i18n service

Expand All @@ -31,7 +31,7 @@ Formatting via i18n service allows for SDK wide configuration. The configuration
- Allows for high re-usability - apply the same configuration in multiple places via the same translation key.
- Allows for custom formatting logic.

The default datetime formatting configuration is stored in the JSON translation files. The default translation keys are namespaced with prefix `timestamp/` followed by the component name. For example, the message date formatting can be targeted via `timestamp/MessageTimestamp`, because the underlying component is called `MessageTimestamp`.
The default date time formatting configuration is stored in the JSON translation files. The default translation keys are namespaced with prefix `timestamp/` followed by the component name. For example, the message date formatting can be targeted via `timestamp/MessageTimestamp`, because the underlying component is called `MessageTimestamp`.

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

Expand Down Expand Up @@ -79,11 +79,11 @@ Let's dissect the example:

**Params**:

- `calendar` - This is a boolean field to decide if the date format should be in calendar format or not. The default value is `false`.
- `calendar` - This is a `Boolean` field to decide if the date format should be in calendar format or not. The default value is `false`.
- `calendarFormats` - This is an object that contains the formats for the calendar. The default value is `{ sameDay: 'LT', nextDay: 'LT', nextWeek: 'dddd', lastDay: 'dddd', lastWeek: 'dddd', sameElse: 'L' }`.
- `format` - This is a string that contains the format of the date.

If calendar formatting is enabled, the dates are formatted with time-relative words ("yesterday at ...", "last ..."). The calendar strings can be further customized with `calendarFormats` object. The `calendarFormats` object has to cover all the formatting cases as shows the example below:
If calendar formatting is enabled, the dates are formatted with time-relative words (`"yesterday at ..."`, `"last ..."`). The calendar strings can be further customized with `calendarFormats` object. The `calendarFormats` object has to cover all the formatting cases as shows the example below:

```js
{
Expand All @@ -106,7 +106,7 @@ If `calendar` formatting is enabled, the `format` prop would be ignored. So to a
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).
:::

### Custom datetime formatter functions
### Custom date time formatter functions

Besides overriding the configuration parameters, we can override the default `timestampFormatter` function by providing custom `Streami18n` instance:

Expand Down

0 comments on commit 2f541da

Please sign in to comment.