@streamscloud/embeddable 11.0.0 → 12.1.0

package/dist/media-center/config/internal-media-center-config.js

@@ -7,19 +7,41 @@ import { getStreamPagesCursor, getStreamsCursor } from '../../streams/data-loade
 import { InternalMediaCenterAnalyticsHandler } from './internal-media-center-analytics-handler';
 import { GetMediaPageConfigDocument } from './operations.generated';
 export class InternalMediaCenterConfig {
-    mediaPageId;
     postsPlayer;
     streamPlayer;
     handlers;
+    getConfig;
     graphql;
-    constructor(mediaPageId, graphqlOrigin, testingStuff) {
-        this.mediaPageId = mediaPageId;
-        this.graphql = createLocalGQLClient(graphqlOrigin);
+    constructor(input) {
+        const { mediaPageId, graphqlOrigin, initiator, testingStuff } = input;
+        this.graphql = createLocalGQLClient(graphqlOrigin, initiator ? { 'x-initiator': initiator } : undefined);
+        this.getConfig = async () => {
+            const payload = await this.graphql.query(GetMediaPageConfigDocument, { mediaPageId }).toPromise();
+            if (!payload.data?.embedMediaPage) {
+                return null;
+            }
+            const config = payload.data.embedMediaPage;
+            return {
+                targetData: {
+                    id: config.id,
+                    handle: config.handle,
+                    name: config.name,
+                    description: config.description,
+                    image: config.image?.url || null,
+                    logo: config.logo?.url || null,
+                    banner: config.banner?.url || null,
+                    membersCount: config.membersCount
+                },
+                contentCategories: config.menuSettings?.contentCategories || [],
+                categoryTagAssociations: config.menuSettings?.contentCategoryMenuItems || [],
+                playerColors: config.playerColors || null
+            };
+        };
         this.postsPlayer = {
             getPostsCursor: async ({ filter, limit, continuationToken }) => {
                 return await getPostsCursor({
                     filter: {
-                        mediaPageId: this.mediaPageId,
+                        mediaPageId,
                         types: filter.types,
                         statuses: [Status.Published],
                         categoryId: filter.categoryId,
@@ -35,7 +57,7 @@ export class InternalMediaCenterConfig {
             getStreamsCursor: async ({ filter, limit, continuationToken }) => {
                 return await getStreamsCursor({
                     filter: {
-                        mediaPageId: this.mediaPageId,
+                        mediaPageId,
                         categoryId: filter.categoryId,
                         excludeIds: filter.excludeIds,
                         statuses: [StreamStatus.Published],
@@ -60,22 +82,4 @@ export class InternalMediaCenterConfig {
             socialInteractionsHandler: testingStuff ? new MockPostSocialInteractionsHandler() : undefined
         };
     }
-    getConfig = async () => {
-        const payload = await this.graphql.query(GetMediaPageConfigDocument, { mediaPageId: this.mediaPageId }).toPromise();
-        if (!payload.data?.embedMediaPagePlayerConfig) {
-            return null;
-        }
-        const config = payload.data.embedMediaPagePlayerConfig;
-        return {
-            targetData: {
-                id: config.mediaPage.id,
-                name: config.mediaPage.name,
-                image: config.mediaPage.image,
-                membersCount: config.mediaPage.membersCount
-            },
-            logo: config.playerSettings?.logo?.url || null,
-            contentCategories: config.playerSettings?.contentCategories || [],
-            playerColors: config.playerSettings?.colors || null
-        };
-    };
 }

package/dist/media-center/config/operations.generated.d.ts

@@ -4,35 +4,48 @@ export type GetMediaPageConfigQueryVariables = SchemaTypes.Exact<{
     mediaPageId: SchemaTypes.Scalars['String']['input'];
 }>;
 export type GetMediaPageConfigQuery = {
-    embedMediaPagePlayerConfig: {
-        mediaPage: {
-            id: string;
-            name: string;
-            image: string | null;
-            membersCount: number;
-        };
-        playerSettings: {
-            logo: {
-                url: string;
-            } | null;
+    embedMediaPage: {
+        id: string;
+        handle: string;
+        name: string;
+        description: string;
+        membersCount: number;
+        image: {
+            url: string;
+        } | null;
+        logo: {
+            url: string;
+        } | null;
+        banner: {
+            url: string;
+        } | null;
+        menuSettings: {
             contentCategories: Array<{
                 id: string;
                 name: string;
                 image: string | null;
                 parentId: string | null;
             }>;
-            colors: {
-                brand: string | null;
-                button: string | null;
-                buttonInactive: string | null;
-                cardButton: string | null;
-                cardBackground: string | null;
-                menuBackground: string | null;
-                playerBackground: string | null;
-                price: string | null;
-                salePrice: string | null;
-                sidebarBackground: string | null;
-            } | null;
+            contentCategoryMenuItems: Array<{
+                id: string;
+                tag: {
+                    text: string;
+                    backgroundColor: string;
+                    fontColor: string;
+                } | null;
+            }> | null;
+        } | null;
+        playerColors: {
+            brand: string | null;
+            button: string | null;
+            buttonInactive: string | null;
+            cardButton: string | null;
+            cardBackground: string | null;
+            menuBackground: string | null;
+            playerBackground: string | null;
+            price: string | null;
+            salePrice: string | null;
+            sidebarBackground: string | null;
         } | null;
     } | null;
 };

package/dist/media-center/config/operations.generated.js

@@ -17,7 +17,7 @@ export const GetMediaPageConfigDocument = {
                 selections: [
                     {
                         kind: 'Field',
-                        name: { kind: 'Name', value: 'embedMediaPagePlayerConfig' },
+                        name: { kind: 'Name', value: 'embedMediaPage' },
                         arguments: [
                             {
                                 kind: 'Argument',
@@ -25,11 +25,7 @@ export const GetMediaPageConfigDocument = {
                                 value: {
                                     kind: 'ObjectValue',
                                     fields: [
-                                        {
-                                            kind: 'ObjectField',
-                                            name: { kind: 'Name', value: 'mediaPageId' },
-                                            value: { kind: 'Variable', name: { kind: 'Name', value: 'mediaPageId' } }
-                                        }
+                                        { kind: 'ObjectField', name: { kind: 'Name', value: 'id' }, value: { kind: 'Variable', name: { kind: 'Name', value: 'mediaPageId' } } }
                                     ]
                                 }
                             }
@@ -37,30 +33,32 @@ export const GetMediaPageConfigDocument = {
                         selectionSet: {
                             kind: 'SelectionSet',
                             selections: [
+                                { kind: 'Field', name: { kind: 'Name', value: 'id' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'handle' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'name' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'description' } },
                                 {
                                     kind: 'Field',
-                                    name: { kind: 'Name', value: 'mediaPage' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            { kind: 'Field', name: { kind: 'Name', value: 'id' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'name' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'image' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'membersCount' } }
-                                        ]
-                                    }
+                                    name: { kind: 'Name', value: 'image' },
+                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'url' } }] }
+                                },
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'logo' },
+                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'url' } }] }
+                                },
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'banner' },
+                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'url' } }] }
                                 },
+                                { kind: 'Field', name: { kind: 'Name', value: 'membersCount' } },
                                 {
                                     kind: 'Field',
-                                    name: { kind: 'Name', value: 'playerSettings' },
+                                    name: { kind: 'Name', value: 'menuSettings' },
                                     selectionSet: {
                                         kind: 'SelectionSet',
                                         selections: [
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'logo' },
-                                                selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'url' } }] }
-                                            },
                                             {
                                                 kind: 'Field',
                                                 name: { kind: 'Name', value: 'contentCategories' },
@@ -76,25 +74,47 @@ export const GetMediaPageConfigDocument = {
                                             },
                                             {
                                                 kind: 'Field',
-                                                name: { kind: 'Name', value: 'colors' },
+                                                name: { kind: 'Name', value: 'contentCategoryMenuItems' },
                                                 selectionSet: {
                                                     kind: 'SelectionSet',
                                                     selections: [
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'brand' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'button' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'buttonInactive' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'cardButton' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'cardBackground' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'menuBackground' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'playerBackground' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'price' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePrice' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'sidebarBackground' } }
+                                                        { kind: 'Field', name: { kind: 'Name', value: 'id' } },
+                                                        {
+                                                            kind: 'Field',
+                                                            name: { kind: 'Name', value: 'tag' },
+                                                            selectionSet: {
+                                                                kind: 'SelectionSet',
+                                                                selections: [
+                                                                    { kind: 'Field', name: { kind: 'Name', value: 'text' } },
+                                                                    { kind: 'Field', name: { kind: 'Name', value: 'backgroundColor' } },
+                                                                    { kind: 'Field', name: { kind: 'Name', value: 'fontColor' } }
+                                                                ]
+                                                            }
+                                                        }
                                                     ]
                                                 }
                                             }
                                         ]
                                     }
