@tivio/sdk-react 2.3.4-beta.1 → 2.3.4-beta.2

package/dist/types/bundle.types.d.ts

@@ -0,0 +1,206 @@
+import { SubscribeToTaggedVideos, UseCancelSubscription } from '@tivio/common';
+import { ComponentType } from 'react';
+import { Logger } from '../services/logger';
+import { FetchPackage } from '../services/packageLoader';
+import { Disposer, Empty, Nullable } from './common';
+import { Channel, Language, RemoteProviderProps, Section, TivioSources, TivioWidgetProps, UserData, WebPlayerProps, Widget } from './types';
+import type { AdSource, PlayerWrapper } from './customPlayer.types';
+import type { Monetization, QerkoPaymentInfo, Screen, SubscribeToItemsInRow, SubscribeToRowsInScreen, SubscribeToScreen, TvAppProps, Video, User, Purchase, UseSearch } from '@tivio/common';
+import type React from 'react';
+declare type Settings = {
+    onSetUser: (handler: (userId: string, userPayload: unknown) => void) => void;
+    setUser: (userId: string, userPayload: unknown) => void;
+};
+declare type InternalConfig = {
+    enable?: boolean;
+    secret: string | null;
+    verbose?: boolean;
+    resolverUrl: string;
+    bundleUrlOverride?: string;
+    disableUnmounting?: boolean;
+    logger?: Logger | null;
+    fetchPackage: FetchPackage;
+    pubSub: PubSub;
+    LoaderComponent?: ComponentType;
+    ErrorComponent?: ComponentType<{
+        error: string | null;
+    }>;
+    language?: string;
+    sdkVersion: string;
+    enableSentry?: boolean;
+};
+declare type Events = {
+    'on-ready': RemoteBundleState;
+    'on-error': Error;
+};
+interface PubSub {
+    publish: <K extends keyof Events>(triggerName: K, payload: Events[K]) => Empty;
+    subscribe: <K extends keyof Events>(triggerName: K, onMessage: (data: Events[K]) => Empty) => Disposer;
+}
+declare type Config = Pick<InternalConfig, 'enable' | 'secret' | 'verbose' | 'logger' | 'disableUnmounting' | 'bundleUrlOverride' | 'LoaderComponent' | 'ErrorComponent' | 'language' | 'enableSentry'>;
+declare type TivioSubscriptions = {
+    subscribeToUser: (cb: (error: string | null, user: User | null) => void) => void;
+    /**
+     * Listen to widget changes.
+     * @param widgetId - widget id
+     * @param cb - callback on widget updates or on error
+     */
+    subscribeToWidget: (widgetId: string, cb: (error: Error | null, data: Widget | null, disposer?: Disposer) => void) => void;
+    /**
+     * Listen to channel changes.
+     * @param channelId - channel id
+     * @param cb - callback on channel updates or on error
+     */
+    subscribeToChannel: (channelId: string, cb: (error: Error | null, data: Channel | null) => void) => void;
+    /**
+     * Listen to section changes.
+     * @param sectionId - section id
+     * @param cb - callback on section updates or on error
+     */
+    subscribeToSection: (sectionId: string, cb: (error: Error | null, data: Section | null) => void) => void;
+    /**
+     * Listen to video changes.
+     * @param videoId - video id
+     * @param cb - callback on video updates or on error
+     */
+    subscribeToVideo: (videoId: string, cb: (error: Error | null, data: Video | null, disposer?: Disposer) => void) => void;
+    /**
+     * Listen to videos in section changes.
+     * @param sectionId - section id
+     * @param cb - callback on videos change or error
+     * @param limit - videos count
+     */
+    subscribeToVideosInSection: (sectionId: string, cb: (error: null | Error, data: null | {
+        videos: Video[];
+        hasNextPage: boolean;
+    }, fetchMore: null | ((count?: number) => void), isLoading: boolean) => void, limit?: number) => void;
+    /**
+     * Listen to section in channel changes
+     * @param channelId - channel id
+     * @param cb - callback on sections change or error
+     * @param limit - sections count
+     */
+    subscribeToSectionsInChannel: (channelId: string, cb: (error: null | Error, data: null | {
+        sections: Section[];
+        hasNextPage: boolean;
+    }, fetchMore: null | ((count?: number) => void), isLoading: boolean) => void, limit?: number) => void;
+    /**
+     * Listen to channels in widget changes
+     * @param widgetId - widget id
+     * @param cb - callback on channels change or error
+     * @param limit - channels count
+     */
+    subscribeToChannelsInWidget: (widgetId: string, cb: (error: null | Error, data: null | {
+        channels: Channel[];
+        hasNextPage: boolean;
+    }, fetchMore: null | ((count?: number) => void), isLoading: boolean) => void, limit?: number) => void;
+    subscribeToScreen: SubscribeToScreen;
+    subscribeToItemsInRow: SubscribeToItemsInRow;
+    subscribeToRowsInScreen: SubscribeToRowsInScreen;
+    subscribeToTaggedVideos: SubscribeToTaggedVideos;
+};
+declare type TivioGetters = {
+    isTivioLoaded: (cb: (isLoaded: boolean) => void) => boolean;
+    isSignedIn: () => boolean;
+    /**
+     * Get channel by its id.
+     * @param channelId - channel id
+     * @returns {Promise<Channel | null>} channel or null if channel does not exists
+     */
+    getChannelById: (channelId: string) => Promise<Channel | null>;
+    /**
+     * Get (or create) player wrapper instance
+     * @param opt - player getter options
+     * @returns {PlayerWrapper} player wrapper instance
+     */
+    getPlayerWrapper: (opt: {
+        playerWrapperId?: string;
+    }) => PlayerWrapper;
+    getOrganizationScreens: () => Promise<Screen[]>;
+    getOrganizationSubscriptions: () => Promise<Monetization[] | undefined>;
+    /**
+     * Get section by its id.
+     * @param sectionId - section id
+     * @returns {Promise<{section: Section, channel: Channel} | null>} section and channel or null if channel or section does not exists
+     */
+    getSectionById: (sectionId: string) => Promise<Section | null>;
+    /**
+     * Get video by its id.
+     * @param videoId - video id
+     * @returns {Promise<Video | null>} video or null if video does not exists
+     */
+    getVideoById: (videoId: string) => Promise<Video | null>;
+    /**
+     * Get widget by its id.
+     * @param widgetId - widget id
+     * @returns {Promise<Widget | null>} widget or null if widget does not exists
+     */
+    getWidgetById: (widgetId: string) => Promise<Widget | null>;
+};
+interface TivioAuth {
+    changePassword: (newPassword: string) => Promise<void>;
+    changeUserPhoto(file: File): Promise<void>;
+    removeUserPhoto(): Promise<void>;
+    getPurchasedVodsWithInitializedVideos: () => Promise<Purchase[]>;
+    /**
+     * @param email
+     * @param password
+     */
+    createUserWithEmailAndPassword: (email: string, password: string, userData?: UserData) => Promise<void>;
+    /**
+     * Sign in the user and starts listening on his purchases
+     * @param email
+     * @param password
+     */
+    signInWithEmailAndPassword: (email: string, password: string) => Promise<void>;
+    initializeUser: () => Promise<void>;
+    signOut: () => Promise<void>;
+    createFreePurchase: (monetizationId: string) => Promise<void>;
+}
+declare type TivioComponents = {
+    AdIndicationButtonWeb: React.ReactNode;
+    Markers: React.ReactNode;
+    PlayerDataContext: React.ReactNode;
+    Provider: React.ComponentType<RemoteProviderProps>;
+    SkipButtonWeb: React.ReactNode;
+    VideoAdBanner: React.ReactNode;
+    WebPlayer: React.ComponentType<WebPlayerProps>;
+    Widget: React.ComponentType<TivioWidgetProps>;
+    TvPlayer: React.ComponentType<WebPlayerProps>;
+    PlayerDataContextProvider: React.ComponentType<{
+        id: string;
+    }>;
+    SkipButtonTv: React.ComponentType<{
+        Button: React.ComponentType;
+        Label: React.ComponentType;
+        Container: React.ComponentType;
+        onStarted?: () => any;
+        onEnded?: () => any;
+    }>;
+    TvApp: React.ComponentType<TvAppProps>;
+};
+declare type TivioHooks = {
+    useAd: () => [(AdSource | null)];
+    useCancelSubscription: UseCancelSubscription;
+    useSearch: UseSearch;
+};
+declare type TivioBundle = {
+    components: TivioComponents;
+    getters: TivioGetters;
+    auth: TivioAuth;
+    hooks: TivioHooks;
+    init: (config: Config) => void | Promise<void>;
+    purchaseVideoWithQerko: (videoId: string, monetizationId: string) => Promise<QerkoPaymentInfo>;
+    purchaseSubscriptionWithQerko: (monetizationId: string) => Promise<QerkoPaymentInfo>;
+    setLanguage: (language: Language) => void;
+    setUser: (userId: string, userPayload?: unknown) => void;
+    sources: TivioSources;
+    subscriptions: TivioSubscriptions;
+};
+declare type RemoteBundleState = {
+    config: InternalConfig;
+    error: string | null;
+    settings: Settings;
+    state: 'loading' | 'error' | 'ready';
+} & Nullable<TivioBundle>;
+export type { RemoteBundleState, Config, Settings, InternalConfig, TivioBundle, TivioHooks, TivioComponents, TivioAuth, TivioGetters, TivioSubscriptions, Events, PubSub, };

