Options

Additional key-value options can be passed to the InAppStory SDK for targeting, regional segmentation, or configuring specific features (such as point of sale).

Description

options is represented as a Record<string, string>, where each key corresponds to an option name and each value is the assigned string value.

Currently, the SDK provides pos (Point of Sale) as a standard option key:

type Options = {
    pos?: string;
} & Record<string, string>;

If necessary, you can set your own key-value pairs:

const options = {
    pos: 'store_ny_01',
    region: 'north_america',
    custom_key: 'custom_value',
};

Setting options at initialization

Pass options inside StoryManagerConfig when creating the StoryManager instance:

import {StoryManager} from '@inappstory/react-native-sdk';

export const storyManager = await StoryManager.create({
    apiKey: '<your-api-key>',
    userId: '<user-id>',
    options: {
        pos: 'store_ny_01',
        region: 'north_america',
    },
});

tip

It is recommended to set options during SDK initialization or before opening any reader / rendering a story list for the first time.

Updating options at runtime

You can update options at any time using storyManager.setOptions(...):

storyManager.setOptions({
    pos: 'store_la_02',
    region: 'west_coast',
});

Reloading feeds after changing options

When options change dynamically at runtime (for example, when a user changes their active store or region), reload the visible StoriesList so it fetches stories matching the new options:

import React, {useRef} from 'react';
import {View, Button} from 'react-native';
import {StoriesList, type StoriesListRef} from '@inappstory/react-native-sdk';
import {storyManager, appearanceManager} from './StoryService';

export const StoryFeedScreen = () => {
    const storiesListRef = useRef<StoriesListRef>(null);

    const handleStoreChange = (newStoreId: string) => {
        storyManager.setOptions({
            pos: newStoreId,
        });

        // Reload the feed to apply new options
        storiesListRef.current?.reload();
    };

    return (
        <View>
            <Button title="Switch to LA Store" onPress={() => handleStoreChange('store_la_02')}/>
            <StoriesList
                ref={storiesListRef}
                feed="default"
                storyManager={storyManager}
                appearanceManager={appearanceManager}
            />
        </View>
    );
};