@scalemule/nextjs 0.1.3 → 0.1.5

package/dist/index.mjs

@@ -1,7 +1,8 @@
+import * as React from 'react';
 import { createContext, useState, useMemo, useEffect, useCallback, useContext, useRef } from 'react';
 import { createMoneyClient } from '@scalemule/money';
 export { MoneyClient, createMoneyClient } from '@scalemule/money';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -2706,6 +2707,31 @@ var StorageService = class extends ServiceModule {
   async getInfo(fileId, options) {
     return this._get(`/files/${fileId}/info`, options);
   }
+  /**
+   * Aggregate status for a file — single call returns scan + reserved
+   * optimize/transcode slots + the canonical view URL paths for image
+   * (transform endpoint) and video (HLS playlist) MIME types.
+   *
+   * Foundational primitive for the chat / progressive media read side.
+   * `useFileStatus()` (in `@scalemule/nextjs`) consumes this for both
+   * first-paint and refresh-on-demand scenarios.
+   *
+   * `optimize` and `transcode` are reserved for Phase 3 enrichment. Until
+   * the photo/video services expose internal status endpoints, callers
+   * should attempt the constructed URLs directly to discover readiness
+   * (404 means the pipeline is still running).
+   *
+   * @example
+   * ```ts
+   * const r = await client.storage.getFileStatus(fileId);
+   * if (r.data?.scan.status === 'clean' && r.data.urls.optimized) {
+   *   // image: try transform URL for an optimized variant
+   * }
+   * ```
+   */
+  async getFileStatus(fileId, options) {
+    return this._get(`/files/${fileId}/status`, options);
+  }
   /**
    * Get a signed view URL for inline display (img src, thumbnails).
    * Returns CloudFront signed URL (fast, ~1us) or S3 presigned fallback.
@@ -8960,6 +8986,220 @@ function useMedia() {
   );
   return { upload, cancelUpload, error, uploading };
 }
+function useFileStatus(options) {
+  const { storage } = useScaleMule();
+  const { fileId, pollIntervalMs = null, disabled = false } = options;
+  const [status, setStatus] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const requestSeqRef = useRef(0);
+  const fetchStatus = useCallback(async () => {
+    if (!fileId || disabled) return;
+    const seq = ++requestSeqRef.current;
+    setLoading(true);
+    setError(null);
+    try {
+      const r = await storage.getFileStatus(fileId);
+      if (seq !== requestSeqRef.current) return;
+      if (r.error || !r.data) {
+        setError(r.error);
+        return;
+      }
+      setStatus(r.data);
+    } catch (err) {
+      if (seq !== requestSeqRef.current) return;
+      setError(err);
+    } finally {
+      if (seq === requestSeqRef.current) {
+        setLoading(false);
+      }
+    }
+  }, [storage, fileId, disabled]);
+  useEffect(() => {
+    void fetchStatus();
+  }, [fetchStatus]);
+  useEffect(() => {
+    if (!pollIntervalMs || disabled || !fileId) return;
+    const isClean = status?.scan.status === "clean";
+    if (isClean) return;
+    const id = setInterval(() => {
+      void fetchStatus();
+    }, pollIntervalMs);
+    return () => clearInterval(id);
+  }, [pollIntervalMs, disabled, fileId, status?.scan.status, fetchStatus]);
+  const isReady = status?.scan.status === "clean";
+  return { status, loading, error, isReady, refresh: fetchStatus };
+}
+function ScaleMuleMedia(props) {
+  const {
+    fileId,
+    mimeType,
+    blobPreview,
+    width,
+    height,
+    className,
+    style,
+    alt,
+    pollIntervalMs = 2e3,
+    renderPlaceholder,
+    renderBlocked,
+    renderOverride
+  } = props;
+  const { status, isReady } = useFileStatus({ fileId, pollIntervalMs });
+  const isImage = mimeType.startsWith("image/");
+  const isVideo = mimeType.startsWith("video/");
+  const isAudio = mimeType.startsWith("audio/");
+  const src = useMemo(() => {
+    const scan = status?.scan.status;
+    if (scan === "threat" || scan === "quarantined") return null;
+    if (status && isReady) {
+      if (isImage && status.urls.optimized) return status.urls.optimized;
+      if (isVideo && status.urls.hls) return status.urls.hls;
+      return status.urls.original ?? null;
+    }
+    if (blobPreview) return blobPreview;
+    return null;
+  }, [status, isReady, isImage, isVideo, blobPreview]);
+  const renderState = useMemo(() => {
+    const scan = status?.scan.status;
+    if (scan === "threat" || scan === "quarantined") return "blocked";
+    if (isReady) return "ready";
+    if (blobPreview) return "preview";
+    return "pending";
+  }, [status?.scan.status, isReady, blobPreview]);
+  const videoRef = React.useRef(null);
+  useEffect(() => {
+    if (!isVideo) return;
+    if (!src) return;
+    if (!src.endsWith(".m3u8")) return;
+    const el = videoRef.current;
+    if (!el) return;
+    if (el.canPlayType("application/vnd.apple.mpegurl")) {
+      el.src = src;
+      return;
+    }
+    let cancelled = false;
+    let hls = null;
+    void (async () => {
+      try {
+        const moduleName = "hls.js";
+        const mod = await import(
+          /* @vite-ignore */
+          /* webpackIgnore: true */
+          moduleName
+        ).catch(
+          () => null
+        );
+        if (cancelled || !mod) return;
+        const Hls = mod.default ?? mod;
+        if (Hls.isSupported()) {
+          hls = new Hls();
+          hls.loadSource(src);
+          hls.attachMedia(el);
+        } else {
+          el.src = src;
+        }
+      } catch {
+      }
+    })();
+    return () => {
+      cancelled = true;
+      if (hls) hls.destroy();
+    };
+  }, [isVideo, src]);
+  if (renderOverride) {
+    return /* @__PURE__ */ jsx(Fragment, { children: renderOverride({ src, state: renderState }) });
+  }
+  if (renderState === "blocked") {
+    return /* @__PURE__ */ jsx(Fragment, { children: renderBlocked ? renderBlocked() : /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "alert",
+        className,
+        style: { padding: 12, color: "#a00", ...style },
+        children: "This file was blocked."
+      }
+    ) });
+  }
+  if (renderState === "pending" && !src) {
+    return /* @__PURE__ */ jsx(Fragment, { children: renderPlaceholder ? renderPlaceholder() : /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "status",
+        "aria-busy": true,
+        className,
+        style: { padding: 12, color: "#666", ...style },
+        children: "Loading\u2026"
+      }
+    ) });
+  }
+  if (isImage) {
+    const finalSrc = src && status?.urls.optimized && (width || height) ? appendQuery(src, {
+      width: width ? String(width) : void 0,
+      height: height ? String(height) : void 0,
+      fit: "cover"
+    }) : src;
+    return /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: finalSrc ?? void 0,
+        alt: alt ?? "",
+        width,
+        height,
+        className,
+        style
+      }
+    );
+  }
+  if (isVideo) {
+    return /* @__PURE__ */ jsx(
+      "video",
+      {
+        ref: videoRef,
+        src: src && !src.endsWith(".m3u8") ? src : void 0,
+        controls: true,
+        playsInline: true,
+        preload: "metadata",
+        className,
+        style,
+        "aria-label": alt,
+        width,
+        height
+      }
+    );
+  }
+  if (isAudio) {
+    return /* @__PURE__ */ jsx(
+      "audio",
+      {
+        src: src ?? void 0,
+        controls: true,
+        preload: "metadata",
+        className,
+        style,
+        "aria-label": alt
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: src ?? "#",
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className,
+      style,
+      children: alt ?? "Download file"
+    }
+  );
+}
+function appendQuery(url, params) {
+  const filtered = Object.entries(params).filter(([, v]) => v != null && v !== "");
+  if (filtered.length === 0) return url;
+  const sep = url.includes("?") ? "&" : "?";
+  const qs = new URLSearchParams(filtered).toString();
+  return url + sep + qs;
+}
 
 // src/hooks/useMoney.ts
 var useMoney = useMoneyClient;
@@ -10746,4 +10986,4 @@ function createSafeLogger(prefix) {
   };
 }
 
-export { FeedbackWidget, ScaleMuleApiError, ScaleMuleClient2 as ScaleMuleClient, ScaleMuleProvider, composePhone, createClient, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useUser, validateForm, validators };
+export { FeedbackWidget, ScaleMuleApiError, ScaleMuleClient2 as ScaleMuleClient, ScaleMuleMedia, ScaleMuleProvider, composePhone, createClient, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useUser, validateForm, validators };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scalemule/nextjs",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "ScaleMule SDK for Next.js applications - authentication, storage, and user management",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -53,7 +53,7 @@
   },
   "dependencies": {
     "@scalemule/money": "^0.0.1",
-    "@scalemule/sdk": "^0.0.39"
+    "@scalemule/sdk": "^0.0.41"
   },
   "peerDependencies": {
     "next": ">=14.0.0",