package/dist/types/common.d.ts

@@ -0,0 +1,6 @@
+declare type Nullable<T> = {
+    [P in keyof T]: T[P] | null;
+};
+declare type Empty = void | Promise<void> | undefined | Promise<undefined>;
+declare type Disposer = () => void;
+export { Disposer, Empty, Nullable, };

package/dist/types/customPlayer.types.d.ts

@@ -0,0 +1,38 @@
+import { Empty } from './common';
+export interface BasicSource {
+    description: string;
+    name: string;
+    uri: string;
+    type: 'AD' | 'VOD' | 'CHANNEL';
+}
+export interface ChannelSource extends BasicSource {
+    from: Date;
+    channelName: string;
+    to: Date;
+    type: 'CHANNEL';
+}
+export interface AdSource extends BasicSource {
+    durationMs: number;
+    skipDelayMs: number | null;
+    type: 'AD';
+    canSkip?: boolean;
+    skip?: () => void;
+}
+export interface VodSource extends BasicSource {
+    type: 'VOD';
+}
+export declare type InputSource = AdSource | ChannelSource | VodSource;
+export declare type PlayerInterface = {
+    play: () => Empty;
+    pause: () => Empty;
+    seekTo: (positionMs: number) => Empty;
+    setSource: (source: InputSource | null) => Empty;
+    setVolume: (volume: number) => Empty;
+};
+export declare type PlayerWrapper = {
+    events: {
+        addListener: <T = any>(event: string, cb: (value: T) => Empty) => Empty;
+        removeAllListeners: () => Empty;
+    };
+};
+export declare type UsePlayerEvent = <T = any>(eventName: string) => T | null;