+                                },
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'playerColors' },
+                                    selectionSet: {
+                                        kind: 'SelectionSet',
+                                        selections: [
+                                            { kind: 'Field', name: { kind: 'Name', value: 'brand' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'button' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'buttonInactive' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'cardButton' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'cardBackground' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'menuBackground' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'playerBackground' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'price' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'salePrice' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'sidebarBackground' } }
+                                        ]
+                                    }
                                 }
                             ]
                         }

package/dist/media-center/config/operations.graphql

@@ -1,33 +1,46 @@
 query GetMediaPageConfig($mediaPageId: String!) {
-  embedMediaPagePlayerConfig(input: { mediaPageId: $mediaPageId }) {
-    mediaPage {
-      id
-      name
-      image
-      membersCount
+  embedMediaPage(input: { id: $mediaPageId }) {
+    id
+    handle
+    name
+    description
+    image {
+      url
     }
-    playerSettings {
-      logo {
-        url
-      }
+    logo {
+      url
+    }
+    banner {
+      url
+    }
+    membersCount
+    menuSettings {
       contentCategories {
         id
         name
         image
         parentId
       }
-      colors {
-        brand
-        button
-        buttonInactive
-        cardButton
-        cardBackground
-        menuBackground
-        playerBackground
-        price
-        salePrice
-        sidebarBackground
+      contentCategoryMenuItems {
+        id
+        tag {
+          text
+          backgroundColor
+          fontColor
+        }
       }
     }
+    playerColors {
+      brand
+      button
+      buttonInactive
+      cardButton
+      cardBackground
+      menuBackground
+      playerBackground
+      price
+      salePrice
+      sidebarBackground
+    }
   }
 }

package/dist/media-center/config/types.d.ts

@@ -2,7 +2,7 @@ import { PostType } from '../../core/enums';
 import type { IContentCategoryFollowingHandler } from '../categories-following';
 import type { IPostAnalyticsHandler, PostPlayerModel } from '../../posts/posts-player/types';
 import type { IPostSocialInteractionsHandler } from '../../posts/social-interactions';
-import type { StreamPageViewerModel } from '../../streams/stream-page-viewer';
+import type { StreamPageViewerModel } from '../../streams/stream-page-viewer/types';
 import type { IStreamAnalyticsHandler, StreamPlayerModel } from '../../streams/streams-player/types';
 export interface IMediaCenterConfig {
     getConfig: () => Promise<MediaCenterConfigModel | null>;
@@ -44,13 +44,20 @@ export interface IMediaCenterConfig {
     };
 }
 export type MediaCenterConfigModel = {
-    logo: string | null;
     contentCategories: {
         id: string;
         name: string;
         image: string | null;
         parentId: string | null;
     }[];
+    categoryTagAssociations: {
+        id: string;
+        tag: {
+            text: string;
+            fontColor: string;
+            backgroundColor: string;
+        } | null;
+    }[];
     targetData: MediaCenterTargetDataModel;
     playerColors: {
         brand: string | null;
@@ -70,4 +77,8 @@ export type MediaCenterTargetDataModel = {
     name: string;
     image: string | null;
     membersCount: number;
+    logo: string | null;
+    handle: string;
+    description: string | null;
+    banner: string | null;
 };