react-native-firework-sdk 1.3.1-beta.9 → 1.4.1

package/lib/module/components/VideoFeed.js

@@ -3,11 +3,12 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 import React from 'react';
+import { Platform } from 'react-native';
 import { findNodeHandle, UIManager } from 'react-native';
-import FWLoggerUtil from '../utils/FWLoggerUtil';
 import FireworkSDK from '../FireworkSDK';
 import { FWEventName } from '../models/FWEventName';
 import { FireworkSDKModuleEventEmitter } from '../modules/FireworkSDKModule';
+import FWLoggerUtil from '../utils/FWLoggerUtil';
 import FWVideoFeed from './FWVideoFeed';
 const NativeComponentName = 'FWVideoFeed';
 export default class VideoFeed extends React.Component {
@@ -21,24 +22,39 @@ export default class VideoFeed extends React.Component {
     _defineProperty(this, "refresh", () => {
       FWLoggerUtil.log(`VideoFeed refresh ${JSON.stringify(this.props)}`);
       const nativeNodeHandle = findNodeHandle(this.nativeComponentRef.current);
-      UIManager.dispatchViewManagerCommand(findNodeHandle(nativeNodeHandle), UIManager.getViewManagerConfig(NativeComponentName).Commands.refresh, []);
+      let commandId = UIManager.getViewManagerConfig(NativeComponentName).Commands.refresh;
+
+      if (Platform.OS === 'android') {
+        commandId = commandId.toString();
+      }
+
+      UIManager.dispatchViewManagerCommand(findNodeHandle(nativeNodeHandle), commandId, []);
     });
 
     _defineProperty(this, "_onVideoFeedLoadFinished", event => {
       FWLoggerUtil.log(`VideoFeed _onVideoFeedLoadFinished ${JSON.stringify(event.nativeEvent)}`);
+      const {
+        onVideoFeedLoadFinished
+      } = this.props;
       const {
         name,
         reason
       } = event.nativeEvent;
 
-      if (this.props.onVideoFeedLoadFinished) {
+      if (onVideoFeedLoadFinished) {
         if (name) {
-          this.props.onVideoFeedLoadFinished({
-            name,
-            reason
-          });
+          if (reason) {
+            onVideoFeedLoadFinished({
+              name,
+              reason
+            });
+          } else {
+            onVideoFeedLoadFinished({
+              name
+            });
+          }
         } else {
-          this.props.onVideoFeedLoadFinished();
+          onVideoFeedLoadFinished();
         }
       }
     });
@@ -152,17 +168,16 @@ export default class VideoFeed extends React.Component {
     } = this.props;
 
     if (!videoFeedConfiguration) {
-      return undefined;
+      return videoFeedConfiguration;
     }
 
-    let resultFeedConfiguration = { ...videoFeedConfiguration
-    };
-
-    if (resultFeedConfiguration.gridColumns) {
-      resultFeedConfiguration.gridColumns = Math.floor(resultFeedConfiguration.gridColumns);
+    if (videoFeedConfiguration.gridColumns && Math.floor(videoFeedConfiguration.gridColumns) !== videoFeedConfiguration.gridColumns) {
+      return { ...videoFeedConfiguration,
+        gridColumns: Math.floor(videoFeedConfiguration.gridColumns)
+      };
+    } else {
+      return videoFeedConfiguration;
     }
-
-    return resultFeedConfiguration;
   }
 
 }

package/lib/module/components/VideoFeed.js.map

@@ -1 +1 @@
-{"version":3,"sources":["VideoFeed.tsx"],"names":["React","findNodeHandle","UIManager","FWLoggerUtil","FireworkSDK","FWEventName","FireworkSDKModuleEventEmitter","FWVideoFeed","NativeComponentName","VideoFeed","Component","createRef","log","JSON","stringify","props","nativeNodeHandle","nativeComponentRef","current","dispatchViewManagerCommand","getViewManagerConfig","Commands","refresh","event","nativeEvent","name","reason","onVideoFeedLoadFinished","componentDidMount","subscriptionOfShareBaseURLUpdated","addListener","ShareBaseURLUpdated","setState","subscriptions","push","subscriptionOfAdBadgeConfigurationUpdated","AdBadgeConfigurationUpdated","componentWillUnmount","forEach","value","remove","render","source","channel","playlist","playlistGroup","mode","videoFeedConfiguration","_getVideoFeedConfiguration","titleHidden","title","hidden","titlePosition","customLayoutName","shareBaseURL","getInstance","adBadgeConfiguration","adBadgeTextType","badgeTextType","backgroundColorOfAdBadge","backgroundColor","textColorOfAdBadge","textColor","dynamicContentParametersString","_generateDynamicContentParametersString","enableAutoplay","gridColumns","key","_onVideoFeedLoadFinished","Object","assign","style","zIndex","dynamicContentParameters","resultString","sortedKeyList","keys","sort","valueString","join","length","undefined","resultFeedConfiguration","Math","floor"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type { NativeSyntheticEvent, TargetedEvent } from 'react-native';\nimport {\n  EmitterSubscription,\n  findNodeHandle,\n  StyleProp,\n  UIManager,\n  ViewStyle,\n} from 'react-native';\nimport FWLoggerUtil from '../utils/FWLoggerUtil';\n\nimport FireworkSDK from '../FireworkSDK';\nimport type FWError from '../models/FWError';\nimport { FWEventName } from '../models/FWEventName';\nimport type VideoFeedConfiguration from '../models/VideoFeedConfiguration';\nimport type { VideoFeedSource } from '../models/VideoFeedSource';\nimport type VideoPlayerConfiguration from '../models/VideoPlayerConfiguration';\nimport { FireworkSDKModuleEventEmitter } from '../modules/FireworkSDKModule';\nimport FWVideoFeed from './FWVideoFeed';\n\nexport type VideoFeedMode = 'row' | 'column' | 'grid';\n\nexport interface IVideoFeedProps {\n  /**\n   * Standard React Native View Style.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * One of five available video feed sources.\n   */\n  source: VideoFeedSource;\n  /**\n   * Channel id of the feed. Required when the source is set as channel or playlist or dynamicContent.\n   */\n  channel?: string;\n  /**\n   * Playlist id of the feed. Please note channel id is necessary. Required when the source is set as playlist.\n   */\n  playlist?: string;\n  /**\n   * PlaylistGroup id of the feed. Required when the source is set as playlistGroup.\n   */\n  playlistGroup?: string;\n  /**\n   * The dynamic content parameters of the feed. Required when the source is set as dynamicContent.\n   */\n  dynamicContentParameters?: { [key: string]: string[] };\n  /**\n   * One of three available display modes. Defaults to row.\n   */\n  mode?: VideoFeedMode;\n  /**\n   * Configuration of the feed.\n   */\n  videoFeedConfiguration?: VideoFeedConfiguration;\n  /**\n   * Configuration of the player.\n   */\n  videoPlayerConfiguration?: VideoPlayerConfiguration;\n  /**\n   * The feed loading result callback. It means loading successfully when error equals to undefined.\n   */\n  onVideoFeedLoadFinished?: (error?: FWError) => void;\n}\n\ninterface VideoFeedLoadFinishedEvent extends TargetedEvent {\n  name: string;\n  reason?: string | null;\n}\n\nconst NativeComponentName = 'FWVideoFeed';\n\nexport default class VideoFeed extends React.Component<IVideoFeedProps> {\n  static defaultProps = {\n    mode: 'row',\n  };\n\n  nativeComponentRef = React.createRef<any>();\n\n  subscriptions: EmitterSubscription[] = [];\n\n  /**\n   * Force refreshing the video feed.\n   */\n  public refresh = () => {\n    FWLoggerUtil.log(`VideoFeed refresh ${JSON.stringify(this.props)}`);\n\n    const nativeNodeHandle = findNodeHandle(this.nativeComponentRef.current);\n\n    UIManager.dispatchViewManagerCommand(\n      findNodeHandle(nativeNodeHandle),\n      UIManager.getViewManagerConfig(NativeComponentName).Commands.refresh,\n      []\n    );\n  };\n\n  private _onVideoFeedLoadFinished = (\n    event: NativeSyntheticEvent<VideoFeedLoadFinishedEvent>\n  ) => {\n    FWLoggerUtil.log(\n      `VideoFeed _onVideoFeedLoadFinished ${JSON.stringify(event.nativeEvent)}`\n    );\n\n    const { name, reason } = event.nativeEvent;\n\n    if (this.props.onVideoFeedLoadFinished) {\n      if (name) {\n        this.props.onVideoFeedLoadFinished({ name, reason });\n      } else {\n        this.props.onVideoFeedLoadFinished();\n      }\n    }\n  };\n\n  componentDidMount() {\n    FWLoggerUtil.log(\n      `VideoFeed componentDidMount ${JSON.stringify(this.props)}`\n    );\n\n    const subscriptionOfShareBaseURLUpdated =\n      FireworkSDKModuleEventEmitter.addListener(\n        FWEventName.ShareBaseURLUpdated,\n        () => {\n          FWLoggerUtil.log('Receive FWEventName.ShareBaseURLUpdated');\n          this.setState({});\n        }\n      );\n    this.subscriptions.push(subscriptionOfShareBaseURLUpdated);\n\n    const subscriptionOfAdBadgeConfigurationUpdated =\n      FireworkSDKModuleEventEmitter.addListener(\n        FWEventName.AdBadgeConfigurationUpdated,\n        () => {\n          FWLoggerUtil.log('Receive FWEventName.AdBadgeConfigurationUpdated');\n          this.setState({});\n        }\n      );\n    this.subscriptions.push(subscriptionOfAdBadgeConfigurationUpdated);\n  }\n\n  componentWillUnmount() {\n    FWLoggerUtil.log(\n      `VideoFeed componentWillUnmount ${JSON.stringify(this.props)}`\n    );\n\n    this.subscriptions.forEach((value) => {\n      value.remove();\n    });\n\n    this.subscriptions = [];\n  }\n\n  render() {\n    FWLoggerUtil.log(`VideoFeed render ${JSON.stringify(this.props)}`);\n\n    const {\n      source,\n      channel = '',\n      playlist = '',\n      playlistGroup = '',\n      mode = 'row',\n    } = this.props;\n    const videoFeedConfiguration = this._getVideoFeedConfiguration();\n    const titleHidden = videoFeedConfiguration?.title?.hidden ?? false;\n    const titlePosition = videoFeedConfiguration?.titlePosition ?? 'nested';\n    const customLayoutName = videoFeedConfiguration?.customLayoutName ?? '';\n    const shareBaseURL = FireworkSDK.getInstance().shareBaseURL ?? '';\n    const adBadgeConfiguration =\n      FireworkSDK.getInstance().adBadgeConfiguration ?? {};\n    const adBadgeTextType = adBadgeConfiguration.badgeTextType ?? '';\n    const backgroundColorOfAdBadge = adBadgeConfiguration.backgroundColor ?? '';\n    const textColorOfAdBadge = adBadgeConfiguration.textColor ?? '';\n    const dynamicContentParametersString =\n      this._generateDynamicContentParametersString();\n    const enableAutoplay = videoFeedConfiguration?.enableAutoplay ?? false;\n    const gridColumns = videoFeedConfiguration?.gridColumns ?? 2;\n\n    let key = `source:${source}`;\n    key += `_channel:${channel}`;\n    key += `_playlist:${playlist}`;\n    key += `_playlistGroup:${playlistGroup}`;\n    key += `_mode:${mode}`;\n    key += `_titleHidden:${titleHidden}`;\n    key += `_titlePosition:${titlePosition}`;\n    key += `_customLayoutName:${customLayoutName}`;\n    key += `_shareBaseURL:${shareBaseURL}`;\n    key += `_adBadgeTextType:${adBadgeTextType}`;\n    key += `_backgroundColorOfAdBadge:${backgroundColorOfAdBadge}`;\n    key += `_textColorOfAdBadge:${textColorOfAdBadge}`;\n    key += `_dynamicContentParameters:${dynamicContentParametersString}`;\n    key += `_enableAutoplay:${enableAutoplay}`;\n    key += `_gridColumns:${gridColumns}`;\n\n    return (\n      <FWVideoFeed\n        key={key}\n        {...this.props}\n        ref={this.nativeComponentRef}\n        onVideoFeedLoadFinished={this._onVideoFeedLoadFinished}\n        mode={mode}\n        style={Object.assign({}, this.props.style, { zIndex: -1 })}\n      />\n    );\n  }\n\n  private _generateDynamicContentParametersString(): string {\n    const { dynamicContentParameters } = this.props;\n    if (!dynamicContentParameters) {\n      return '';\n    }\n\n    let resultString = '';\n    const sortedKeyList = Object.keys(dynamicContentParameters).sort();\n    for (const key of sortedKeyList) {\n      const value = dynamicContentParameters[key];\n      const valueString = value.join(',');\n      if (resultString.length > 0) {\n        resultString += '_';\n      }\n\n      resultString += `${key}:${valueString}`;\n    }\n\n    return resultString;\n  }\n\n  private _getVideoFeedConfiguration(): VideoFeedConfiguration | undefined {\n    const { videoFeedConfiguration } = this.props;\n    if (!videoFeedConfiguration) {\n      return undefined;\n    }\n\n    let resultFeedConfiguration: VideoFeedConfiguration = {\n      ...videoFeedConfiguration,\n    };\n    if (resultFeedConfiguration.gridColumns) {\n      resultFeedConfiguration.gridColumns = Math.floor(\n        resultFeedConfiguration.gridColumns!\n      );\n    }\n    return resultFeedConfiguration;\n  }\n}\n"]}
+{"version":3,"sources":["VideoFeed.tsx"],"names":["React","Platform","findNodeHandle","UIManager","FireworkSDK","FWEventName","FireworkSDKModuleEventEmitter","FWLoggerUtil","FWVideoFeed","NativeComponentName","VideoFeed","Component","createRef","log","JSON","stringify","props","nativeNodeHandle","nativeComponentRef","current","commandId","getViewManagerConfig","Commands","refresh","OS","toString","dispatchViewManagerCommand","event","nativeEvent","onVideoFeedLoadFinished","name","reason","componentDidMount","subscriptionOfShareBaseURLUpdated","addListener","ShareBaseURLUpdated","setState","subscriptions","push","subscriptionOfAdBadgeConfigurationUpdated","AdBadgeConfigurationUpdated","componentWillUnmount","forEach","value","remove","render","source","channel","playlist","playlistGroup","mode","videoFeedConfiguration","_getVideoFeedConfiguration","titleHidden","title","hidden","titlePosition","customLayoutName","shareBaseURL","getInstance","adBadgeConfiguration","adBadgeTextType","badgeTextType","backgroundColorOfAdBadge","backgroundColor","textColorOfAdBadge","textColor","dynamicContentParametersString","_generateDynamicContentParametersString","enableAutoplay","gridColumns","key","_onVideoFeedLoadFinished","Object","assign","style","zIndex","dynamicContentParameters","resultString","sortedKeyList","keys","sort","valueString","join","length","Math","floor"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { NativeSyntheticEvent, Platform } from 'react-native';\nimport {\n  EmitterSubscription,\n  findNodeHandle,\n  StyleProp,\n  UIManager,\n  ViewStyle,\n} from 'react-native';\n\nimport FireworkSDK from '../FireworkSDK';\nimport type FWError from '../models/FWError';\nimport { FWEventName } from '../models/FWEventName';\nimport type VideoFeedConfiguration from '../models/VideoFeedConfiguration';\nimport type { VideoFeedSource } from '../models/VideoFeedSource';\nimport type VideoPlayerConfiguration from '../models/VideoPlayerConfiguration';\nimport { FireworkSDKModuleEventEmitter } from '../modules/FireworkSDKModule';\nimport FWLoggerUtil from '../utils/FWLoggerUtil';\nimport FWVideoFeed from './FWVideoFeed';\n\nexport type VideoFeedMode = 'row' | 'column' | 'grid';\n\nexport interface IVideoFeedProps {\n  /**\n   * Standard React Native View Style.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * One of five available video feed sources.\n   */\n  source: VideoFeedSource;\n  /**\n   * Channel id of the feed. Required when the source is set as channel or playlist or dynamicContent.\n   */\n  channel?: string;\n  /**\n   * Playlist id of the feed. Please note channel id is necessary. Required when the source is set as playlist.\n   */\n  playlist?: string;\n  /**\n   * PlaylistGroup id of the feed. Required when the source is set as playlistGroup.\n   */\n  playlistGroup?: string;\n  /**\n   * The dynamic content parameters of the feed. Required when the source is set as dynamicContent.\n   */\n  dynamicContentParameters?: { [key: string]: string[] };\n  /**\n   * One of three available display modes. Defaults to row.\n   */\n  mode?: VideoFeedMode;\n  /**\n   * Configuration of the feed.\n   */\n  videoFeedConfiguration?: VideoFeedConfiguration;\n  /**\n   * Configuration of the player.\n   */\n  videoPlayerConfiguration?: VideoPlayerConfiguration;\n  /**\n   * The feed loading result callback. It means loading successfully when error equals to undefined.\n   */\n  onVideoFeedLoadFinished?: (error?: FWError) => void;\n}\n\nconst NativeComponentName = 'FWVideoFeed';\n\nexport default class VideoFeed extends React.Component<IVideoFeedProps> {\n  static defaultProps = {\n    mode: 'row',\n  };\n\n  nativeComponentRef = React.createRef<any>();\n\n  subscriptions: EmitterSubscription[] = [];\n\n  /**\n   * Force refreshing the video feed.\n   */\n  public refresh = () => {\n    FWLoggerUtil.log(`VideoFeed refresh ${JSON.stringify(this.props)}`);\n\n    const nativeNodeHandle = findNodeHandle(this.nativeComponentRef.current);\n\n    let commandId: string | number =\n      UIManager.getViewManagerConfig(NativeComponentName).Commands.refresh;\n    if (Platform.OS === 'android') {\n      commandId = commandId.toString();\n    }\n\n    UIManager.dispatchViewManagerCommand(\n      findNodeHandle(nativeNodeHandle),\n      commandId,\n      []\n    );\n  };\n\n  private _onVideoFeedLoadFinished = (event: NativeSyntheticEvent<any>) => {\n    FWLoggerUtil.log(\n      `VideoFeed _onVideoFeedLoadFinished ${JSON.stringify(event.nativeEvent)}`\n    );\n    const { onVideoFeedLoadFinished } = this.props;\n\n    const { name, reason } = event.nativeEvent;\n\n    if (onVideoFeedLoadFinished) {\n      if (name) {\n        if (reason) {\n          onVideoFeedLoadFinished({ name, reason });\n        } else {\n          onVideoFeedLoadFinished({ name });\n        }\n      } else {\n        onVideoFeedLoadFinished();\n      }\n    }\n  };\n\n  componentDidMount() {\n    FWLoggerUtil.log(\n      `VideoFeed componentDidMount ${JSON.stringify(this.props)}`\n    );\n\n    const subscriptionOfShareBaseURLUpdated =\n      FireworkSDKModuleEventEmitter.addListener(\n        FWEventName.ShareBaseURLUpdated,\n        () => {\n          FWLoggerUtil.log('Receive FWEventName.ShareBaseURLUpdated');\n          this.setState({});\n        }\n      );\n    this.subscriptions.push(subscriptionOfShareBaseURLUpdated);\n\n    const subscriptionOfAdBadgeConfigurationUpdated =\n      FireworkSDKModuleEventEmitter.addListener(\n        FWEventName.AdBadgeConfigurationUpdated,\n        () => {\n          FWLoggerUtil.log('Receive FWEventName.AdBadgeConfigurationUpdated');\n          this.setState({});\n        }\n      );\n    this.subscriptions.push(subscriptionOfAdBadgeConfigurationUpdated);\n  }\n\n  componentWillUnmount() {\n    FWLoggerUtil.log(\n      `VideoFeed componentWillUnmount ${JSON.stringify(this.props)}`\n    );\n\n    this.subscriptions.forEach((value) => {\n      value.remove();\n    });\n\n    this.subscriptions = [];\n  }\n\n  render() {\n    FWLoggerUtil.log(`VideoFeed render ${JSON.stringify(this.props)}`);\n\n    const {\n      source,\n      channel = '',\n      playlist = '',\n      playlistGroup = '',\n      mode = 'row',\n    } = this.props;\n    const videoFeedConfiguration = this._getVideoFeedConfiguration();\n    const titleHidden = videoFeedConfiguration?.title?.hidden ?? false;\n    const titlePosition = videoFeedConfiguration?.titlePosition ?? 'nested';\n    const customLayoutName = videoFeedConfiguration?.customLayoutName ?? '';\n    const shareBaseURL = FireworkSDK.getInstance().shareBaseURL ?? '';\n    const adBadgeConfiguration =\n      FireworkSDK.getInstance().adBadgeConfiguration ?? {};\n    const adBadgeTextType = adBadgeConfiguration.badgeTextType ?? '';\n    const backgroundColorOfAdBadge = adBadgeConfiguration.backgroundColor ?? '';\n    const textColorOfAdBadge = adBadgeConfiguration.textColor ?? '';\n    const dynamicContentParametersString =\n      this._generateDynamicContentParametersString();\n    const enableAutoplay = videoFeedConfiguration?.enableAutoplay ?? false;\n    const gridColumns = videoFeedConfiguration?.gridColumns ?? 2;\n\n    let key = `source:${source}`;\n    key += `_channel:${channel}`;\n    key += `_playlist:${playlist}`;\n    key += `_playlistGroup:${playlistGroup}`;\n    key += `_mode:${mode}`;\n    key += `_titleHidden:${titleHidden}`;\n    key += `_titlePosition:${titlePosition}`;\n    key += `_customLayoutName:${customLayoutName}`;\n    key += `_shareBaseURL:${shareBaseURL}`;\n    key += `_adBadgeTextType:${adBadgeTextType}`;\n    key += `_backgroundColorOfAdBadge:${backgroundColorOfAdBadge}`;\n    key += `_textColorOfAdBadge:${textColorOfAdBadge}`;\n    key += `_dynamicContentParameters:${dynamicContentParametersString}`;\n    key += `_enableAutoplay:${enableAutoplay}`;\n    key += `_gridColumns:${gridColumns}`;\n\n    return (\n      <FWVideoFeed\n        key={key}\n        {...this.props}\n        ref={this.nativeComponentRef}\n        onVideoFeedLoadFinished={this._onVideoFeedLoadFinished}\n        mode={mode}\n        style={Object.assign({}, this.props.style, { zIndex: -1 })}\n      />\n    );\n  }\n\n  private _generateDynamicContentParametersString(): string {\n    const { dynamicContentParameters } = this.props;\n    if (!dynamicContentParameters) {\n      return '';\n    }\n\n    let resultString = '';\n    const sortedKeyList = Object.keys(dynamicContentParameters).sort();\n    for (const key of sortedKeyList) {\n      const value = dynamicContentParameters[key];\n      const valueString = value.join(',');\n      if (resultString.length > 0) {\n        resultString += '_';\n      }\n\n      resultString += `${key}:${valueString}`;\n    }\n\n    return resultString;\n  }\n\n  private _getVideoFeedConfiguration(): VideoFeedConfiguration | undefined {\n    const { videoFeedConfiguration } = this.props;\n    if (!videoFeedConfiguration) {\n      return videoFeedConfiguration;\n    }\n\n    if (\n      videoFeedConfiguration.gridColumns &&\n      Math.floor(videoFeedConfiguration.gridColumns!) !==\n        videoFeedConfiguration.gridColumns\n    ) {\n      return {\n        ...videoFeedConfiguration,\n        gridColumns: Math.floor(videoFeedConfiguration.gridColumns!),\n      };\n    } else {\n      return videoFeedConfiguration;\n    }\n  }\n}\n"]}

package/lib/module/index.js

@@ -1,3 +1,4 @@
+import StoryBlock from './components/StoryBlock';
 import VideoFeed from './components/VideoFeed';
 import FireworkSDK from './FireworkSDK';
 import FWNavigator from './FWNavigator';
@@ -7,5 +8,5 @@ import LiveStreamEventName from './models/LiveStreamEventName';
 import VideoPlaybackEventName from './models/VideoPlaybackEventName';
 import VideoShopping from './VideoShopping';
 export default FireworkSDK;
-export { FWNavigator, LiveStream, LiveStreamChatEventName, LiveStreamEventName, VideoFeed, VideoPlaybackEventName, VideoShopping };
+export { FWNavigator, LiveStream, LiveStreamChatEventName, LiveStreamEventName, StoryBlock, VideoFeed, VideoPlaybackEventName, VideoShopping };
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.tsx"],"names":["VideoFeed","FireworkSDK","FWNavigator","LiveStream","LiveStreamChatEventName","LiveStreamEventName","VideoPlaybackEventName","VideoShopping"],"mappings":"AACA,OAAOA,SAAP,MAAsB,wBAAtB;AAQA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,WAAP,MAAwB,eAAxB;AAKA,OAAOC,UAAP,MAAuB,cAAvB;AAgBA,OAAOC,uBAAP,MAAoC,kCAApC;AAEA,OAAOC,mBAAP,MAAgC,8BAAhC;AAkBA,OAAOC,sBAAP,MAAmC,iCAAnC;AAeA,OAAOC,aAAP,MAA0B,iBAA1B;AAEA,eAAeN,WAAf;AAEA,SAcEC,WAdF,EAgBEC,UAhBF,EAkBEC,uBAlBF,EAqBEC,mBArBF,EAmCEL,SAnCF,EAgDEM,sBAhDF,EAsDEC,aAtDF","sourcesContent":["import type { IVideoFeedProps, VideoFeedMode } from './components/VideoFeed';\nimport VideoFeed from './components/VideoFeed';\nimport type {\n  CustomCTAClickCallback,\n  CustomCTALinkContentRender,\n  SDKInitCallback,\n  VideoFeedClickCallback,\n  VideoPlaybackCallback,\n} from './FireworkSDK';\nimport FireworkSDK from './FireworkSDK';\nimport FWNavigator from './FWNavigator';\nimport type {\n  onLiveStreamChatEventCallback,\n  onLiveStreamEventCallback,\n} from './LiveStream';\nimport LiveStream from './LiveStream';\nimport type AdBadgeConfiguration from './models/AdBadgeConfiguration';\nimport type { AdBadgeTextType } from './models/AdBadgeConfiguration';\nimport type AddToCartResult from './models/AddToCartResult';\nimport type FeedItemDetails from './models/FeedItemDetails';\nimport type FWError from './models/FWError';\nimport type {\n  AddToCartEvent,\n  CustomCTAClickEvent,\n  LiveStreamChatEvent,\n  LiveStreamEvent,\n  SDKInitEvent,\n  UpdateProductDetailsEvent,\n  VideoPlaybackEvent,\n  WillDisplayProductEvent,\n} from './models/FWEvents';\nimport LiveStreamChatEventName from './models/LiveStreamChatEventName';\nimport type LiveStreamEventDetails from './models/LiveStreamEventDetails';\nimport LiveStreamEventName from './models/LiveStreamEventName';\nimport type LiveStreamMessageDetails from './models/LiveStreamMessageDetails';\nimport type { NewNativeContainerProps } from './models/NewNativeContainerProps';\nimport type Product from './models/Product';\nimport type ProductInfoViewConfiguration from './models/ProductInfoViewConfiguration';\nimport type { AddToCartButtonConfiguration } from './models/ProductInfoViewConfiguration';\nimport type ProductUnit from './models/ProductUnit';\nimport type { ProductPrice, ProductUnitOption } from './models/ProductUnit';\nimport type VideoFeedConfiguration from './models/VideoFeedConfiguration';\nimport type {\n  VideoFeedContentPadding,\n  VideoFeedPlayIconConfiguration,\n  VideoFeedTitleConfiguration,\n  VideoFeedTitlePosition,\n} from './models/VideoFeedConfiguration';\nimport type { VideoFeedSource } from './models/VideoFeedSource';\nimport type VideoPlaybackDetails from './models/VideoPlaybackDetails';\nimport type { VideoPlayerSize } from './models/VideoPlaybackDetails';\nimport VideoPlaybackEventName from './models/VideoPlaybackEventName';\nimport type VideoPlayerConfiguration from './models/VideoPlayerConfiguration';\nimport type {\n  VideoLaunchBehavior,\n  VideoPlayerCompleteAction,\n  VideoPlayerCTAStyle,\n  VideoPlayerStyle,\n} from './models/VideoPlayerConfiguration';\nimport type {\n  AddToCartCallback,\n  ClickCartIconCallback,\n  CustomClickCartIconCallback,\n  UpdateProductDetailsCallback,\n  WillDisplayProductCallback,\n} from './VideoShopping';\nimport VideoShopping from './VideoShopping';\n\nexport default FireworkSDK;\n\nexport {\n  AdBadgeConfiguration,\n  AdBadgeTextType,\n  AddToCartButtonConfiguration,\n  AddToCartCallback,\n  AddToCartEvent,\n  AddToCartResult,\n  ClickCartIconCallback,\n  CustomClickCartIconCallback,\n  CustomCTAClickCallback,\n  CustomCTAClickEvent,\n  CustomCTALinkContentRender,\n  FeedItemDetails,\n  FWError,\n  FWNavigator,\n  IVideoFeedProps,\n  LiveStream,\n  LiveStreamChatEvent,\n  LiveStreamChatEventName,\n  LiveStreamEvent,\n  LiveStreamEventDetails,\n  LiveStreamEventName,\n  LiveStreamMessageDetails,\n  NewNativeContainerProps,\n  onLiveStreamChatEventCallback,\n  onLiveStreamEventCallback,\n  Product,\n  ProductInfoViewConfiguration,\n  ProductPrice,\n  ProductUnit,\n  ProductUnitOption,\n  SDKInitCallback,\n  SDKInitEvent,\n  UpdateProductDetailsCallback,\n  UpdateProductDetailsEvent,\n  VideoFeed,\n  VideoFeedClickCallback,\n  VideoFeedConfiguration,\n  VideoFeedContentPadding,\n  VideoFeedMode,\n  VideoFeedPlayIconConfiguration,\n  VideoFeedSource,\n  VideoFeedTitleConfiguration,\n  VideoFeedTitlePosition,\n  VideoLaunchBehavior,\n  VideoPlaybackCallback,\n  VideoPlaybackDetails,\n  VideoPlaybackEvent,\n  VideoPlaybackEventName,\n  VideoPlayerCompleteAction,\n  VideoPlayerConfiguration,\n  VideoPlayerCTAStyle,\n  VideoPlayerSize,\n  VideoPlayerStyle,\n  VideoShopping,\n  WillDisplayProductCallback,\n  WillDisplayProductEvent,\n};\n"]}
+{"version":3,"sources":["index.tsx"],"names":["StoryBlock","VideoFeed","FireworkSDK","FWNavigator","LiveStream","LiveStreamChatEventName","LiveStreamEventName","VideoPlaybackEventName","VideoShopping"],"mappings":"AAAA,OAAOA,UAAP,MAAuB,yBAAvB;AAEA,OAAOC,SAAP,MAAsB,wBAAtB;AAQA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,WAAP,MAAwB,eAAxB;AAKA,OAAOC,UAAP,MAAuB,cAAvB;AAgBA,OAAOC,uBAAP,MAAoC,kCAApC;AAEA,OAAOC,mBAAP,MAAgC,8BAAhC;AAmBA,OAAOC,sBAAP,MAAmC,iCAAnC;AAeA,OAAOC,aAAP,MAA0B,iBAA1B;AAEA,eAAeN,WAAf;AAEA,SAcEC,WAdF,EAgBEC,UAhBF,EAkBEC,uBAlBF,EAqBEC,mBArBF,EAiCEN,UAjCF,EAqCEC,SArCF,EAkDEM,sBAlDF,EAwDEC,aAxDF","sourcesContent":["import StoryBlock from './components/StoryBlock';\nimport type { IVideoFeedProps, VideoFeedMode } from './components/VideoFeed';\nimport VideoFeed from './components/VideoFeed';\nimport type {\n  CustomCTAClickCallback,\n  CustomCTALinkContentRender,\n  SDKInitCallback,\n  VideoFeedClickCallback,\n  VideoPlaybackCallback,\n} from './FireworkSDK';\nimport FireworkSDK from './FireworkSDK';\nimport FWNavigator from './FWNavigator';\nimport type {\n  onLiveStreamChatEventCallback,\n  onLiveStreamEventCallback,\n} from './LiveStream';\nimport LiveStream from './LiveStream';\nimport type AdBadgeConfiguration from './models/AdBadgeConfiguration';\nimport type { AdBadgeTextType } from './models/AdBadgeConfiguration';\nimport type AddToCartResult from './models/AddToCartResult';\nimport type FeedItemDetails from './models/FeedItemDetails';\nimport type FWError from './models/FWError';\nimport type {\n  AddToCartEvent,\n  CustomCTAClickEvent,\n  LiveStreamChatEvent,\n  LiveStreamEvent,\n  SDKInitEvent,\n  UpdateProductDetailsEvent,\n  VideoPlaybackEvent,\n  WillDisplayProductEvent,\n} from './models/FWEvents';\nimport LiveStreamChatEventName from './models/LiveStreamChatEventName';\nimport type LiveStreamEventDetails from './models/LiveStreamEventDetails';\nimport LiveStreamEventName from './models/LiveStreamEventName';\nimport type LiveStreamMessageDetails from './models/LiveStreamMessageDetails';\nimport type { NewNativeContainerProps } from './models/NewNativeContainerProps';\nimport type Product from './models/Product';\nimport type ProductInfoViewConfiguration from './models/ProductInfoViewConfiguration';\nimport type { AddToCartButtonConfiguration } from './models/ProductInfoViewConfiguration';\nimport type ProductUnit from './models/ProductUnit';\nimport type { ProductPrice, ProductUnitOption } from './models/ProductUnit';\nimport type { StoryBlockSource } from './models/StoryBlockSource';\nimport type VideoFeedConfiguration from './models/VideoFeedConfiguration';\nimport type {\n  VideoFeedContentPadding,\n  VideoFeedPlayIconConfiguration,\n  VideoFeedTitleConfiguration,\n  VideoFeedTitlePosition,\n} from './models/VideoFeedConfiguration';\nimport type { VideoFeedSource } from './models/VideoFeedSource';\nimport type VideoPlaybackDetails from './models/VideoPlaybackDetails';\nimport type { VideoPlayerSize } from './models/VideoPlaybackDetails';\nimport VideoPlaybackEventName from './models/VideoPlaybackEventName';\nimport type VideoPlayerConfiguration from './models/VideoPlayerConfiguration';\nimport type {\n  VideoLaunchBehavior,\n  VideoPlayerCompleteAction,\n  VideoPlayerCTAStyle,\n  VideoPlayerStyle,\n} from './models/VideoPlayerConfiguration';\nimport type {\n  AddToCartCallback,\n  ClickCartIconCallback,\n  CustomClickCartIconCallback,\n  UpdateProductDetailsCallback,\n  WillDisplayProductCallback,\n} from './VideoShopping';\nimport VideoShopping from './VideoShopping';\n\nexport default FireworkSDK;\n\nexport {\n  AdBadgeConfiguration,\n  AdBadgeTextType,\n  AddToCartButtonConfiguration,\n  AddToCartCallback,\n  AddToCartEvent,\n  AddToCartResult,\n  ClickCartIconCallback,\n  CustomClickCartIconCallback,\n  CustomCTAClickCallback,\n  CustomCTAClickEvent,\n  CustomCTALinkContentRender,\n  FeedItemDetails,\n  FWError,\n  FWNavigator,\n  IVideoFeedProps,\n  LiveStream,\n  LiveStreamChatEvent,\n  LiveStreamChatEventName,\n  LiveStreamEvent,\n  LiveStreamEventDetails,\n  LiveStreamEventName,\n  LiveStreamMessageDetails,\n  NewNativeContainerProps,\n  onLiveStreamChatEventCallback,\n  onLiveStreamEventCallback,\n  Product,\n  ProductInfoViewConfiguration,\n  ProductPrice,\n  ProductUnit,\n  ProductUnitOption,\n  SDKInitCallback,\n  SDKInitEvent,\n  StoryBlock,\n  StoryBlockSource,\n  UpdateProductDetailsCallback,\n  UpdateProductDetailsEvent,\n  VideoFeed,\n  VideoFeedClickCallback,\n  VideoFeedConfiguration,\n  VideoFeedContentPadding,\n  VideoFeedMode,\n  VideoFeedPlayIconConfiguration,\n  VideoFeedSource,\n  VideoFeedTitleConfiguration,\n  VideoFeedTitlePosition,\n  VideoLaunchBehavior,\n  VideoPlaybackCallback,\n  VideoPlaybackDetails,\n  VideoPlaybackEvent,\n  VideoPlaybackEventName,\n  VideoPlayerCompleteAction,\n  VideoPlayerConfiguration,\n  VideoPlayerCTAStyle,\n  VideoPlayerSize,\n  VideoPlayerStyle,\n  VideoShopping,\n  WillDisplayProductCallback,\n  WillDisplayProductEvent,\n};\n"]}

package/lib/module/models/StoryBlockSource.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=StoryBlockSource.js.map

package/lib/module/models/StoryBlockSource.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/lib/typescript/components/FWStoryBlock.d.ts

@@ -0,0 +1,2 @@
+declare const FWStoryBlock: import("react-native").HostComponent<any> | (() => never);
+export default FWStoryBlock;

package/lib/typescript/components/StoryBlock.d.ts

@@ -0,0 +1,42 @@
+import React from 'react';
+import type { EmitterSubscription, StyleProp, ViewStyle } from 'react-native';
+import type FWError from '../models/FWError';
+import type { StoryBlockSource } from '../models/StoryBlockSource';
+export interface IStoryBlockProps {
+    /**
+     * Standard React Native View Style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * One of four available story block sources.
+     */
+    source: StoryBlockSource;
+    /**
+     * Channel id of the story block. Required when the source is set as channel or playlist or dynamicContent.
+     */
+    channel?: string;
+    /**
+     * Playlist id of the story block. Please note channel id is necessary. Required when the source is set as playlist.
+     */
+    playlist?: string;
+    /**
+     * The dynamic content parameters of the story block. Required when the source is set as dynamicContent.
+     */
+    dynamicContentParameters?: {
+        [key: string]: string[];
+    };
+    /**
+     * The feed loading result callback. It means loading successfully when error equals to undefined.
+     */
+    onStoryBlockLoadFinished?: (error?: FWError) => void;
+}
+export default class StoryBlock extends React.Component<IStoryBlockProps> {
+    nativeComponentRef: React.RefObject<any>;
+    subscriptions: EmitterSubscription[];
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private _onStoryBlockLoadFinished;
+    private _generateKey;
+    private _generateDynamicContentParametersString;
+}

package/lib/typescript/index.d.ts

@@ -1,3 +1,4 @@
+import StoryBlock from './components/StoryBlock';
 import type { IVideoFeedProps, VideoFeedMode } from './components/VideoFeed';
 import VideoFeed from './components/VideoFeed';
 import type { CustomCTAClickCallback, CustomCTALinkContentRender, SDKInitCallback, VideoFeedClickCallback, VideoPlaybackCallback } from './FireworkSDK';
@@ -21,6 +22,7 @@ import type ProductInfoViewConfiguration from './models/ProductInfoViewConfigura
 import type { AddToCartButtonConfiguration } from './models/ProductInfoViewConfiguration';
 import type ProductUnit from './models/ProductUnit';
 import type { ProductPrice, ProductUnitOption } from './models/ProductUnit';
+import type { StoryBlockSource } from './models/StoryBlockSource';
 import type VideoFeedConfiguration from './models/VideoFeedConfiguration';
 import type { VideoFeedContentPadding, VideoFeedPlayIconConfiguration, VideoFeedTitleConfiguration, VideoFeedTitlePosition } from './models/VideoFeedConfiguration';
 import type { VideoFeedSource } from './models/VideoFeedSource';
@@ -32,4 +34,4 @@ import type { VideoLaunchBehavior, VideoPlayerCompleteAction, VideoPlayerCTAStyl
 import type { AddToCartCallback, ClickCartIconCallback, CustomClickCartIconCallback, UpdateProductDetailsCallback, WillDisplayProductCallback } from './VideoShopping';
 import VideoShopping from './VideoShopping';
 export default FireworkSDK;
-export { AdBadgeConfiguration, AdBadgeTextType, AddToCartButtonConfiguration, AddToCartCallback, AddToCartEvent, AddToCartResult, ClickCartIconCallback, CustomClickCartIconCallback, CustomCTAClickCallback, CustomCTAClickEvent, CustomCTALinkContentRender, FeedItemDetails, FWError, FWNavigator, IVideoFeedProps, LiveStream, LiveStreamChatEvent, LiveStreamChatEventName, LiveStreamEvent, LiveStreamEventDetails, LiveStreamEventName, LiveStreamMessageDetails, NewNativeContainerProps, onLiveStreamChatEventCallback, onLiveStreamEventCallback, Product, ProductInfoViewConfiguration, ProductPrice, ProductUnit, ProductUnitOption, SDKInitCallback, SDKInitEvent, UpdateProductDetailsCallback, UpdateProductDetailsEvent, VideoFeed, VideoFeedClickCallback, VideoFeedConfiguration, VideoFeedContentPadding, VideoFeedMode, VideoFeedPlayIconConfiguration, VideoFeedSource, VideoFeedTitleConfiguration, VideoFeedTitlePosition, VideoLaunchBehavior, VideoPlaybackCallback, VideoPlaybackDetails, VideoPlaybackEvent, VideoPlaybackEventName, VideoPlayerCompleteAction, VideoPlayerConfiguration, VideoPlayerCTAStyle, VideoPlayerSize, VideoPlayerStyle, VideoShopping, WillDisplayProductCallback, WillDisplayProductEvent, };
+export { AdBadgeConfiguration, AdBadgeTextType, AddToCartButtonConfiguration, AddToCartCallback, AddToCartEvent, AddToCartResult, ClickCartIconCallback, CustomClickCartIconCallback, CustomCTAClickCallback, CustomCTAClickEvent, CustomCTALinkContentRender, FeedItemDetails, FWError, FWNavigator, IVideoFeedProps, LiveStream, LiveStreamChatEvent, LiveStreamChatEventName, LiveStreamEvent, LiveStreamEventDetails, LiveStreamEventName, LiveStreamMessageDetails, NewNativeContainerProps, onLiveStreamChatEventCallback, onLiveStreamEventCallback, Product, ProductInfoViewConfiguration, ProductPrice, ProductUnit, ProductUnitOption, SDKInitCallback, SDKInitEvent, StoryBlock, StoryBlockSource, UpdateProductDetailsCallback, UpdateProductDetailsEvent, VideoFeed, VideoFeedClickCallback, VideoFeedConfiguration, VideoFeedContentPadding, VideoFeedMode, VideoFeedPlayIconConfiguration, VideoFeedSource, VideoFeedTitleConfiguration, VideoFeedTitlePosition, VideoLaunchBehavior, VideoPlaybackCallback, VideoPlaybackDetails, VideoPlaybackEvent, VideoPlaybackEventName, VideoPlayerCompleteAction, VideoPlayerConfiguration, VideoPlayerCTAStyle, VideoPlayerSize, VideoPlayerStyle, VideoShopping, WillDisplayProductCallback, WillDisplayProductEvent, };

package/lib/typescript/models/StoryBlockSource.d.ts

@@ -0,0 +1 @@
+export declare type StoryBlockSource = 'discover' | 'channel' | 'playlist' | 'dynamicContent';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-firework-sdk",
-  "version": "1.3.1-beta.9",
+  "version": "1.4.1",
   "description": "Firework React Native SDK",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/react-native-firework-sdk.podspec

@@ -28,6 +28,6 @@ cp $module_header_path "${PODS_ROOT}/Headers/Public/react_native_firework_sdk/"'
 
   s.dependency "React-Core"
 
-  s.dependency "FireworkVideo", "0.18.0"
+  s.dependency "FireworkVideo", "1.0.1"
 
 end

package/src/components/FWStoryBlock.tsx

@@ -0,0 +1,10 @@
+import { requireNativeComponent, UIManager } from 'react-native';
+import { LINKING_ERROR } from '../constants/FWErrorMessage';
+const NativeComponentName = 'FWStoryBlock';
+const FWStoryBlock =
+  UIManager.getViewManagerConfig(NativeComponentName) != null
+    ? requireNativeComponent<any>(NativeComponentName)
+    : () => {
+        throw new Error(LINKING_ERROR);
+      };
+export default FWStoryBlock;

package/src/components/StoryBlock.tsx

@@ -0,0 +1,180 @@
+import React from 'react';
+
+import type {
+  EmitterSubscription,
+  NativeSyntheticEvent,
+  StyleProp,
+  ViewStyle,
+} from 'react-native';
+
+import FireworkSDK from '../FireworkSDK';
+import type FWError from '../models/FWError';
+import { FWEventName } from '../models/FWEventName';
+import type { StoryBlockSource } from '../models/StoryBlockSource';
+import { FireworkSDKModuleEventEmitter } from '../modules/FireworkSDKModule';
+import FWLoggerUtil from '../utils/FWLoggerUtil';
+import FWStoryBlock from './FWStoryBlock';
+import { findNodeHandle, UIManager, Platform } from 'react-native';
+
+const NativeComponentName = 'FWStoryBlock';
+
+const createFragment = (viewId: any) => {
+  if (Platform.OS === 'android') {
+    UIManager.dispatchViewManagerCommand(
+      viewId,
+      UIManager.getViewManagerConfig(
+        NativeComponentName
+      ).Commands.create.toString(),
+      [viewId]
+    );
+  }
+};
+
+export interface IStoryBlockProps {
+  /**
+   * Standard React Native View Style.
+   */
+  style?: StyleProp<ViewStyle>;
+  /**
+   * One of four available story block sources.
+   */
+  source: StoryBlockSource;
+  /**
+   * Channel id of the story block. Required when the source is set as channel or playlist or dynamicContent.
+   */
+  channel?: string;
+  /**
+   * Playlist id of the story block. Please note channel id is necessary. Required when the source is set as playlist.
+   */
+  playlist?: string;
+  /**
+   * The dynamic content parameters of the story block. Required when the source is set as dynamicContent.
+   */
+  dynamicContentParameters?: { [key: string]: string[] };
+  /**
+   * The feed loading result callback. It means loading successfully when error equals to undefined.
+   */
+  onStoryBlockLoadFinished?: (error?: FWError) => void;
+}
+
+export default class StoryBlock extends React.Component<IStoryBlockProps> {
+  nativeComponentRef = React.createRef<any>();
+
+  subscriptions: EmitterSubscription[] = [];
+  componentDidMount() {
+    const subscriptionOfShareBaseURLUpdated =
+      FireworkSDKModuleEventEmitter.addListener(
+        FWEventName.ShareBaseURLUpdated,
+        () => {
+          this.setState({});
+        }
+      );
+    this.subscriptions.push(subscriptionOfShareBaseURLUpdated);
+
+    const subscriptionOfAdBadgeConfigurationUpdated =
+      FireworkSDKModuleEventEmitter.addListener(
+        FWEventName.AdBadgeConfigurationUpdated,
+        () => {
+          this.setState({});
+        }
+      );
+    this.subscriptions.push(subscriptionOfAdBadgeConfigurationUpdated);
+
+    if (Platform.OS === 'android') {
+      const viewId = findNodeHandle(this.nativeComponentRef.current);
+      FWLoggerUtil.log(
+        `StoryBlock componentDidMount createFragment viewId: ${viewId}`
+      );
+      createFragment(viewId);
+    }
+  }
+
+  componentWillUnmount() {
+    this.subscriptions.forEach((value) => {
+      value.remove();
+    });
+
+    this.subscriptions = [];
+  }
+
+  render() {
+    const { style } = this.props;
+
+    return (
+      <FWStoryBlock
+        ref={this.nativeComponentRef}
+        key={this._generateKey()}
+        {...this.props}
+        onStoryBlockLoadFinished={this._onStoryBlockLoadFinished}
+        style={Object.assign({}, style, { zIndex: -1 })}
+      />
+    );
+  }
+
+  private _onStoryBlockLoadFinished = (event: NativeSyntheticEvent<any>) => {
+    FWLoggerUtil.log(
+      `StoryBlock _onStoryBlockLoadFinished ${event.nativeEvent.name}`
+    );
+
+    const { onStoryBlockLoadFinished } = this.props;
+    const { name, reason } = event.nativeEvent;
+
+    if (onStoryBlockLoadFinished) {
+      if (name) {
+        if (reason) {
+          onStoryBlockLoadFinished({ name, reason });
+        } else {
+          onStoryBlockLoadFinished({ name });
+        }
+      } else {
+        onStoryBlockLoadFinished();
+      }
+    }
+  };
+
+  private _generateKey(): string {
+    const { source, channel = '', playlist = '' } = this.props;
+
+    const shareBaseURL = FireworkSDK.getInstance().shareBaseURL ?? '';
+    const adBadgeConfiguration =
+      FireworkSDK.getInstance().adBadgeConfiguration ?? {};
+    const adBadgeTextType = adBadgeConfiguration.badgeTextType ?? '';
+    const backgroundColorOfAdBadge = adBadgeConfiguration.backgroundColor ?? '';
+    const textColorOfAdBadge = adBadgeConfiguration.textColor ?? '';
+    const dynamicContentParametersString =
+      this._generateDynamicContentParametersString();
+
+    let key = `source:${source}`;
+    key += `_channel:${channel}`;
+    key += `_playlist:${playlist}`;
+    key += `_shareBaseURL:${shareBaseURL}`;
+    key += `_adBadgeTextType:${adBadgeTextType}`;
+    key += `_backgroundColorOfAdBadge:${backgroundColorOfAdBadge}`;
+    key += `_textColorOfAdBadge:${textColorOfAdBadge}`;
+    key += `_dynamicContentParameters:${dynamicContentParametersString}`;
+
+    return key;
+  }
+
+  private _generateDynamicContentParametersString(): string {
+    const { dynamicContentParameters } = this.props;
+
+    if (!dynamicContentParameters) {
+      return '';
+    }
+
+    let resultString = '';
+    const sortedKeyList = Object.keys(dynamicContentParameters).sort();
+    for (const key of sortedKeyList) {
+      const value = dynamicContentParameters[key];
+      const valueString = value.join(',');
+      if (resultString.length > 0) {
+        resultString += '_';
+      }
+
+      resultString += `${key}:${valueString}`;
+    }
+
+    return resultString;
+  }
+}

package/src/components/VideoFeed.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type { NativeSyntheticEvent, TargetedEvent } from 'react-native';
+import { NativeSyntheticEvent, Platform } from 'react-native';
 import {
   EmitterSubscription,
   findNodeHandle,
@@ -8,7 +8,6 @@ import {
   UIManager,
   ViewStyle,
 } from 'react-native';
-import FWLoggerUtil from '../utils/FWLoggerUtil';
 
 import FireworkSDK from '../FireworkSDK';
 import type FWError from '../models/FWError';
@@ -17,6 +16,7 @@ import type VideoFeedConfiguration from '../models/VideoFeedConfiguration';
 import type { VideoFeedSource } from '../models/VideoFeedSource';
 import type VideoPlayerConfiguration from '../models/VideoPlayerConfiguration';
 import { FireworkSDKModuleEventEmitter } from '../modules/FireworkSDKModule';
+import FWLoggerUtil from '../utils/FWLoggerUtil';
 import FWVideoFeed from './FWVideoFeed';
 
 export type VideoFeedMode = 'row' | 'column' | 'grid';
@@ -64,11 +64,6 @@ export interface IVideoFeedProps {
   onVideoFeedLoadFinished?: (error?: FWError) => void;
 }
 
-interface VideoFeedLoadFinishedEvent extends TargetedEvent {
-  name: string;
-  reason?: string | null;
-}
-
 const NativeComponentName = 'FWVideoFeed';
 
 export default class VideoFeed extends React.Component<IVideoFeedProps> {
@@ -88,27 +83,36 @@ export default class VideoFeed extends React.Component<IVideoFeedProps> {
 
     const nativeNodeHandle = findNodeHandle(this.nativeComponentRef.current);
 
+    let commandId: string | number =
+      UIManager.getViewManagerConfig(NativeComponentName).Commands.refresh;
+    if (Platform.OS === 'android') {
+      commandId = commandId.toString();
+    }
+
     UIManager.dispatchViewManagerCommand(
       findNodeHandle(nativeNodeHandle),
-      UIManager.getViewManagerConfig(NativeComponentName).Commands.refresh,
+      commandId,
       []
     );
   };
 
-  private _onVideoFeedLoadFinished = (
-    event: NativeSyntheticEvent<VideoFeedLoadFinishedEvent>
-  ) => {
+  private _onVideoFeedLoadFinished = (event: NativeSyntheticEvent<any>) => {
     FWLoggerUtil.log(
       `VideoFeed _onVideoFeedLoadFinished ${JSON.stringify(event.nativeEvent)}`
     );
+    const { onVideoFeedLoadFinished } = this.props;
 
     const { name, reason } = event.nativeEvent;
 
-    if (this.props.onVideoFeedLoadFinished) {
+    if (onVideoFeedLoadFinished) {
       if (name) {
-        this.props.onVideoFeedLoadFinished({ name, reason });
+        if (reason) {
+          onVideoFeedLoadFinished({ name, reason });
+        } else {
+          onVideoFeedLoadFinished({ name });
+        }
       } else {
-        this.props.onVideoFeedLoadFinished();
+        onVideoFeedLoadFinished();
       }
     }
   };
@@ -228,17 +232,20 @@ export default class VideoFeed extends React.Component<IVideoFeedProps> {
   private _getVideoFeedConfiguration(): VideoFeedConfiguration | undefined {
     const { videoFeedConfiguration } = this.props;
     if (!videoFeedConfiguration) {
-      return undefined;
+      return videoFeedConfiguration;
     }
 
-    let resultFeedConfiguration: VideoFeedConfiguration = {
-      ...videoFeedConfiguration,
-    };
-    if (resultFeedConfiguration.gridColumns) {
-      resultFeedConfiguration.gridColumns = Math.floor(
-        resultFeedConfiguration.gridColumns!
-      );
+    if (
+      videoFeedConfiguration.gridColumns &&
+      Math.floor(videoFeedConfiguration.gridColumns!) !==
+        videoFeedConfiguration.gridColumns
+    ) {
+      return {
+        ...videoFeedConfiguration,
+        gridColumns: Math.floor(videoFeedConfiguration.gridColumns!),
+      };
+    } else {
+      return videoFeedConfiguration;
     }
-    return resultFeedConfiguration;
   }
 }

package/src/index.tsx

@@ -1,3 +1,4 @@
+import StoryBlock from './components/StoryBlock';
 import type { IVideoFeedProps, VideoFeedMode } from './components/VideoFeed';
 import VideoFeed from './components/VideoFeed';
 import type {
@@ -39,6 +40,7 @@ import type ProductInfoViewConfiguration from './models/ProductInfoViewConfigura
 import type { AddToCartButtonConfiguration } from './models/ProductInfoViewConfiguration';
 import type ProductUnit from './models/ProductUnit';
 import type { ProductPrice, ProductUnitOption } from './models/ProductUnit';
+import type { StoryBlockSource } from './models/StoryBlockSource';
 import type VideoFeedConfiguration from './models/VideoFeedConfiguration';
 import type {
   VideoFeedContentPadding,
@@ -101,6 +103,8 @@ export {
   ProductUnitOption,
   SDKInitCallback,
   SDKInitEvent,
+  StoryBlock,
+  StoryBlockSource,
   UpdateProductDetailsCallback,
   UpdateProductDetailsEvent,
   VideoFeed,

package/src/models/StoryBlockSource.ts

@@ -0,0 +1,5 @@
+export type StoryBlockSource =
+  | 'discover'
+  | 'channel'
+  | 'playlist'
+  | 'dynamicContent';