package/dist/types/types.d.ts

@@ -0,0 +1,176 @@
+/**
+ * Copyright (c) 2021, nangu.TV, a.s. All rights reserved.
+ * nangu.TV, a.s PROPRIETARY/CONFIDENTIAL. Use is subject to license terms.
+ */
+/**
+ * Export public client side API
+ */
+import { USER_TYPE } from '@tivio/common';
+import type { Monetization, Video } from '@tivio/common';
+import type React from 'react';
+declare type RemoteProviderProps = {
+    disableUnmounting?: boolean;
+    language?: string;
+};
+declare type Language = 'cs' | 'en' | 'sk' | 'de' | 'pl';
+declare type User = {
+    purchases: Purchase[];
+    purchasedVods: Purchase[];
+    purchasedSubscriptions: Purchase[];
+    getPurchasedVodsWithInitializedVideos: () => Promise<Purchase[]>;
+    isPurchasesInitialized: boolean;
+    isSignedIn: boolean;
+    email: string;
+    type?: USER_TYPE;
+    photoURL: string | null;
+    name?: string;
+    authUserId?: string;
+};
+interface UserData {
+    name?: string;
+}
+declare type Widget = {
+    id: string;
+    channels: Channel[];
+    isEnabled: boolean | null;
+    name: string | null;
+    recentVideos: Video[] | null;
+    widgetId: string | null;
+    lastVideo: Video | null;
+};
+declare type Channel = {
+    id: string;
+    name: string;
+    header: string;
+    headerLogo: string;
+    recentVideos: Video[];
+};
+declare type Section = {
+    id: string;
+    name: string;
+    channel: Channel;
+    videos: Video[];
+};
+declare type Chapter = object;
+declare type Purchase = {
+    isPurchased: boolean;
+    monetizationId: string;
+    videoId: string;
+    status: string;
+    video: Video | null;
+};
+declare type Marker = {
+    id: string;
+    type: string;
+    from: Date;
+    to: Date;
+    count?: number;
+    fromMs?: number;
+    toMs?: number;
+};
+declare type BetOffer = {
+    betService: string;
+    league: string;
+    odds: {
+        winner: string;
+        rate: number;
+    }[];
+    sport: string;
+    opponent1: string;
+    opponent2: string;
+    time: Date;
+};
+export interface TivioWidgetProps {
+    id: string;
+    ref: React.MutableRefObject<TivioWidgetRef>;
+    onEnabled?: (enabled: boolean) => any;
+    onBlur?: (event: {
+        key: string;
+        width: number;
+        x: number;
+    }) => any;
+}
+export interface TivioWidgetRef {
+    focus: (args: {
+        x?: number;
+    }) => void;
+    handleKey: (key: string) => ({
+        handled: boolean;
+        x: number;
+    });
+    unfocus: () => ({
+        x: number;
+    });
+}
+interface VodTivioSource {
+    type: 'VodTivioSource';
+    description: string;
+    path: string;
+    name: string;
+    uri: string;
+    poster?: string;
+    adMonetizationId?: string;
+}
+interface ChannelSource {
+    type: 'ChannelSource';
+    uri: string;
+    originalOptions: any;
+    channelName: string;
+    programName: string;
+    programDescription: string;
+    from: Date;
+    to: Date;
+    poster?: string;
+}
+declare type VideoPath = string;
+interface WebPlayerProps {
+    id: string;
+    source?: VodTivioSource | ChannelSource | VideoPath | null;
+    onEnded?: () => any;
+    className?: string;
+    /**
+     * default false
+     *
+     * If you choose `autoplay` make sure that autoplay is allowed in the specific situation.
+     * In some cases it may not be allowed, e.g. before the user interacted with the site, and the video
+     * will stay paused.
+     *
+     * Source: https://developer.mozilla.org/en-US/docs/Web/Media/Autoplay_guide
+     */
+    autoplay?: boolean;
+    /**
+     * default false
+     */
+    canReplay?: boolean;
+    /**
+     * default false
+     */
+    showMarkers?: boolean;
+    /**
+     * number[] is array of keyboard event.which numeric codes
+     * (see https://keycode.info/)
+     */
+    customShortcuts?: Partial<{
+        toggleFullscreen: number[];
+        togglePause: number[];
+        toggleMute: number[];
+        jumpForward: number[];
+        jumpBack: number[];
+        volumeUp: number[];
+        volumeDown: number[];
+    }>;
+    /**
+     * default true
+     */
+    enableKeyboardShortcuts?: boolean;
+    onProgress?: (event: React.ChangeEvent<HTMLVideoElement>) => void;
+    onLoadedMetadata?: (event: React.ChangeEvent<HTMLVideoElement>) => void;
+    onPlayerControllerCreated?: (playerController: any) => void;
+}
+declare type TivioSources = {
+    AdSource: any;
+    ChannelSource: any;
+    VodExternalSource: any;
+    VodTivioSource: any;
+};
+export type { RemoteProviderProps, WebPlayerProps, Marker, BetOffer, Purchase, Chapter, Language, Widget, Channel, Section, Video, TivioSources, UserData, User, Monetization, VodTivioSource, };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@tivio/sdk-react",
-    "version": "2.3.4-beta.1",
+    "version": "2.3.4-beta.2",
     "main": "dist/index.js",
     "typings": "dist/index.d.ts",
     "source": "src/index.ts",