Helpers

The React Native OpenWeb SDK provides extensive control over non-UI-related features through the OpenWeb.manager.helpers:

  • Use Conversation Counters for real-time insights on replies and comments
  • Define the UI language with various options through the OWLanguageStrategy
  • Adapt your app dates and numbers formats with options through the OWLocaleStrategy

Conversation Counters

To show your users the engagement levels of specific Conversations, you can display the number of user comments that have been posted to all requested conversations.

By referencing the post IDs you can add the user comment counts for those Conversations.

import { OpenWeb } from 'react-native-openweb-sdk';

...

const postIds = ["firstId", "secondId"];
const counters = await OpenWeb.manager.helpers.getConversationCounters(postIds);

for (const postId of postIds) {                                                                      
    const counter = counters[postId];                                                                
    const repliesNum = counter.replies;                                                              
    const commentsNum = counter.comments;                                                             
    // Update your UI / Do the work you need
}

Setting Description

result OWConversationCountersResult

Map Post ID to it's counversation counters



See: OWConversationCountersResult


Language

With multiple-language support, OWLanguageStrategy allows you to set the language of the user interface for your audience.

// Set Language Strategy

const languageStrategy = { type: OWLanguageStrategyType.UseServerConfig };
OpenWeb.manager.helpers.setLanguageStrategy(languageStrategy);

// Get Language Strategy
const languageStrategy: OWLanguageStrategy = OpenWeb.manager.helpers.getLanguageStrategy();
Setting Description

languageStrategy OWLanguageStrategy

Defines the language of the user interface



See: OWLanguageStrategy


Locale

Ensuring that dates and numbers appear in familiar formats based on user preferences or device settings enhances the user experience. The OWLocaleStrategy enables you to set these preferences for your users.


// Set Locale Strategy

const localeStrategy = { type: OWLocaleStrategyType.UseServerConfig };
OpenWeb.manager.helpers.setLocaleStrategy(localeStrategy);

// Get Locale Strategy
const localeStrategy: OWLocaleStrategy = OpenWeb.manager.helpers.getLocaleStrategy();
Setting Description

localeStrategy OWLocaleStrategy

Defines the locale which will be used for dates and numbers formats



See: OWLocaleStrategy

Type Definition

OWConversationCountersResult

export interface OWConversationCounter {
  comments: number;
  replies: number;
}

export type OWConversationCountersResult = Record<
  string,
  OWConversationCounter
>;

OWLanguageStrategy

export const OWLanguageStrategyType = {
  UseDevice: 'useDevice',
  UseServerConfig: 'useServerConfig',
  Custom: 'custom',
} as const;

export type OWLanguageStrategy =
  | { type: typeof OWLanguageStrategyType.UseDevice }
  | { type: typeof OWLanguageStrategyType.UseServerConfig }
  | {
      type: typeof OWLanguageStrategyType.Custom;
      language: OWSupportedLanguage;
    };
Setting Description
OWLanguageStrategyType.UseDevice

(Default) Uses the language defined on the user device

OWLanguageStrategyType.UseServerConfig Uses the language defined in the Admin Panel
OWLanguageStrategyType.Custom

Permits defining the language of the user interface

OWLocaleStrategy

export const OWLocaleStrategyType = {
  UseDevice: 'useDevice',
  UseServerConfig: 'useServerConfig',
} as const;

export type OWLocaleStrategy =
  | { type: typeof OWLocaleStrategyType.UseDevice }
  | { type: typeof OWLocaleStrategyType.UseServerConfig };
Setting Description
OWLocaleStrategyType.UseDevice (Default) Uses the locale defined on the user device
OWLocaleStrategyType.UseServerConfig

Uses the local defined in the Admin Panel, dictated by the language in the Admin Panel

OWSupportedLanguage

export const OWSupportedLanguage = {
  English: 'English',
  Arabic: 'Arabic',
  Dutch: 'Dutch',
  French: 'French',
  German: 'German',
  Hebrew: 'Hebrew',
  Hungarian: 'Hungarian',
  Indonesian: 'Indonesian',
  Italian: 'Italian',
  Japanese: 'Japanese',
  Korean: 'Korean',
  Portuguese: 'Portuguese',
  PortugueseBrazil: 'PortugueseBrazil',
  PortuguesePortugal: 'PortuguesePortugal',
  Spanish: 'Spanish',
  Thai: 'Thai',
  Turkish: 'Turkish',
  Vietnamese: 'Vietnamese',
} as const;