@wix/himalaya-cli 0.1614.0 → 0.1615.0

package/templates/salon-spa/tier5-src/himi-branded-lite-galleries/index.ts

@@ -0,0 +1,282 @@
+// himi-branded-lite-galleries — branded-lite page galleries and Wix Pro Gallery.
+//
+// Published Gallery page photos are carried by site analyze in the descriptor and
+// displayed without a Pro Gallery request. Sites with no page gallery use the Wix
+// API gateway: the list takes each gallery's first item as its cover, and opening a
+// gateway gallery reads its items. Failed reads remain errors; sample data is explicit
+// preview only.
+//
+import { defineService } from "../_shared/collection-service.js";
+import { get as getAppInfo } from "@himalaya/app-info";
+import { LOADING, loaded, loadFailed, type LoadCopy, type LoadFlags } from "../_shared/branded-load-state.js";
+import { isNotFoundError, presence, type PresenceFlags } from "../_shared/detail-presence.js";
+import { wixMediaUrl } from "@himalaya/wix-media";
+
+const GALLERIES_PATH = "/progallery/v2/galleries";
+const LEGACY_GALLERIES_URL =
+  "https://www.wix.com/_api/photography-one-app-viewer/galleries?itemsPerGallery=1&offset=0&limit=30&withHidden=false&useNew=true";
+const PAGE_SIZE = 10; // API maximum. Keep the prior screen's 30-gallery cap.
+const MAX_GALLERIES = 30;
+
+type WixApi = { call: (m: string, p: string, b?: unknown, h?: Record<string, string>) => Promise<unknown> };
+function wixApi(): WixApi | null {
+  return (globalThis as { himalaya?: { wixApi?: WixApi } }).himalaya?.wixApi ?? null;
+}
+
+interface RawItem { id?: unknown; title?: unknown; image?: { imageInfo?: unknown } }
+interface RawGallery { id: string; name?: string; totalItems?: number; totalItemsCount?: number; items?: RawItem[]; source?: "gateway" | "legacy" }
+interface StaticGallery { id: string; title: string; photos: string[] }
+/** `source`: which route listed the gallery. Only a GATEWAY gallery can be opened live by id —
+ *  a legacy row's id (or a synthesized `gallery-<n>`) is unknown to the gateway. */
+interface Row { id: string; title: string; subtitle: string; name: string; description: string; image: string; noCover: boolean; hasCover: boolean; source: "gateway" | "legacy" | "page" }
+interface PhotoRow { id: string; url: string; title: string }
+interface S extends LoadFlags, PresenceFlags {
+  galleries: Row[]; emptyText: string;
+  galleryTitle: string; photos: PhotoRow[]; photoUrl: string; photoTitle: string; noGallery: boolean; hasPhotos: boolean; hasPhoto: boolean; noPhoto: 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
+   *  customer has no content. */
+  notMockEmpty: boolean; notMockUnavailable: boolean;
+}
+
+function input(key: string): string {
+  const value = (globalThis as { himalaya?: { input?: Record<string, unknown> } }).himalaya?.input?.[key];
+  return typeof value === "string" ? value : "";
+}
+
+function parseStaticGalleries(raw: unknown): StaticGallery[] {
+  const parsed: unknown = typeof raw === "string" ? JSON.parse(raw) : raw;
+  if (parsed == null) return [];
+  if (!Array.isArray(parsed)) throw new Error("Malformed imported galleries");
+  let remaining = 50;
+  return parsed.slice(0, 10).flatMap((item): StaticGallery[] => {
+    if (!remaining) return [];
+    if (!item || typeof item !== "object") return [];
+    const gallery = item as Partial<StaticGallery>;
+    if (typeof gallery.id !== "string" || typeof gallery.title !== "string" || !Array.isArray(gallery.photos)) return [];
+    const photos = gallery.photos.filter((url): url is string => typeof url === "string" && /^https:\/\/static\.wixstatic\.com\/media\/[A-Za-z0-9_~.-]+$/.test(url)).slice(0, remaining);
+    remaining -= photos.length;
+    return photos.length ? [{ id: gallery.id, title: gallery.title, photos }] : [];
+  });
+}
+
+let staticGalleries: StaticGallery[] = [];
+/** The gateway gallery open on screen: each `open` counts up, and a read answers for its own. */
+let openSeq = 0;
+type PhotosRead = { seq: number; title?: string; photos?: PhotoRow[] } | { seq: number; error: unknown };
+
+/** A Pro Gallery image item's URL. `imageInfo` is either a Wix media object (`{ id, url }`,
+ *  where `url` may be the bare media id) or a `wix:image://` string; anything else is "". */
+function itemUrl(item: RawItem | undefined): string {
+  const info = item?.image?.imageInfo;
+  if (typeof info === "string") return wixMediaUrl(info);
+  if (!info || typeof info !== "object") return "";
+  const media = info as { url?: unknown; id?: unknown };
+  return wixMediaUrl(media.url) || wixMediaUrl(media.id);
+}
+
+function norm(g: RawGallery, i: number): Row {
+  const title = (g.name || "").trim() || `Gallery ${i + 1}`;
+  const n = g.totalItems ?? g.totalItemsCount ?? 0;
+  const subtitle = n ? (n === 1 ? "1 photo" : `${n} photos`) : "";
+  // The list asks for one item per gallery (itemLimit=1): that item is the cover.
+  const image = itemUrl(Array.isArray(g.items) ? g.items[0] : undefined);
+  return { id: g.id, title, subtitle, name: title, description: subtitle, image, noCover: !image, hasCover: !!image, source: g.source ?? "gateway" };
+}
+
+/** A gateway gallery's photos, in the gallery's own order, page by page (`itemOffset` /
+ *  `itemLimit`; `totalItems` says when to stop — `offset`/`limit` are ignored on this route).
+ *  Capped so a huge gallery cannot stall the screen. Video and text items carry no image and
+ *  are skipped. */
+const ITEM_PAGE = 100, ITEM_MAX = 500;
+async function readGalleryPhotos(api: WixApi, id: string): Promise<{ title: string; photos: PhotoRow[] }> {
+  let name: unknown = "";
+  const items: RawItem[] = [];
+  for (let offset = 0; offset < ITEM_MAX; offset += ITEM_PAGE) {
+    const res = await api.call("GET", `${GALLERIES_PATH}/${encodeURIComponent(id)}?itemOffset=${offset}&itemLimit=${ITEM_PAGE}`) as { gallery?: { name?: unknown; items?: unknown; totalItems?: unknown } } | null;
+    const gallery = res?.gallery;
+    if (!gallery || typeof gallery !== "object") throw new Error("Malformed Pro Gallery response");
+    if (offset === 0) name = gallery.name;
+    const page = Array.isArray(gallery.items) ? gallery.items as RawItem[] : [];
+    items.push(...page);
+    const total = typeof gallery.totalItems === "number" ? gallery.totalItems : undefined;
+    if (page.length < ITEM_PAGE || (total !== undefined && items.length >= total)) break;
+  }
+  const photos = items.flatMap((item, index): PhotoRow[] => {
+    // The original media URL, like a page gallery's: the photo viewer (`view`) accepts only
+    // that form, and the renderer sizes the image to its slot.
+    const url = itemUrl(item).replace(/\/v1\/.*$/, "");
+    if (!url) return [];
+    const title = typeof item.title === "string" && item.title.trim() ? item.title.trim() : `Photo ${index + 1}`;
+    return [{ id: typeof item.id === "string" && item.id ? item.id : `${id}-${index}`, url, title }];
+  });
+  return { title: typeof name === "string" ? name.trim() : "", photos };
+}
+
+async function readGalleries(api: WixApi): Promise<RawGallery[]> {
+  const all: RawGallery[] = [];
+  for (let offset = 0; offset < MAX_GALLERIES; offset += PAGE_SIZE) {
+    const res = await api.call("GET", `${GALLERIES_PATH}?itemLimit=1&offset=${offset}&limit=${PAGE_SIZE}`) as unknown;
+    const page = (res as { galleries?: unknown } | null)?.galleries;
+    if (!Array.isArray(page) || page.some((g) => !g || typeof g.id !== "string" || !g.id)) {
+      throw new Error("Malformed Pro Gallery list response");
+    }
+    all.push(...page as RawGallery[]);
+    const total = (res as { totalGalleries?: unknown }).totalGalleries;
+    if (page.length < PAGE_SIZE || (typeof total === "number" && all.length >= total)) break;
+  }
+  return all;
+}
+
+async function readLegacyGalleries(api: WixApi): Promise<RawGallery[]> {
+  const res = await api.call("GET", LEGACY_GALLERIES_URL) as unknown;
+  const raw = Array.isArray(res) ? res :
+    (res as { galleries?: unknown; data?: { galleries?: unknown } } | null)?.galleries ??
+    (res as { data?: { galleries?: unknown } } | null)?.data?.galleries;
+  if (!Array.isArray(raw)) throw new Error("Malformed legacy Pro Gallery list response");
+  return raw.map((gallery, index) => {
+    if (!gallery || typeof gallery !== "object") throw new Error("Malformed legacy Pro Gallery row");
+    const row = gallery as Partial<RawGallery>;
+    return { ...row, id: typeof row.id === "string" && row.id ? row.id : `gallery-${index}`, source: "legacy" as const };
+  });
+}
+
+async function readCompatibleGalleries(api: WixApi): Promise<RawGallery[]> {
+  // The old absolute host is supported by native Wix transports, but the
+  // published web bridge refuses it as webwix_owner_only.
+  const nativeLegacyAvailable = async (): Promise<boolean> => {
+    const info = await getAppInfo().catch(() => undefined);
+    return info?.platform === "ios" || info?.platform === "android" ||
+      info?.platform === "macos" || info?.platform === "react-native";
+  };
+  try {
+    const galleries = await readGalleries(api);
+    if (galleries.length) return galleries;
+    if (!(await nativeLegacyAvailable())) return galleries;
+    // A native site's older Pro Gallery app can have content even when the gateway
+    // reports none. Keep the gateway's honest empty result if the old route is blocked.
+    try {
+      const legacy = await readLegacyGalleries(api);
+      return legacy.length ? legacy : galleries;
+    } catch { return galleries; }
+  } catch (gatewayError) {
+    if (!(await nativeLegacyAvailable())) throw gatewayError;
+    try { return await readLegacyGalleries(api); }
+    catch { throw gatewayError; }
+  }
+}
+
+const MOCK: Row[] = [
+  { id: "sample-work",   title: "Our Work",     subtitle: "24 photos", name: "Our Work", description: "24 photos", image: "", noCover: true, hasCover: false, source: "page" },
+  { id: "sample-events", title: "Events",       subtitle: "48 photos", name: "Events", description: "48 photos", image: "", noCover: true, hasCover: false, source: "page" },
+  { id: "sample-team",   title: "The Team",     subtitle: "9 photos", name: "The Team", description: "9 photos", image: "", noCover: true, hasCover: false, source: "page" },
+];
+
+/** sample rows reach the screen ONLY in the host's explicit sample preview;
+ *  a failed or empty query is an honest error / empty state (branded-load-state.ts). */
+const COPY: LoadCopy<Row> = {
+  prefix: "galleries",
+  empty: "No galleries yet — check back soon.",
+  error: "Galleries couldn't be loaded.",
+  signIn: "Sign in to see galleries.",
+  sample: () => MOCK.map((r) => ({ ...r })),
+};
+
+/** The newest state, for an action that answers after an await (`s` is from before it). */
+const current = (s: S): S => (svc.getState?.() as S | undefined) ?? s;
+
+const svc = defineService<S, {
+  load: (s: S, arg?: { staticGalleries?: unknown }) => Promise<S>;
+  open: (s: S, arg?: { staticGalleries?: unknown }) => S;
+  photosRead: (s: S, arg?: PhotosRead) => S | undefined;
+  view: (s: S) => S;
+}>("himiBrandedGalleries", {
+  state: { ...LOADING, ...presence("loading"), galleries: [], emptyText: "", galleryTitle: "", photos: [], photoUrl: "", photoTitle: "", noGallery: true, hasPhotos: false, hasPhoto: false, noPhoto: true },
+  actions: {
+    load: async (s, arg) => {
+      // No `openSeq` bump here: the list and a gallery never share a worker (workers are pooled by
+      // screen and input), and a host's refresh runs `load` on the gallery's own worker, where a
+      // bump would drop that gallery's read in flight and leave its screen blank.
+      try {
+        if (arg && "staticGalleries" in arg) {
+          staticGalleries = [];
+          staticGalleries = parseStaticGalleries(arg.staticGalleries);
+        }
+        if (staticGalleries.length) {
+          const rows = staticGalleries.map((gallery) => {
+            const subtitle = gallery.photos.length === 1 ? "1 photo" : `${gallery.photos.length} photos`;
+            return { id: gallery.id, title: gallery.title, subtitle, name: gallery.title, description: subtitle, image: gallery.photos[0], noCover: false, hasCover: true, source: "page" as const };
+          });
+          return { ...s, ...loaded("galleries", rows, COPY) };
+        }
+        const api = wixApi();
+        if (!api) return { ...s, ...loadFailed("galleries", new Error("Wix bridge unavailable"), COPY) };
+        const raw = await readCompatibleGalleries(api);
+        const galleries = raw.map(norm);
+        // From the state as it is NOW: on a gallery's own worker, its photos may have landed
+        // (`photosRead`) during the read, and `s` is from before it.
+        return { ...current(s), ...loaded("galleries", galleries, COPY) };
+      } catch (err) {
+        return { ...current(s), ...loadFailed("galleries", err, COPY) };
+      }
+    },
+    open: (s, arg) => {
+      // Every open, live or not, makes the reads of earlier opens stale (`photosRead` drops them):
+      // a page or legacy gallery opened after a slow gateway read must not get that read's photos.
+      const seq = ++openSeq;
+      try {
+        if (arg && "staticGalleries" in arg) {
+          staticGalleries = [];
+          staticGalleries = parseStaticGalleries(arg.staticGalleries);
+        }
+      } catch (err) {
+        return { ...s, ...loadFailed("galleries", err, COPY), ...presence("failed"), galleryTitle: "", photos: [],
+          noGallery: true, hasPhotos: false, photoUrl: "", photoTitle: "", hasPhoto: false, noPhoto: true };
+      }
+      const id = input("id");
+      const gallery = staticGalleries.find((entry) => entry.id === id);
+      // No page galleries were carried in: a gateway (Pro Gallery app) gallery is read live, but
+      // ONLY when the tap says the list row came from the gateway (`source: "gateway"`, the row's
+      // own field). A legacy row's id and a sample row's id ("sample-work") are unknown to the
+      // gateway, and a tap that passes no source (Branded Lite's) cannot tell them apart: those
+      // open as before, by their title.
+      const api = wixApi();
+      const live = input("source") === "gateway" && !/^gallery-\d+$/.test(id);
+      if (id && !staticGalleries.length && api && live) {
+        // The read lands through `photosRead`, tagged with this open: a pooled worker shows THIS
+        // gallery loading at once (never the last one's photos), and a slower read for a gallery
+        // left since is dropped instead of overwriting the one on screen.
+        const name = input("name");
+        void readGalleryPhotos(api, id).then(
+          ({ title, photos }) => svc.photosRead({ seq, title: title || name, photos }),
+          (err: unknown) => svc.photosRead({ seq, error: err }),
+        );
+        return { ...s, ...LOADING, ...presence("loading"), galleryTitle: name, photos: [], noGallery: true, hasPhotos: false,
+          photoUrl: "", photoTitle: "", hasPhoto: false, noPhoto: true };
+      }
+      const missing = !id || (staticGalleries.length > 0 && !gallery);
+      return { ...s, ...loaded("galleries", s.galleries, COPY), ...presence(missing ? "missing" : "found"), galleryTitle: gallery?.title || input("name"),
+        photos: (gallery?.photos ?? []).map((url, index) => ({ id: `${id}-${index}`, url, title: `Photo ${index + 1}` })),
+        noGallery: missing, hasPhotos: !!gallery?.photos.length, noPhoto: true };
+    },
+    photosRead: (s, arg) => {
+      if (!arg || arg.seq !== openSeq) return undefined;
+      if ("error" in arg) {
+        // A 404 is the gallery being GONE — the not-found state alone, never also an error card
+        // whose Retry cannot succeed. Any other failure is the error state.
+        return { ...s, ...(isNotFoundError(arg.error) ? { ...loaded("galleries", s.galleries, COPY), ...presence("missing") } : { ...loadFailed("galleries", arg.error, COPY), ...presence("failed") }),
+          galleryTitle: "", photos: [], noGallery: true, hasPhotos: false, photoUrl: "", photoTitle: "", hasPhoto: false, noPhoto: true };
+      }
+      return { ...s, ...loaded("galleries", s.galleries, COPY), ...presence("found"), galleryTitle: arg.title ?? "",
+        photos: arg.photos ?? [], noGallery: false, hasPhotos: (arg.photos ?? []).length > 0, photoUrl: "", photoTitle: "", hasPhoto: false, noPhoto: true };
+    },
+    view: (s) => {
+      const photoUrl = input("url");
+      const valid = /^https:\/\/static\.wixstatic\.com\/media\/[A-Za-z0-9_~.-]+$/.test(photoUrl);
+      return { ...s, ...loaded("galleries", s.galleries, COPY), ...presence(valid ? "found" : "missing"),
+        photoUrl: valid ? photoUrl : "", photoTitle: valid ? input("name") || "Gallery photo" : "", hasPhoto: valid, noPhoto: !valid };
+    },
+  },
+});
+export { svc };