The Storyteller
can be customized using such props.
interface StorytellerSdkInterface {
isInitialized(callback: (result: Boolean) => void): void;
isPresentingStory(callback: (result: Boolean) => void): void;
customInstanceHost(callback: (result: string) => void): void;
currentUserId(callback: (result: string) => void): void;
currentApiKey(callback: (result: string) => void): void;
version(callback: (result: string) => void): void;
setTheme(theme: Theme): void;
setAdsResult(result: { ads: Array<ClientAd>; error: Error | null }): void;
openDeeplink(url: string, callback: (result: Boolean) => void): void;
openStory(id: string, errorCallback: (error: string) => void): void;
openPage(id: string, errorCallback: (error: string) => void): void;
initialize(
apiKey: string,
externalId: string,
customInstanceHost: string,
categoriesToPreload: Array<string>,
callback: (result: Boolean, message: string) => void
): void;
}
Those attributes reflect static properties from native Storyteller
object.
isInitialized
- check if Storyteller has been successfully initializedisPresentingStory
- check if Story is being presented at the momentcustomInstanceHost
- custom instance hosting APIcurrentUserId
- current user idcurrentApiKey
- current api key set by initialize(apiKey: String, onComplete: () -> Void, onError: (Error) -> Void)
version
- current SDK versionThe appearance of the SDK can be customized by setting the theme
property. For more information please read Theme.
setTheme
- sets default fallback theming style used to render story items in lists and activities launched from list.Ads can be integrated through backend API or by integrating app. When it is done by integrating app user needs to call setAdsResult
. For more information please read Ads.
setAdsResult
- set ads result after receiving callback from delegate method onGetAdsForList
.Deeplinks opened by calling function on Storyteller
object will open just one story independently from list component rendered on app.
openDeeplink
- open deeplink from url.openStory
- open deeplink with story id.openPage
- open deeplink with page id.initialize(apiKey: string, externalId: string, customInstanceHost: string, categoriesToPreload: Array<string>, callback: (result: Boolean, message: string) => void)
The initialize
method is required to be called for Storyteller to work. It's recommended to fire this method as soon as possible in the app lifecycle.
Parameters:
apiKey
- api key provided by Storyteller teamexternalId
- id of the user to be authorizedcustomInstanceHost
- custom instance hosting APIcategoriesToPreload
- list of categories id to be preloaded. If array is empty the default category will be preloaded.callback
- called when initialization has finish with either success or failureA StorytellerDelegate
has methods for managing Storyteller
story events.
To recive events from delegate you need to subscribe following listeners ON_USER_ACTIVITY_OCCURED
, USER_SWIPED_UP_TO_APP
, GET_ADS_FOR_LIST
. You can get those from constants published by Storyteller
object.
import Storyteller from '@getstoryteller/react-native-storyteller-sdk';
const { ON_USER_ACTIVITY_OCCURED, USER_SWIPED_UP_TO_APP, GET_ADS_FOR_LIST } = Storyteller.getConstants();
Then attach listeners to appropriate events:
const storytellerEvt = new NativeEventEmitter(Storyteller);
storytellerEvt.addListener(ON_USER_ACTIVITY_OCCURED, this._onUserActivityOccurred);
storytellerEvt.addListener(USER_SWIPED_UP_TO_APP, this._onUserSwipedUpToApp);
storytellerEvt.addListener(GET_ADS_FOR_LIST, this._onGetAdsForList);
_onUserActivityOccurred = (body: { type: EventType; data: UserActivityData; }) => {
console.log(`ActivityOccurred\n` + `type: ${body.type}, data: ${JSON.stringify(body.data)}`);
};
_onUserSwipedUpToApp = (body: { swipeUpUrl: string }) => {
console.log(`UserSwipedUpToApp\n` + `swipeUpUrl: ${body.swipeUpUrl}`);
};
_onGetAdsForList = (body: { stories: [ClientStory] }) => {
console.log(`GetAdsForList\n` + `stories: ${JSON.stringify(body.stories)}`);
Storyteller.setAdsResult({ ads: [adExample], error: null });
};
You can find more information about Storyteller Delegate
on iOS and Android