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;