@wix/himalaya-cli 0.1387.0 → 0.1388.0

package/templates/branded-lite/tier5-src/_shared/collection-contract.ts

@@ -98,7 +98,7 @@ export const COLLECTIONS: Record<string, CollectionConfig> = {
   himiBrandedBadges: { rows: 'badges', title: 'name', subtitle: 'description', view: 'grid' },
   himiBrandedDonations: { rows: 'campaigns', title: 'name', subtitle: 'description', view: 'grid', primaryVerb: { label: 'Donate' } },
   himiBrandedGiftCards: { rows: 'cards', title: 'name', subtitle: 'description', view: 'grid' },
-  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'description', view: 'grid' },
+  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'subtitle', image: 'coverUrl', view: 'grid', searchPlaceholder: 'Search channels', countNoun: ['channel', 'channels'] },
   himiBrandedPodcasts: { rows: 'episodes', title: 'title', subtitle: 'subtitle', image: 'image', metadata: ['progressLabel'], view: 'list' },
   himiBrandedForms: { rows: 'forms', title: 'name', subtitle: 'description', view: 'list' },
   himiBrandedGalleries: { rows: 'galleries', title: 'name', subtitle: 'description', image: 'image', view: 'grid' },

package/templates/branded-lite/tier5-src/_shared/video-caption.ts

@@ -0,0 +1,21 @@
+// The video carousel's two looks: the caption ON the cover (a brand label chip over the
+// image) or UNDER it. Every slide carries both placements; the descriptor's
+// `videoCaption` appear param picks one, and these flags hide the other
+// (`hiddenWhen` hides on TRUE). So a screen switches look by changing ONE param,
+// with no second carousel and no change to the slide tree.
+export type VideoCaption = "overlay" | "below";
+
+/** The placement a param asks for. Anything but "below" is the default, "overlay". */
+export function videoCaptionOf(value: unknown): VideoCaption {
+  return value === "below" ? "below" : "overlay";
+}
+
+export interface CaptionFlags {
+  captionOnImage: boolean;
+  captionBelow: boolean;
+}
+
+/** Stamp each card with the gates its slide reads (`$item.captionOnImage` / `$item.captionBelow`). */
+export function withCaption<T extends object>(cards: T[], caption: VideoCaption): (T & CaptionFlags)[] {
+  return cards.map((card) => ({ ...card, captionOnImage: caption === "overlay", captionBelow: caption === "below" }));
+}

package/templates/branded-lite/tier5-src/himi-branded-lite-home/index.ts

@@ -22,12 +22,18 @@ import { formatDateMedium } from "../_shared/engine-intl.js";
 import { readSavedProducts, type SavedProduct } from "../_shared/himi-store-saved.js";
 import { readSavedIds } from "../_shared/himi-blog-saved.js";
 import { wixMediaUrl } from "@himalaya/wix-media";
+import { isWixVideoWebRefusal, listLatestVideos, videoCard, type WixVideoCard } from "@himalaya/wix-video";
+import { videoCaptionOf, withCaption, type CaptionFlags } from "../_shared/video-caption.js";
 
 /** Latched once the member feed is refused because of WHERE the app is running rather
  *  than because of the request — see the catch in `loadExtras`. Module scope, so it
  *  survives every refresh of this worker and is reset only by a fresh boot. */
 let feedSurfaceRefused = false;
 
+/** The same latch for Wix Video: its gateway is reachable from the native apps only, so a
+ *  web bridge's refusal is permanent for this boot and the rail stays collapsed. */
+let videoSurfaceRefused = false;
+
 /** True for the one refusal that can never change while the app keeps running: the web
  *  bridge reporting that this host is not reachable from a browser at all. Deliberately
  *  narrower than `isBridgeUnavailable` — a 502/503 is an outage worth retrying, and only
@@ -292,6 +298,10 @@ interface State {
   noNextEvent: boolean;
   homePrograms: ProgramCard[];
   noHomePrograms: boolean;
+  /** The videos module's carousel — the newest ready Wix Video videos, the channels
+   *  taking turns. Guarded on `videos`; same silent-fail contract. */
+  homeVideos: (WixVideoCard & CaptionFlags)[];
+  noHomeVideos: boolean;
   feedHighlights: FeedHighlight[];
   noFeedHighlights: boolean;
   /** communityPulse member strip — the author directory of the SAME feed read
@@ -529,6 +539,7 @@ interface ExtrasSignal {
   upcomingEvents: EventEntry[];
   nextEventCards: NextEventCard[];
   homePrograms: ProgramCard[];
+  homeVideos: (WixVideoCard & CaptionFlags)[];
   feedHighlights: FeedHighlight[];
   memberAvatars: CoachAvatar[];
   groupCards: GroupCard[];
@@ -539,7 +550,7 @@ interface ExtrasSignal {
 }
 
 function emptyExtrasSignal(): ExtrasSignal {
-  return { upcomingEvents: [], nextEventCards: [], homePrograms: [], feedHighlights: [], memberAvatars: [], groupCards: [], announcementTitle: "", postCards: [], popularDishes: [], menuCategories: [] };
+  return { upcomingEvents: [], nextEventCards: [], homePrograms: [], homeVideos: [], feedHighlights: [], memberAvatars: [], groupCards: [], announcementTitle: "", postCards: [], popularDishes: [], menuCategories: [] };
 }
 
 /** Cover URL probe for a blog post — the himi-blog-feed imageUrl fallbacks
@@ -679,6 +690,18 @@ async function fetchHomePrograms(): Promise<ProgramCard[]> {
   }
 }
 
+/** ONE Wix Video read for the videos module. A failure collapses the module; the web
+ *  bridges' refusal of the gateway also latches it off for the rest of this boot. */
+async function fetchHomeVideos(): Promise<WixVideoCard[]> {
+  try {
+    const untitled = copyParam("home.videoFallbackTitle", "Video");
+    return (await listLatestVideos({ limit: 8 })).map((entry) => videoCard(entry, untitled));
+  } catch (error) {
+    if (isWixVideoWebRefusal(error)) videoSurfaceRefused = true;
+    return [];
+  }
+}
+
 function homeFeedText(item: WixFeedItem): string {
   const blocks = item.content?.blocks;
   if (Array.isArray(blocks)) {
@@ -731,6 +754,10 @@ async function fetchExtrasSignal(arg: unknown): Promise<ExtrasSignal> {
   if (verticals.includes("programs")) {
     jobs.push(fetchHomePrograms().then((cards) => { extras.homePrograms = cards; }));
   }
+  if (verticals.includes("videos") && !videoSurfaceRefused) {
+    const caption = videoCaptionOf(paramValue(arg, "videoCaption"));
+    jobs.push(fetchHomeVideos().then((cards) => { extras.homeVideos = withCaption(cards, caption); }));
+  }
   if (verticals.includes("blog")) {
     // ONE limit-8 posts query feeds BOTH the communityPulse announcement
     // (posts[0].title — the frozen contract) and the showcaseFirst/episodeFirst
@@ -847,6 +874,7 @@ function derive(state: State): State {
     noUpcomingEvents: state.upcomingEvents.length === 0,
     noNextEvent: state.nextEventCards.length === 0,
     noHomePrograms: state.homePrograms.length === 0,
+    noHomeVideos: state.homeVideos.length === 0,
     noFeedHighlights: state.feedHighlights.length === 0,
     noMemberAvatars: state.memberAvatars.length === 0,
     noGroupCards: state.groupCards.length === 0,
@@ -938,6 +966,8 @@ function baseState(): State {
     noNextEvent: true,
     homePrograms: [],
     noHomePrograms: true,
+    homeVideos: [],
+    noHomeVideos: true,
     feedHighlights: [],
     noFeedHighlights: true,
     memberAvatars: [],

package/templates/branded-lite/tier5-src/himi-branded-lite-video/index.ts

@@ -1,12 +1,15 @@
 import { defineService } from "@himalaya/state";
 import { LOADING, loaded, loadFailed, needsSignIn, type LoadFlags } from "../_shared/branded-load-state.js";
 import { copyParam, stashCopy } from "../_shared/himi-copy.js";
-import { CHANNEL_ACCESS_FIELDS, VIDEO_FIELDS, vodError, vodQuery, vodPages, videoAccess, youtubeId, type VodChannel, type VodVideo } from "../_shared/vod.js";
+import {
+  canWatchVideo, getVideo, getVideoStreamUrl, isHostedVideo, isVideoProcessing, listChannelVideos, videoCard, youtubeVideoId,
+} from "@himalaya/wix-video";
 import type { MediaItem } from "@himalaya/core";
 
+interface VideoRow { id: string; channelId: string; title: string; subtitle: string; meta: string; coverUrl: string; hasCover: boolean; noCover: boolean }
 interface S extends LoadFlags {
   id: string; channelId: string;
-  title: string; description: string; videos: { id: string; channelId: string; title: string; subtitle: string }[];
+  title: string; description: string; videos: VideoRow[];
   items: MediaItem[]; hidePlayer: boolean; hideNotFound: boolean; noEntity: boolean; hideRefresh: boolean; emptyText: string; message: string;
   playbackState: "loading" | "ready" | "processing" | "denied" | "unavailable" | "error";
 }
@@ -15,17 +18,6 @@ function input(key: string): string {
   const value = (globalThis as { himalaya?: { input?: Record<string, unknown> } }).himalaya?.input?.[key];
   return typeof value === "string" ? value : "";
 }
-const CHANNEL_QUERY = `query VodChannelVideos($channelId: ID!, $cursor: String) {
-  channel(filter: {id: $channelId}) { ${CHANNEL_ACCESS_FIELDS}
-    videos(sort: CUSTOM_DESC, cursor: $cursor) { cursor entities { ${VIDEO_FIELDS} } }
-  }
-}`;
-const VIDEO_QUERY = `query VodVideo($channelId: ID!, $videoId: ID!) {
-  channel(filter: {id: $channelId}) { ${CHANNEL_ACCESS_FIELDS} video(filter: {id: $videoId}) { ${VIDEO_FIELDS} } }
-}`;
-const PLAY_QUERY = `query VodVideoPlay($channelId: ID!, $videoId: ID!) {
-  channel(filter: {id: $channelId}) { video(filter: {id: $videoId}) { play(type: CONTENT) { entity { hls } } } }
-}`;
 let generation = 0;
 const initial: S = { ...LOADING, id: "", channelId: "", title: "", description: "", videos: [], items: [], hidePlayer: true, hideNotFound: true, noEntity: false, hideRefresh: false, emptyText: "", message: "", playbackState: "loading" };
 function unavailable(s: S, kind: S["playbackState"], message: string): S {
@@ -47,35 +39,34 @@ const svc = defineService<S, { reset: (s: S) => S; load: (s: S, arg?: unknown) =
         const channelScreen = input("screenId") === "himi_video_channel";
         if (!id || (!channelScreen && !channelId)) next = unavailable(next, "unavailable", copyParam("video.unavailableText", "This video or channel is unavailable."));
         else if (channelScreen) {
-          const videos = await vodPages(async cursor => {
-            const data = await vodQuery<{ channel: (VodChannel & { videos: { cursor?: string; entities: VodVideo[] } }) | null }>(CHANNEL_QUERY, { channelId: id, cursor });
-            if (!data.channel) throw Object.assign(vodError("Channel unavailable"), { notFound: true });
-            next.title = data.channel.title ?? "";
-            return data.channel.videos;
-          });
-          next = { ...next, ...loaded("videos", videos.map(v => ({ id: v.id, channelId: id, title: v.title?.trim() || copyParam("video.untitled", "Video"), subtitle:
-            v.content?.status !== "READY" ? copyParam("video.processingText", "Video is processing.") : "" })), COPY), playbackState: "ready" };
+          const { channel, videos } = await listChannelVideos(id);
+          next.title = channel.title ?? "";
+          const untitled = copyParam("video.untitled", "Video");
+          next = { ...next, ...loaded("videos", videos.map(v => {
+            const card = videoCard({ channel, video: v }, untitled);
+            return { id: v.id, channelId: id, title: card.title, meta: card.duration, coverUrl: card.coverUrl, hasCover: card.hasCover, noCover: card.noCover, subtitle:
+              v.content?.status !== "READY" ? copyParam("video.processingText", "Video is processing.") : "" };
+          }), COPY), playbackState: "ready" };
         } else {
-          const data = await vodQuery<{ channel: (VodChannel & { video: VodVideo | null }) | null }>(VIDEO_QUERY, { channelId, videoId: id });
-          const channel = data.channel;
-          const video = channel?.video;
-          if (!video || video.status !== "VISIBLE") next = unavailable(next, "unavailable", copyParam("video.unavailableText", "This video is unavailable."));
+          const data = await getVideo(channelId, id);
+          const channel = data?.channel;
+          const video = data?.video;
+          if (!channel || !video || video.status !== "VISIBLE") next = unavailable(next, "unavailable", copyParam("video.unavailableText", "This video is unavailable."));
           else {
             next.title = video.title ?? "";
             next.description = video.description ?? "";
-            if (video.content?.status !== "READY") next = /PROCESS|PENDING|TRANSCOD|UPLOAD|CONVERT/.test(video.content?.status ?? "") ?
+            if (video.content?.status !== "READY") next = isVideoProcessing(video) ?
               unavailable(next, "processing", copyParam("video.processingText", "Video is processing. Try again later.")) :
               unavailable(next, "unavailable", copyParam("video.unavailableText", "This video is unavailable."));
-            else if (!videoAccess(channel!, video)) next = unavailable(next, "denied", copyParam("video.deniedText", "Your current membership or purchase does not allow this video."));
+            else if (!canWatchVideo(channel, video)) next = unavailable(next, "denied", copyParam("video.deniedText", "Your current membership or purchase does not allow this video."));
             else {
               let item: MediaItem | undefined;
               if (video.source === "YOUTUBE") {
-                const providerId = youtubeId(video);
+                const providerId = youtubeVideoId(video);
                 if (providerId) item = { id, kind: "video", provider: "youtube", providerId, title: next.title };
-              } else if (["COMPUTER", "GOOGLE_DRIVE", "DROPBOX"].includes(video.source ?? "")) {
-                const play = await vodQuery<{ channel: { video: { play?: { entity?: { hls?: string } } } } }>(PLAY_QUERY, { channelId, videoId: id });
-                const url = play.channel?.video?.play?.entity?.hls;
-                if (typeof url === "string" && /^https:\/\//.test(url)) item = { id, kind: "video", provider: "direct", url, streamType: "hls", title: next.title };
+              } else if (isHostedVideo(video)) {
+                const url = await getVideoStreamUrl(channelId, id);
+                if (url) item = { id, kind: "video", provider: "direct", url, streamType: "hls", title: next.title };
               }
               next = item ? { ...next, ...loaded("videos", [], { ...COPY, empty: "" }), emptyText: "", items: [item], hidePlayer: false, playbackState: "ready" } :
                 unavailable(next, "unavailable", copyParam("video.unavailableText", "This video is unavailable."));

package/templates/branded-lite/tier5-src/himi-branded-lite-videos/index.ts

@@ -1,34 +1,27 @@
-// himi-branded-lite-videos — branded-lite "Videos" worker (Wix Video / VOD).
+// himi-branded-lite-videos — branded-lite "Videos" worker (Wix Video).
 //
-// UNLIKE the other B4 verticals, Wix Video has NO platformized REST @wix/auto_sdk_*
-// domain to codegen — the real consumer app (wix-private/wix-one-app-vod) fetches it
-// from a bespoke GraphQL gateway. So this worker mirrors that real app: it POSTs the
-// same ChannelListQuery to the VOD public GraphQL endpoint through the raw
-// `globalThis.himalaya.wixApi.call` bridge (which accepts absolute URLs + rides the
-// app's WixApiCapability auth — same chokepoint wix-spaces-dashboard uses for
-// manage.wix.com). a failed query is an error with Retry (or Sign in), an
+// Wix Video has NO platformized REST @wix/auto_sdk_* domain to codegen, so the data
+// comes through the hand-written `@himalaya/wix-video` client, which reads the same
+// Wix Video GraphQL gateway Wix's own mobile app reads, through the raw wixApi bridge
+// (visitor/member auth). ONE paged channel query feeds both sections of the screen:
+// the channels list, and the video carousel (the first videos of each channel, the
+// channels taking turns). A failed query is an error with Retry (or Sign in), an
 // empty one a real empty state; sample channels appear only in the host's explicit
 // sample preview (_shared/branded-load-state.ts).
-//
-// Endpoint + query verbatim from wix-one-app-vod/src/api/v3 (env.ts + ChannelFetch.ts).
 import { defineService } from "../_shared/collection-service.js";
 import { LOADING, loaded, loadFailed, type LoadCopy, type LoadFlags } from "../_shared/branded-load-state.js";
-import { vodQuery, vodPages } from "../_shared/vod.js";
-
-const CHANNEL_LIST_QUERY = `
-  query VodChannelList($cursor: String) {
-    channels(sort: CUSTOM_ASC, cursor: $cursor) {
-      total
-      cursor
-      entities { id title description videos { total } hasPaidVideos }
-    }
-  }
-`;
+import { copyParam } from "../_shared/himi-copy.js";
+import { videoCaptionOf, withCaption, type CaptionFlags, type VideoCaption } from "../_shared/video-caption.js";
+import { channelCoverUrl, latestVideos, listChannels, videoCard, type WixVideoCard, type WixVideoChannel } from "@himalaya/wix-video";
 
-interface VodChannel { id?: string; title?: string; description?: string; videos?: { total?: number }; hasPaidVideos?: boolean }
-interface Row { id: string; title: string; subtitle: string }
+interface Row { id: string; title: string; subtitle: string; coverUrl: string; hasCover: boolean; noCover: boolean }
 interface S extends LoadFlags {
   channels: Row[]; emptyText: string;
+  /** Hides the channels section header when there is no row under it. */
+  noChannels: boolean;
+  /** The carousel section: up to CAROUSEL_SIZE ready videos across the channels, each
+   *  stamped with the caption placement the descriptor asked for (`videoCaption`). */
+  latestVideos: (WixVideoCard & CaptionFlags)[]; noLatestVideos: boolean;
   isMock: boolean; notMock: boolean; /** #2849 — hiddenWhen() hides on TRUE, so these are inverted: the empty-state banner
    *  shows only when the site really has none, and the unavailable one only when the
    *  query failed. A failed query must never render the sentence that claims the
@@ -36,17 +29,22 @@ interface S extends LoadFlags {
   notMockEmpty: boolean; notMockUnavailable: boolean;
 }
 
-function norm(c: VodChannel): Row {
+/** Videos read per channel for the carousel, and the carousel's length. */
+const PER_CHANNEL = 4;
+const CAROUSEL_SIZE = 10;
+
+function norm(c: WixVideoChannel): Row {
   const title = (c.title || "Channel").trim() || "Channel";
   const count = c.videos?.total ?? 0;
   const parts = [count === 1 ? "1 video" : `${count} videos`, c.hasPaidVideos ? "Premium" : ""].filter(Boolean);
-  return { id: c.id || "channel", title, subtitle: parts.join(" · ") };
+  const coverUrl = channelCoverUrl(c);
+  return { id: c.id || "channel", title, subtitle: parts.join(" · "), coverUrl, hasCover: !!coverUrl, noCover: !coverUrl };
 }
 
 const MOCK: Row[] = [
-  { id: "sample-tutorials", title: "Tutorials",       subtitle: "12 videos" },
-  { id: "sample-behind",    title: "Behind the Scenes", subtitle: "6 videos" },
-  { id: "sample-masterclass", title: "Masterclass",    subtitle: "8 videos · Premium" },
+  { id: "sample-tutorials", title: "Tutorials",       subtitle: "12 videos", coverUrl: "", hasCover: false, noCover: true },
+  { id: "sample-behind",    title: "Behind the Scenes", subtitle: "6 videos", coverUrl: "", hasCover: false, noCover: true },
+  { id: "sample-masterclass", title: "Masterclass",    subtitle: "8 videos · Premium", coverUrl: "", hasCover: false, noCover: true },
 ];
 
 /** sample rows reach the screen ONLY in the host's explicit sample preview;
@@ -60,20 +58,28 @@ const COPY: LoadCopy<Row> = {
 };
 
 let generation = 0;
-const svc = defineService<S, { load: (s: S) => Promise<S | undefined> }>("himiBrandedVideos", {
-  state: { ...LOADING, channels: [], emptyText: "" },
+/** The latest placement an appear asked for; a param-less reload keeps it. */
+let caption: VideoCaption = "overlay";
+const svc = defineService<S, { load: (s: S, arg?: unknown) => Promise<S | undefined> }>("himiBrandedVideos", {
+  state: { ...LOADING, channels: [], emptyText: "", noChannels: true, latestVideos: [], noLatestVideos: true },
   actions: {
-    load: async (s) => {
+    load: async (s, arg) => {
       const request = ++generation;
+      const asked = (arg as { videoCaption?: unknown } | undefined)?.videoCaption;
+      if (asked !== undefined) caption = videoCaptionOf(asked);
       try {
-        const entities = await vodPages(async cursor => {
-          const data = await vodQuery<{ channels: { entities: (VodChannel & { id: string })[]; cursor?: string } }>(CHANNEL_LIST_QUERY, { cursor });
-          return data.channels;
-        });
-        const channels = entities.map(norm);
-        if (request === generation) return { ...s, ...loaded("channels", channels, COPY) };
+        const entities = await listChannels({ videosPerChannel: PER_CHANNEL });
+        const untitled = copyParam("videos.untitledVideo", "Video");
+        const cards = withCaption(latestVideos(entities, CAROUSEL_SIZE).map((entry) => videoCard(entry, untitled)), caption);
+        if (request === generation) {
+          const rows = loaded("channels", entities.map(norm), COPY);
+          return { ...s, ...rows, noChannels: rows.channels.length === 0, latestVideos: cards, noLatestVideos: cards.length === 0 };
+        }
       } catch (err) {
-        if (request === generation) return { ...s, ...loadFailed("channels", err, COPY) };
+        if (request === generation) {
+          const rows = loadFailed("channels", err, COPY);
+          return { ...s, ...rows, noChannels: rows.channels.length === 0, latestVideos: [], noLatestVideos: true };
+        }
       }
       return undefined;
     },

package/templates/community-club/tier5-src/_shared/collection-contract.ts

@@ -98,7 +98,7 @@ export const COLLECTIONS: Record<string, CollectionConfig> = {
   himiBrandedBadges: { rows: 'badges', title: 'name', subtitle: 'description', view: 'grid' },
   himiBrandedDonations: { rows: 'campaigns', title: 'name', subtitle: 'description', view: 'grid', primaryVerb: { label: 'Donate' } },
   himiBrandedGiftCards: { rows: 'cards', title: 'name', subtitle: 'description', view: 'grid' },
-  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'description', view: 'grid' },
+  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'subtitle', image: 'coverUrl', view: 'grid', searchPlaceholder: 'Search channels', countNoun: ['channel', 'channels'] },
   himiBrandedPodcasts: { rows: 'episodes', title: 'title', subtitle: 'subtitle', image: 'image', metadata: ['progressLabel'], view: 'list' },
   himiBrandedForms: { rows: 'forms', title: 'name', subtitle: 'description', view: 'list' },
   himiBrandedGalleries: { rows: 'galleries', title: 'name', subtitle: 'description', image: 'image', view: 'grid' },

package/templates/community-club/tier5-src/_shared/video-caption.ts

@@ -0,0 +1,21 @@
+// The video carousel's two looks: the caption ON the cover (a brand label chip over the
+// image) or UNDER it. Every slide carries both placements; the descriptor's
+// `videoCaption` appear param picks one, and these flags hide the other
+// (`hiddenWhen` hides on TRUE). So a screen switches look by changing ONE param,
+// with no second carousel and no change to the slide tree.
+export type VideoCaption = "overlay" | "below";
+
+/** The placement a param asks for. Anything but "below" is the default, "overlay". */
+export function videoCaptionOf(value: unknown): VideoCaption {
+  return value === "below" ? "below" : "overlay";
+}
+
+export interface CaptionFlags {
+  captionOnImage: boolean;
+  captionBelow: boolean;
+}
+
+/** Stamp each card with the gates its slide reads (`$item.captionOnImage` / `$item.captionBelow`). */
+export function withCaption<T extends object>(cards: T[], caption: VideoCaption): (T & CaptionFlags)[] {
+  return cards.map((card) => ({ ...card, captionOnImage: caption === "overlay", captionBelow: caption === "below" }));
+}

package/templates/community-club/tier5-src/himi-branded-lite-home/index.ts

@@ -22,12 +22,18 @@ import { formatDateMedium } from "../_shared/engine-intl.js";
 import { readSavedProducts, type SavedProduct } from "../_shared/himi-store-saved.js";
 import { readSavedIds } from "../_shared/himi-blog-saved.js";
 import { wixMediaUrl } from "@himalaya/wix-media";
+import { isWixVideoWebRefusal, listLatestVideos, videoCard, type WixVideoCard } from "@himalaya/wix-video";
+import { videoCaptionOf, withCaption, type CaptionFlags } from "../_shared/video-caption.js";
 
 /** Latched once the member feed is refused because of WHERE the app is running rather
  *  than because of the request — see the catch in `loadExtras`. Module scope, so it
  *  survives every refresh of this worker and is reset only by a fresh boot. */
 let feedSurfaceRefused = false;
 
+/** The same latch for Wix Video: its gateway is reachable from the native apps only, so a
+ *  web bridge's refusal is permanent for this boot and the rail stays collapsed. */
+let videoSurfaceRefused = false;
+
 /** True for the one refusal that can never change while the app keeps running: the web
  *  bridge reporting that this host is not reachable from a browser at all. Deliberately
  *  narrower than `isBridgeUnavailable` — a 502/503 is an outage worth retrying, and only
@@ -292,6 +298,10 @@ interface State {
   noNextEvent: boolean;
   homePrograms: ProgramCard[];
   noHomePrograms: boolean;
+  /** The videos module's carousel — the newest ready Wix Video videos, the channels
+   *  taking turns. Guarded on `videos`; same silent-fail contract. */
+  homeVideos: (WixVideoCard & CaptionFlags)[];
+  noHomeVideos: boolean;
   feedHighlights: FeedHighlight[];
   noFeedHighlights: boolean;
   /** communityPulse member strip — the author directory of the SAME feed read
@@ -529,6 +539,7 @@ interface ExtrasSignal {
   upcomingEvents: EventEntry[];
   nextEventCards: NextEventCard[];
   homePrograms: ProgramCard[];
+  homeVideos: (WixVideoCard & CaptionFlags)[];
   feedHighlights: FeedHighlight[];
   memberAvatars: CoachAvatar[];
   groupCards: GroupCard[];
@@ -539,7 +550,7 @@ interface ExtrasSignal {
 }
 
 function emptyExtrasSignal(): ExtrasSignal {
-  return { upcomingEvents: [], nextEventCards: [], homePrograms: [], feedHighlights: [], memberAvatars: [], groupCards: [], announcementTitle: "", postCards: [], popularDishes: [], menuCategories: [] };
+  return { upcomingEvents: [], nextEventCards: [], homePrograms: [], homeVideos: [], feedHighlights: [], memberAvatars: [], groupCards: [], announcementTitle: "", postCards: [], popularDishes: [], menuCategories: [] };
 }
 
 /** Cover URL probe for a blog post — the himi-blog-feed imageUrl fallbacks
@@ -679,6 +690,18 @@ async function fetchHomePrograms(): Promise<ProgramCard[]> {
   }
 }
 
+/** ONE Wix Video read for the videos module. A failure collapses the module; the web
+ *  bridges' refusal of the gateway also latches it off for the rest of this boot. */
+async function fetchHomeVideos(): Promise<WixVideoCard[]> {
+  try {
+    const untitled = copyParam("home.videoFallbackTitle", "Video");
+    return (await listLatestVideos({ limit: 8 })).map((entry) => videoCard(entry, untitled));
+  } catch (error) {
+    if (isWixVideoWebRefusal(error)) videoSurfaceRefused = true;
+    return [];
+  }
+}
+
 function homeFeedText(item: WixFeedItem): string {
   const blocks = item.content?.blocks;
   if (Array.isArray(blocks)) {
@@ -731,6 +754,10 @@ async function fetchExtrasSignal(arg: unknown): Promise<ExtrasSignal> {
   if (verticals.includes("programs")) {
     jobs.push(fetchHomePrograms().then((cards) => { extras.homePrograms = cards; }));
   }
+  if (verticals.includes("videos") && !videoSurfaceRefused) {
+    const caption = videoCaptionOf(paramValue(arg, "videoCaption"));
+    jobs.push(fetchHomeVideos().then((cards) => { extras.homeVideos = withCaption(cards, caption); }));
+  }
   if (verticals.includes("blog")) {
     // ONE limit-8 posts query feeds BOTH the communityPulse announcement
     // (posts[0].title — the frozen contract) and the showcaseFirst/episodeFirst
@@ -847,6 +874,7 @@ function derive(state: State): State {
     noUpcomingEvents: state.upcomingEvents.length === 0,
     noNextEvent: state.nextEventCards.length === 0,
     noHomePrograms: state.homePrograms.length === 0,
+    noHomeVideos: state.homeVideos.length === 0,
     noFeedHighlights: state.feedHighlights.length === 0,
     noMemberAvatars: state.memberAvatars.length === 0,
     noGroupCards: state.groupCards.length === 0,
@@ -938,6 +966,8 @@ function baseState(): State {
     noNextEvent: true,
     homePrograms: [],
     noHomePrograms: true,
+    homeVideos: [],
+    noHomeVideos: true,
     feedHighlights: [],
     noFeedHighlights: true,
     memberAvatars: [],

package/templates/community-club-owner/tier5-src/_shared/collection-contract.ts

@@ -98,7 +98,7 @@ export const COLLECTIONS: Record<string, CollectionConfig> = {
   himiBrandedBadges: { rows: 'badges', title: 'name', subtitle: 'description', view: 'grid' },
   himiBrandedDonations: { rows: 'campaigns', title: 'name', subtitle: 'description', view: 'grid', primaryVerb: { label: 'Donate' } },
   himiBrandedGiftCards: { rows: 'cards', title: 'name', subtitle: 'description', view: 'grid' },
-  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'description', view: 'grid' },
+  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'subtitle', image: 'coverUrl', view: 'grid', searchPlaceholder: 'Search channels', countNoun: ['channel', 'channels'] },
   himiBrandedPodcasts: { rows: 'episodes', title: 'title', subtitle: 'subtitle', image: 'image', metadata: ['progressLabel'], view: 'list' },
   himiBrandedForms: { rows: 'forms', title: 'name', subtitle: 'description', view: 'list' },
   himiBrandedGalleries: { rows: 'galleries', title: 'name', subtitle: 'description', image: 'image', view: 'grid' },

package/templates/events-meetups/tier5-src/_shared/collection-contract.ts

@@ -98,7 +98,7 @@ export const COLLECTIONS: Record<string, CollectionConfig> = {
   himiBrandedBadges: { rows: 'badges', title: 'name', subtitle: 'description', view: 'grid' },
   himiBrandedDonations: { rows: 'campaigns', title: 'name', subtitle: 'description', view: 'grid', primaryVerb: { label: 'Donate' } },
   himiBrandedGiftCards: { rows: 'cards', title: 'name', subtitle: 'description', view: 'grid' },
-  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'description', view: 'grid' },
+  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'subtitle', image: 'coverUrl', view: 'grid', searchPlaceholder: 'Search channels', countNoun: ['channel', 'channels'] },
   himiBrandedPodcasts: { rows: 'episodes', title: 'title', subtitle: 'subtitle', image: 'image', metadata: ['progressLabel'], view: 'list' },
   himiBrandedForms: { rows: 'forms', title: 'name', subtitle: 'description', view: 'list' },
   himiBrandedGalleries: { rows: 'galleries', title: 'name', subtitle: 'description', image: 'image', view: 'grid' },

package/templates/events-meetups/tier5-src/_shared/video-caption.ts

@@ -0,0 +1,21 @@
+// The video carousel's two looks: the caption ON the cover (a brand label chip over the
+// image) or UNDER it. Every slide carries both placements; the descriptor's
+// `videoCaption` appear param picks one, and these flags hide the other
+// (`hiddenWhen` hides on TRUE). So a screen switches look by changing ONE param,
+// with no second carousel and no change to the slide tree.
+export type VideoCaption = "overlay" | "below";
+
+/** The placement a param asks for. Anything but "below" is the default, "overlay". */
+export function videoCaptionOf(value: unknown): VideoCaption {
+  return value === "below" ? "below" : "overlay";
+}
+
+export interface CaptionFlags {
+  captionOnImage: boolean;
+  captionBelow: boolean;
+}
+
+/** Stamp each card with the gates its slide reads (`$item.captionOnImage` / `$item.captionBelow`). */
+export function withCaption<T extends object>(cards: T[], caption: VideoCaption): (T & CaptionFlags)[] {
+  return cards.map((card) => ({ ...card, captionOnImage: caption === "overlay", captionBelow: caption === "below" }));
+}

package/templates/events-meetups/tier5-src/himi-branded-lite-home/index.ts

@@ -22,12 +22,18 @@ import { formatDateMedium } from "../_shared/engine-intl.js";
 import { readSavedProducts, type SavedProduct } from "../_shared/himi-store-saved.js";
 import { readSavedIds } from "../_shared/himi-blog-saved.js";
 import { wixMediaUrl } from "@himalaya/wix-media";
+import { isWixVideoWebRefusal, listLatestVideos, videoCard, type WixVideoCard } from "@himalaya/wix-video";
+import { videoCaptionOf, withCaption, type CaptionFlags } from "../_shared/video-caption.js";
 
 /** Latched once the member feed is refused because of WHERE the app is running rather
  *  than because of the request — see the catch in `loadExtras`. Module scope, so it
  *  survives every refresh of this worker and is reset only by a fresh boot. */
 let feedSurfaceRefused = false;
 
+/** The same latch for Wix Video: its gateway is reachable from the native apps only, so a
+ *  web bridge's refusal is permanent for this boot and the rail stays collapsed. */
+let videoSurfaceRefused = false;
+
 /** True for the one refusal that can never change while the app keeps running: the web
  *  bridge reporting that this host is not reachable from a browser at all. Deliberately
  *  narrower than `isBridgeUnavailable` — a 502/503 is an outage worth retrying, and only
@@ -292,6 +298,10 @@ interface State {
   noNextEvent: boolean;
   homePrograms: ProgramCard[];
   noHomePrograms: boolean;
+  /** The videos module's carousel — the newest ready Wix Video videos, the channels
+   *  taking turns. Guarded on `videos`; same silent-fail contract. */
+  homeVideos: (WixVideoCard & CaptionFlags)[];
+  noHomeVideos: boolean;
   feedHighlights: FeedHighlight[];
   noFeedHighlights: boolean;
   /** communityPulse member strip — the author directory of the SAME feed read
@@ -529,6 +539,7 @@ interface ExtrasSignal {
   upcomingEvents: EventEntry[];
   nextEventCards: NextEventCard[];
   homePrograms: ProgramCard[];
+  homeVideos: (WixVideoCard & CaptionFlags)[];
   feedHighlights: FeedHighlight[];
   memberAvatars: CoachAvatar[];
   groupCards: GroupCard[];
@@ -539,7 +550,7 @@ interface ExtrasSignal {
 }
 
 function emptyExtrasSignal(): ExtrasSignal {
-  return { upcomingEvents: [], nextEventCards: [], homePrograms: [], feedHighlights: [], memberAvatars: [], groupCards: [], announcementTitle: "", postCards: [], popularDishes: [], menuCategories: [] };
+  return { upcomingEvents: [], nextEventCards: [], homePrograms: [], homeVideos: [], feedHighlights: [], memberAvatars: [], groupCards: [], announcementTitle: "", postCards: [], popularDishes: [], menuCategories: [] };
 }
 
 /** Cover URL probe for a blog post — the himi-blog-feed imageUrl fallbacks
@@ -679,6 +690,18 @@ async function fetchHomePrograms(): Promise<ProgramCard[]> {
   }
 }
 
+/** ONE Wix Video read for the videos module. A failure collapses the module; the web
+ *  bridges' refusal of the gateway also latches it off for the rest of this boot. */
+async function fetchHomeVideos(): Promise<WixVideoCard[]> {
+  try {
+    const untitled = copyParam("home.videoFallbackTitle", "Video");
+    return (await listLatestVideos({ limit: 8 })).map((entry) => videoCard(entry, untitled));
+  } catch (error) {
+    if (isWixVideoWebRefusal(error)) videoSurfaceRefused = true;
+    return [];
+  }
+}
+
 function homeFeedText(item: WixFeedItem): string {
   const blocks = item.content?.blocks;
   if (Array.isArray(blocks)) {
@@ -731,6 +754,10 @@ async function fetchExtrasSignal(arg: unknown): Promise<ExtrasSignal> {
   if (verticals.includes("programs")) {
     jobs.push(fetchHomePrograms().then((cards) => { extras.homePrograms = cards; }));
   }
+  if (verticals.includes("videos") && !videoSurfaceRefused) {
+    const caption = videoCaptionOf(paramValue(arg, "videoCaption"));
+    jobs.push(fetchHomeVideos().then((cards) => { extras.homeVideos = withCaption(cards, caption); }));
+  }
   if (verticals.includes("blog")) {
     // ONE limit-8 posts query feeds BOTH the communityPulse announcement
     // (posts[0].title — the frozen contract) and the showcaseFirst/episodeFirst
@@ -847,6 +874,7 @@ function derive(state: State): State {
     noUpcomingEvents: state.upcomingEvents.length === 0,
     noNextEvent: state.nextEventCards.length === 0,
     noHomePrograms: state.homePrograms.length === 0,
+    noHomeVideos: state.homeVideos.length === 0,
     noFeedHighlights: state.feedHighlights.length === 0,
     noMemberAvatars: state.memberAvatars.length === 0,
     noGroupCards: state.groupCards.length === 0,
@@ -938,6 +966,8 @@ function baseState(): State {
     noNextEvent: true,
     homePrograms: [],
     noHomePrograms: true,
+    homeVideos: [],
+    noHomeVideos: true,
     feedHighlights: [],
     noFeedHighlights: true,
     memberAvatars: [],

package/templates/events-meetups-owner/tier5-src/_shared/collection-contract.ts

@@ -98,7 +98,7 @@ export const COLLECTIONS: Record<string, CollectionConfig> = {
   himiBrandedBadges: { rows: 'badges', title: 'name', subtitle: 'description', view: 'grid' },
   himiBrandedDonations: { rows: 'campaigns', title: 'name', subtitle: 'description', view: 'grid', primaryVerb: { label: 'Donate' } },
   himiBrandedGiftCards: { rows: 'cards', title: 'name', subtitle: 'description', view: 'grid' },
-  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'description', view: 'grid' },
+  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'subtitle', image: 'coverUrl', view: 'grid', searchPlaceholder: 'Search channels', countNoun: ['channel', 'channels'] },
   himiBrandedPodcasts: { rows: 'episodes', title: 'title', subtitle: 'subtitle', image: 'image', metadata: ['progressLabel'], view: 'list' },
   himiBrandedForms: { rows: 'forms', title: 'name', subtitle: 'description', view: 'list' },
   himiBrandedGalleries: { rows: 'galleries', title: 'name', subtitle: 'description', image: 'image', view: 'grid' },

package/templates/gym-fitness/tier5-src/_shared/collection-contract.ts

@@ -98,7 +98,7 @@ export const COLLECTIONS: Record<string, CollectionConfig> = {
   himiBrandedBadges: { rows: 'badges', title: 'name', subtitle: 'description', view: 'grid' },
   himiBrandedDonations: { rows: 'campaigns', title: 'name', subtitle: 'description', view: 'grid', primaryVerb: { label: 'Donate' } },
   himiBrandedGiftCards: { rows: 'cards', title: 'name', subtitle: 'description', view: 'grid' },
-  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'description', view: 'grid' },
+  himiBrandedVideos: { rows: 'channels', title: 'title', subtitle: 'subtitle', image: 'coverUrl', view: 'grid', searchPlaceholder: 'Search channels', countNoun: ['channel', 'channels'] },
   himiBrandedPodcasts: { rows: 'episodes', title: 'title', subtitle: 'subtitle', image: 'image', metadata: ['progressLabel'], view: 'list' },
   himiBrandedForms: { rows: 'forms', title: 'name', subtitle: 'description', view: 'list' },
   himiBrandedGalleries: { rows: 'galleries', title: 'name', subtitle: 'description', image: 'image', view: 'grid' },