@replicated/portal-components 0.0.25 → 0.0.27

package/dist/upload-support-bundle-modal.d.mts

@@ -1,23 +1,23 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { U as UploadSupportBundleResult } from './upload-with-progress-D760HthX.mjs';
 
 interface UploadSupportBundleModalProps {
     isOpen: boolean;
     onClose: () => void;
-    /** Server action to upload the support bundle */
-    uploadSupportBundle: (formData: FormData) => Promise<{
-        success: boolean;
-        error?: string;
-        bundleId?: string;
-        bundleSlug?: string;
-    }>;
+    /**
+     * Upload function with progress tracking
+     * onProgress receives percentage (0-100)
+     * signal is an AbortSignal for cancellation
+     */
+    uploadWithProgress: (file: File, appId: string, onProgress: (percent: number) => void, signal: AbortSignal) => Promise<UploadSupportBundleResult>;
     /** Callback after successful upload - performs async polling to refresh bundle list */
     onUploadSuccess: () => Promise<void>;
     appId: string;
     primaryColor?: string;
 }
 declare const UploadSupportBundleModal: {
-    ({ isOpen, onClose, uploadSupportBundle, onUploadSuccess, appId, primaryColor }: UploadSupportBundleModalProps): react_jsx_runtime.JSX.Element | null;
+    ({ isOpen, onClose, uploadWithProgress, onUploadSuccess, appId, primaryColor }: UploadSupportBundleModalProps): react_jsx_runtime.JSX.Element | null;
     displayName: string;
 };
 
-export { UploadSupportBundleModal };
+export { UploadSupportBundleModal, UploadSupportBundleResult };

package/dist/upload-support-bundle-modal.d.ts

@@ -1,23 +1,23 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { U as UploadSupportBundleResult } from './upload-with-progress-D760HthX.js';
 
 interface UploadSupportBundleModalProps {
     isOpen: boolean;
     onClose: () => void;
-    /** Server action to upload the support bundle */
-    uploadSupportBundle: (formData: FormData) => Promise<{
-        success: boolean;
-        error?: string;
-        bundleId?: string;
-        bundleSlug?: string;
-    }>;
+    /**
+     * Upload function with progress tracking
+     * onProgress receives percentage (0-100)
+     * signal is an AbortSignal for cancellation
+     */
+    uploadWithProgress: (file: File, appId: string, onProgress: (percent: number) => void, signal: AbortSignal) => Promise<UploadSupportBundleResult>;
     /** Callback after successful upload - performs async polling to refresh bundle list */
     onUploadSuccess: () => Promise<void>;
     appId: string;
     primaryColor?: string;
 }
 declare const UploadSupportBundleModal: {
-    ({ isOpen, onClose, uploadSupportBundle, onUploadSuccess, appId, primaryColor }: UploadSupportBundleModalProps): react_jsx_runtime.JSX.Element | null;
+    ({ isOpen, onClose, uploadWithProgress, onUploadSuccess, appId, primaryColor }: UploadSupportBundleModalProps): react_jsx_runtime.JSX.Element | null;
     displayName: string;
 };
 
-export { UploadSupportBundleModal };
+export { UploadSupportBundleModal, UploadSupportBundleResult };

package/dist/upload-support-bundle-modal.js

@@ -24,20 +24,27 @@ var DEFAULT_PRIMARY_COLOR = "#4f46e5";
 var UploadSupportBundleModal = ({
   isOpen,
   onClose,
-  uploadSupportBundle,
+  uploadWithProgress,
   onUploadSuccess,
   appId,
   primaryColor = DEFAULT_PRIMARY_COLOR
 }) => {
   const [selectedFile, setSelectedFile] = react.useState(null);
   const [isUploading, setIsUploading] = react.useState(false);
+  const [uploadProgress, setUploadProgress] = react.useState(0);
   const [error, setError] = react.useState(null);
+  const [abortController, setAbortController] = react.useState(null);
   const fileInputRef = react.useRef(null);
   react.useEffect(() => {
     if (!isOpen) {
       setSelectedFile(null);
       setIsUploading(false);
+      setUploadProgress(0);
       setError(null);
+      setAbortController((prev) => {
+        prev?.abort();
+        return null;
+      });
     }
   }, [isOpen]);
   const handleFileChange = react.useCallback((event) => {
@@ -54,30 +61,38 @@ var UploadSupportBundleModal = ({
     if (!selectedFile || !appId) return;
     setError(null);
     setIsUploading(true);
+    setUploadProgress(0);
     try {
-      const formData = new FormData();
-      formData.append("file", selectedFile);
-      formData.append("appId", appId);
-      const result = await uploadSupportBundle(formData);
+      const controller = new AbortController();
+      setAbortController(controller);
+      const result = await uploadWithProgress(
+        selectedFile,
+        appId,
+        setUploadProgress,
+        controller.signal
+      );
       if (!result.success) {
         throw new Error(result.error ?? "Failed to upload support bundle");
       }
       await onUploadSuccess();
       onClose();
     } catch (err) {
-      console.error("Upload error:", err);
-      setError(err instanceof Error ? err.message : "Upload failed");
+      if (err instanceof Error && err.message !== "Upload cancelled") {
+        console.error("Upload error:", err);
+        setError(err.message);
+      }
     } finally {
       setIsUploading(false);
+      setUploadProgress(0);
+      setAbortController(null);
     }
-  }, [selectedFile, appId, uploadSupportBundle, onUploadSuccess, onClose]);
+  }, [selectedFile, appId, uploadWithProgress, onUploadSuccess, onClose]);
   const handleCancel = react.useCallback(() => {
-    if (isUploading) {
-      setError("Upload cannot be cancelled once started");
-      return;
+    if (isUploading && abortController) {
+      abortController.abort();
     }
     onClose();
-  }, [isUploading, onClose]);
+  }, [isUploading, abortController, onClose]);
   const handleBackdropClick = react.useCallback((e) => {
     if (e.target === e.currentTarget && !isUploading) {
       onClose();
@@ -113,9 +128,24 @@ var UploadSupportBundleModal = ({
           ] })
         ] }),
         error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 rounded-lg bg-red-50 px-3 py-2 text-sm text-red-700", children: error }),
-        isUploading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6 mb-6 flex items-center justify-center gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-5 w-5 animate-spin rounded-full border-2 border-gray-300 border-t-transparent", style: { borderTopColor: primaryColor } }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-700", children: "Uploading support bundle..." })
+        isUploading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6 mb-6", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-700", children: "Uploading support bundle..." }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-medium text-gray-900", children: [
+              uploadProgress,
+              "%"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full bg-gray-200 rounded-full h-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "h-2 rounded-full transition-all duration-300",
+              style: {
+                width: `${uploadProgress}%`,
+                backgroundColor: primaryColor || "#3B82F6"
+              }
+            }
+          ) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6 flex justify-end gap-3", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -124,7 +154,7 @@ var UploadSupportBundleModal = ({
               type: "button",
               onClick: handleCancel,
               className: "rounded-lg px-4 py-2 text-sm font-medium text-gray-600 transition hover:bg-gray-100",
-              children: isUploading ? "Cancel Upload" : "Cancel"
+              children: isUploading && abortController ? "Cancel Upload" : "Cancel"
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(

package/dist/upload-support-bundle-modal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/format.ts","../src/utils/constants.ts","../src/components/upload-support-bundle-modal.tsx"],"names":["useState","useRef","useEffect","useCallback","jsx","jsxs"],"mappings":"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","file":"upload-support-bundle-modal.js","sourcesContent":["/**\n * Format bytes to human-readable string\n * @param bytes - Number of bytes\n * @param decimals - Number of decimal places (default: 1)\n * @returns Formatted string (e.g., \"1.5 MB\")\n */\nexport function formatBytes(bytes: number, decimals = 1): string {\n  if (bytes === 0) return \"0 Bytes\";\n\n  const k = 1024;\n  const dm = decimals < 0 ? 0 : decimals;\n  const sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n\n  const i = Math.floor(Math.log(bytes) / Math.log(k));\n\n  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;\n}\n\n/**\n * Format date string to short numeric date (no time)\n * @param dateString - ISO date string or null/undefined\n * @returns Formatted string (e.g., \"01/27/2026\") or \"Never\" if no date\n */\nexport function formatDateShort(dateString?: string | null): string {\n  if (!dateString) return \"Never\";\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n  return date.toLocaleDateString(\"en-US\", {\n    year: \"numeric\",\n    month: \"2-digit\",\n    day: \"2-digit\"\n  });\n}\n\n/**\n * Format date string to human-readable local timestamp\n * @param dateString - ISO date string or null/undefined\n * @returns Formatted string (e.g., \"Jan 27, 2026, 10:32 PM\") or \"Never\" if no date\n */\nexport function formatDate(dateString?: string | null): string {\n  if (!dateString) return \"Never\";\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n  return date.toLocaleDateString(\"en-US\", {\n    month: \"short\",\n    day: \"numeric\",\n    year: \"numeric\",\n    hour: \"numeric\",\n    minute: \"2-digit\",\n    hour12: true\n  });\n}\n\n/**\n * Format date string to human-readable UTC timestamp\n * @param dateString - ISO date string\n * @returns Formatted string (e.g., \"01/27/2026, 22:32:39 UTC\")\n */\nexport function formatDateTime(dateString: string): string {\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n  return date.toLocaleString(\"en-US\", {\n    timeZone: \"UTC\",\n    year: \"numeric\",\n    month: \"2-digit\",\n    day: \"2-digit\",\n    hour: \"2-digit\",\n    minute: \"2-digit\",\n    second: \"2-digit\",\n    hour12: false\n  }) + \" UTC\";\n}\n\n/**\n * Format date string to user-friendly local timestamp with 12-hour time\n * @param dateString - ISO date string or null/undefined\n * @returns Formatted string (e.g., \"1/27/2026, 10:32 PM\") or \"N/A\" if not provided\n */\nexport function formatDateTimeLocal(dateString?: string | null): string {\n  if (!dateString) return \"N/A\";\n\n  try {\n    const date = new Date(dateString);\n    if (isNaN(date.getTime())) {\n      return dateString;\n    }\n    return date.toLocaleDateString(\"en-US\", {\n      month: \"numeric\",\n      day: \"numeric\",\n      year: \"numeric\",\n      hour: \"numeric\",\n      minute: \"2-digit\",\n      hour12: true\n    });\n  } catch {\n    return \"N/A\";\n  }\n}\n","/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { formatBytes } from \"../utils/format\";\nimport { DEFAULT_PRIMARY_COLOR } from \"../utils/constants\";\n\ninterface UploadSupportBundleModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  /** Server action to upload the support bundle */\n  uploadSupportBundle: (formData: FormData) => Promise<{ \n    success: boolean; \n    error?: string; \n    bundleId?: string;\n    bundleSlug?: string;\n  }>;\n  /** Callback after successful upload - performs async polling to refresh bundle list */\n  onUploadSuccess: () => Promise<void>;\n  appId: string;\n  primaryColor?: string;\n}\n\nexport const UploadSupportBundleModal = ({\n  isOpen,\n  onClose,\n  uploadSupportBundle,\n  onUploadSuccess,\n  appId,\n  primaryColor = DEFAULT_PRIMARY_COLOR\n}: UploadSupportBundleModalProps) => {\n  const [selectedFile, setSelectedFile] = useState<File | null>(null);\n  const [isUploading, setIsUploading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n\n  // Reset state when modal opens/closes\n  useEffect(() => {\n    if (!isOpen) {\n      setSelectedFile(null);\n      setIsUploading(false);\n      setError(null);\n    }\n  }, [isOpen]);\n\n  const handleFileChange = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n    const file = event.target.files?.[0];\n    if (!file) return;\n\n    if (!file.name.endsWith(\".tgz\") && !file.name.endsWith(\".tar.gz\")) {\n      setError(\"Invalid file type. Please select a .tgz or .tar.gz file.\");\n      return;\n    }\n\n    setError(null);\n    setSelectedFile(file);\n  }, []);\n\n  const handleUpload = useCallback(async () => {\n    if (!selectedFile || !appId) return;\n\n    setError(null);\n    setIsUploading(true);\n\n    try {\n      // Create FormData to send to server action\n      const formData = new FormData();\n      formData.append(\"file\", selectedFile);\n      formData.append(\"appId\", appId);\n\n      // Upload via server action (streams to Enterprise Portal API)\n      const result = await uploadSupportBundle(formData);\n\n      if (!result.success) {\n        throw new Error(result.error ?? \"Failed to upload support bundle\");\n      }\n\n      // Success - notify parent and wait for polling to complete\n      await onUploadSuccess();\n      onClose();\n    } catch (err) {\n      console.error(\"Upload error:\", err);\n      setError(err instanceof Error ? err.message : \"Upload failed\");\n    } finally {\n      setIsUploading(false);\n    }\n  }, [selectedFile, appId, uploadSupportBundle, onUploadSuccess, onClose]);\n\n  const handleCancel = useCallback(() => {\n    // Note: Cannot abort server action once started\n    if (isUploading) {\n      setError(\"Upload cannot be cancelled once started\");\n      return;\n    }\n    onClose();\n  }, [isUploading, onClose]);\n\n  const handleBackdropClick = useCallback((e: React.MouseEvent) => {\n    if (e.target === e.currentTarget && !isUploading) {\n      onClose();\n    }\n  }, [isUploading, onClose]);\n\n  if (!isOpen) return null;\n\n  return (\n    <div\n      className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50\"\n      onClick={handleBackdropClick}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby=\"upload-modal-title\"\n    >\n      <div className=\"w-full max-w-md rounded-2xl bg-white p-6 shadow-xl\">\n        <h2 id=\"upload-modal-title\" className=\"text-lg font-semibold text-gray-900\">\n          Upload Support Bundle\n        </h2>\n\n        <div className=\"mt-4\">\n          <label className=\"block text-sm font-medium text-gray-700\">\n            Select Support Bundle\n          </label>\n          <input\n            ref={fileInputRef}\n            type=\"file\"\n            accept=\".tgz,.tar.gz,application/gzip,application/x-gzip\"\n            onChange={handleFileChange}\n            disabled={isUploading}\n            className=\"mt-2 block w-full text-sm text-gray-500 file:mr-4 file:rounded-lg file:border-0 file:bg-gray-100 file:px-4 file:py-2 file:text-sm file:font-medium file:text-gray-700 hover:file:bg-gray-200 disabled:opacity-50\"\n          />\n          {selectedFile && (\n            <div className=\"mt-3 flex items-center justify-between rounded-lg bg-gray-50 px-3 py-2 text-sm\">\n              <span className=\"truncate text-gray-700\">{selectedFile.name}</span>\n              <span className=\"ml-2 shrink-0 text-gray-500\">{formatBytes(selectedFile.size)}</span>\n            </div>\n          )}\n        </div>\n\n        {error && (\n          <div className=\"mt-4 rounded-lg bg-red-50 px-3 py-2 text-sm text-red-700\">\n            {error}\n          </div>\n        )}\n\n        {isUploading && (\n          <div className=\"mt-6 mb-6 flex items-center justify-center gap-3\">\n            <div className=\"h-5 w-5 animate-spin rounded-full border-2 border-gray-300 border-t-transparent\" style={{ borderTopColor: primaryColor }} />\n            <span className=\"text-sm font-medium text-gray-700\">\n              Uploading support bundle...\n            </span>\n          </div>\n        )}\n\n        <div className=\"mt-6 flex justify-end gap-3\">\n          <button\n            type=\"button\"\n            onClick={handleCancel}\n            className=\"rounded-lg px-4 py-2 text-sm font-medium text-gray-600 transition hover:bg-gray-100\"\n          >\n            {isUploading ? \"Cancel Upload\" : \"Cancel\"}\n          </button>\n          <button\n            type=\"button\"\n            onClick={handleUpload}\n            disabled={!selectedFile || isUploading}\n            className=\"rounded-lg px-4 py-2 text-sm font-medium text-white transition-opacity duration-200 hover:opacity-90 disabled:opacity-50\"\n            style={{ backgroundColor: primaryColor }}\n          >\n            {isUploading ? \"Uploading...\" : \"Upload\"}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nUploadSupportBundleModal.displayName = \"UploadSupportBundleModal\";\n"]}
+{"version":3,"sources":["../src/utils/format.ts","../src/utils/constants.ts","../src/components/upload-support-bundle-modal.tsx"],"names":["useState","useRef","useEffect","useCallback","jsx","jsxs"],"mappings":";;;;;;;;;;;AAMO,SAAS,WAAA,CAAY,KAAA,EAAe,QAAA,GAAW,CAAA,EAAW;AAC/D,EAAA,IAAI,KAAA,KAAU,GAAG,OAAO,SAAA;AAExB,EAAA,MAAM,CAAA,GAAI,IAAA;AACV,EAAA,MAAM,EAAA,GAAK,QAAA,GAAW,CAAA,GAAI,CAAA,GAAI,QAAA;AAC9B,EAAA,MAAM,QAAQ,CAAC,OAAA,EAAS,IAAA,EAAM,IAAA,EAAM,MAAM,IAAI,CAAA;AAE9C,EAAA,MAAM,CAAA,GAAI,IAAA,CAAK,KAAA,CAAM,IAAA,CAAK,GAAA,CAAI,KAAK,CAAA,GAAI,IAAA,CAAK,GAAA,CAAI,CAAC,CAAC,CAAA;AAElD,EAAA,OAAO,CAAA,EAAG,UAAA,CAAA,CAAY,KAAA,GAAQ,IAAA,CAAK,IAAI,CAAA,EAAG,CAAC,CAAA,EAAG,OAAA,CAAQ,EAAE,CAAC,CAAC,CAAA,CAAA,EAAI,KAAA,CAAM,CAAC,CAAC,CAAA,CAAA;AACxE;;;ACPO,IAAM,qBAAA,GAAwB,SAAA;ACkB9B,IAAM,2BAA2B,CAAC;AAAA,EACvC,MAAA;AAAA,EACA,OAAA;AAAA,EACA,kBAAA;AAAA,EACA,eAAA;AAAA,EACA,KAAA;AAAA,EACA,YAAA,GAAe;AACjB,CAAA,KAAqC;AACnC,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIA,eAAsB,IAAI,CAAA;AAClE,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAIA,eAAS,KAAK,CAAA;AACpD,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAIA,eAAiB,CAAC,CAAA;AAC9D,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIA,eAAwB,IAAI,CAAA;AACtD,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAIA,eAAiC,IAAI,CAAA;AACnF,EAAA,MAAM,YAAA,GAAeC,aAAyB,IAAI,CAAA;AAGlD,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,MAAA,EAAQ;AACX,MAAA,eAAA,CAAgB,IAAI,CAAA;AACpB,MAAA,cAAA,CAAe,KAAK,CAAA;AACpB,MAAA,iBAAA,CAAkB,CAAC,CAAA;AACnB,MAAA,QAAA,CAAS,IAAI,CAAA;AAEb,MAAA,kBAAA,CAAmB,CAAA,IAAA,KAAQ;AACzB,QAAA,IAAA,EAAM,KAAA,EAAM;AACZ,QAAA,OAAO,IAAA;AAAA,MACT,CAAC,CAAA;AAAA,IACH;AAAA,EACF,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,MAAM,gBAAA,GAAmBC,iBAAA,CAAY,CAAC,KAAA,KAA+C;AACnF,IAAA,MAAM,IAAA,GAAO,KAAA,CAAM,MAAA,CAAO,KAAA,GAAQ,CAAC,CAAA;AACnC,IAAA,IAAI,CAAC,IAAA,EAAM;AAEX,IAAA,IAAI,CAAC,IAAA,CAAK,IAAA,CAAK,QAAA,CAAS,MAAM,CAAA,IAAK,CAAC,IAAA,CAAK,IAAA,CAAK,QAAA,CAAS,SAAS,CAAA,EAAG;AACjE,MAAA,QAAA,CAAS,0DAA0D,CAAA;AACnE,MAAA;AAAA,IACF;AAEA,IAAA,QAAA,CAAS,IAAI,CAAA;AACb,IAAA,eAAA,CAAgB,IAAI,CAAA;AAAA,EACtB,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,YAAA,GAAeA,kBAAY,YAAY;AAC3C,IAAA,IAAI,CAAC,YAAA,IAAgB,CAAC,KAAA,EAAO;AAE7B,IAAA,QAAA,CAAS,IAAI,CAAA;AACb,IAAA,cAAA,CAAe,IAAI,CAAA;AACnB,IAAA,iBAAA,CAAkB,CAAC,CAAA;AAEnB,IAAA,IAAI;AAEF,MAAA,MAAM,UAAA,GAAa,IAAI,eAAA,EAAgB;AACvC,MAAA,kBAAA,CAAmB,UAAU,CAAA;AAE7B,MAAA,MAAM,SAAS,MAAM,kBAAA;AAAA,QACnB,YAAA;AAAA,QACA,KAAA;AAAA,QACA,iBAAA;AAAA,QACA,UAAA,CAAW;AAAA,OACb;AAEA,MAAA,IAAI,CAAC,OAAO,OAAA,EAAS;AACnB,QAAA,MAAM,IAAI,KAAA,CAAM,MAAA,CAAO,KAAA,IAAS,iCAAiC,CAAA;AAAA,MACnE;AAGA,MAAA,MAAM,eAAA,EAAgB;AACtB,MAAA,OAAA,EAAQ;AAAA,IACV,SAAS,GAAA,EAAK;AACZ,MAAA,IAAI,GAAA,YAAe,KAAA,IAAS,GAAA,CAAI,OAAA,KAAY,kBAAA,EAAoB;AAC9D,QAAA,OAAA,CAAQ,KAAA,CAAM,iBAAiB,GAAG,CAAA;AAClC,QAAA,QAAA,CAAS,IAAI,OAAO,CAAA;AAAA,MACtB;AAAA,IACF,CAAA,SAAE;AACA,MAAA,cAAA,CAAe,KAAK,CAAA;AACpB,MAAA,iBAAA,CAAkB,CAAC,CAAA;AACnB,MAAA,kBAAA,CAAmB,IAAI,CAAA;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,YAAA,EAAc,OAAO,kBAAA,EAAoB,eAAA,EAAiB,OAAO,CAAC,CAAA;AAEtE,EAAA,MAAM,YAAA,GAAeA,kBAAY,MAAM;AACrC,IAAA,IAAI,eAAe,eAAA,EAAiB;AAClC,MAAA,eAAA,CAAgB,KAAA,EAAM;AAAA,IACxB;AACA,IAAA,OAAA,EAAQ;AAAA,EACV,CAAA,EAAG,CAAC,WAAA,EAAa,eAAA,EAAiB,OAAO,CAAC,CAAA;AAE1C,EAAA,MAAM,mBAAA,GAAsBA,iBAAA,CAAY,CAAC,CAAA,KAAwB;AAC/D,IAAA,IAAI,CAAA,CAAE,MAAA,KAAW,CAAA,CAAE,aAAA,IAAiB,CAAC,WAAA,EAAa;AAChD,MAAA,OAAA,EAAQ;AAAA,IACV;AAAA,EACF,CAAA,EAAG,CAAC,WAAA,EAAa,OAAO,CAAC,CAAA;AAEzB,EAAA,IAAI,CAAC,QAAQ,OAAO,IAAA;AAEpB,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,iEAAA;AAAA,MACV,OAAA,EAAS,mBAAA;AAAA,MACT,IAAA,EAAK,QAAA;AAAA,MACL,YAAA,EAAW,MAAA;AAAA,MACX,iBAAA,EAAgB,oBAAA;AAAA,MAEhB,QAAA,kBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,oDAAA,EACb,QAAA,EAAA;AAAA,wBAAAD,cAAA,CAAC,IAAA,EAAA,EAAG,EAAA,EAAG,oBAAA,EAAqB,SAAA,EAAU,uCAAsC,QAAA,EAAA,uBAAA,EAE5E,CAAA;AAAA,wBAEAC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,MAAA,EACb,QAAA,EAAA;AAAA,0BAAAD,cAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAU,yCAAA,EAA0C,QAAA,EAAA,uBAAA,EAE3D,CAAA;AAAA,0BACAA,cAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,YAAA;AAAA,cACL,IAAA,EAAK,MAAA;AAAA,cACL,MAAA,EAAO,kDAAA;AAAA,cACP,QAAA,EAAU,gBAAA;AAAA,cACV,QAAA,EAAU,WAAA;AAAA,cACV,SAAA,EAAU;AAAA;AAAA,WACZ;AAAA,UACC,YAAA,oBACCC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gFAAA,EACb,QAAA,EAAA;AAAA,4BAAAD,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wBAAA,EAA0B,QAAA,EAAA,YAAA,CAAa,IAAA,EAAK,CAAA;AAAA,2CAC3D,MAAA,EAAA,EAAK,SAAA,EAAU,+BAA+B,QAAA,EAAA,WAAA,CAAY,YAAA,CAAa,IAAI,CAAA,EAAE;AAAA,WAAA,EAChF;AAAA,SAAA,EAEJ,CAAA;AAAA,QAEC,KAAA,oBACCA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4DACZ,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,QAGD,WAAA,oBACCC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,WAAA,EACb,QAAA,EAAA;AAAA,0BAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wCAAA,EACb,QAAA,EAAA;AAAA,4BAAAD,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mCAAA,EAAoC,QAAA,EAAA,6BAAA,EAEpD,CAAA;AAAA,4BACAC,eAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mCAAA,EACb,QAAA,EAAA;AAAA,cAAA,cAAA;AAAA,cAAe;AAAA,aAAA,EAClB;AAAA,WAAA,EACF,CAAA;AAAA,0BACAD,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qCAAA,EACb,QAAA,kBAAAA,cAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAU,8CAAA;AAAA,cACV,KAAA,EAAO;AAAA,gBACL,KAAA,EAAO,GAAG,cAAc,CAAA,CAAA,CAAA;AAAA,gBACxB,iBAAiB,YAAA,IAAgB;AAAA;AACnC;AAAA,WACF,EACF;AAAA,SAAA,EACF,CAAA;AAAA,wBAGFC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6BAAA,EACb,QAAA,EAAA;AAAA,0BAAAD,cAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAS,YAAA;AAAA,cACT,SAAA,EAAU,qFAAA;AAAA,cAET,QAAA,EAAA,WAAA,IAAe,kBAAkB,eAAA,GAAkB;AAAA;AAAA,WACtD;AAAA,0BACAA,cAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAS,YAAA;AAAA,cACT,QAAA,EAAU,CAAC,YAAA,IAAgB,WAAA;AAAA,cAC3B,SAAA,EAAU,0HAAA;AAAA,cACV,KAAA,EAAO,EAAE,eAAA,EAAiB,YAAA,EAAa;AAAA,cAEtC,wBAAc,cAAA,GAAiB;AAAA;AAAA;AAClC,SAAA,EACF;AAAA,OAAA,EACF;AAAA;AAAA,GACF;AAEJ;AAEA,wBAAA,CAAyB,WAAA,GAAc,0BAAA","file":"upload-support-bundle-modal.js","sourcesContent":["/**\n * Format bytes to human-readable string\n * @param bytes - Number of bytes\n * @param decimals - Number of decimal places (default: 1)\n * @returns Formatted string (e.g., \"1.5 MB\")\n */\nexport function formatBytes(bytes: number, decimals = 1): string {\n  if (bytes === 0) return \"0 Bytes\";\n\n  const k = 1024;\n  const dm = decimals < 0 ? 0 : decimals;\n  const sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n\n  const i = Math.floor(Math.log(bytes) / Math.log(k));\n\n  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;\n}\n\n/**\n * Format date string to short numeric date (no time)\n * @param dateString - ISO date string or null/undefined\n * @returns Formatted string (e.g., \"01/27/2026\") or \"Never\" if no date\n */\nexport function formatDateShort(dateString?: string | null): string {\n  if (!dateString) return \"Never\";\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n  return date.toLocaleDateString(\"en-US\", {\n    year: \"numeric\",\n    month: \"2-digit\",\n    day: \"2-digit\"\n  });\n}\n\n/**\n * Format date string to human-readable local timestamp\n * @param dateString - ISO date string or null/undefined\n * @returns Formatted string (e.g., \"Jan 27, 2026, 10:32 PM\") or \"Never\" if no date\n */\nexport function formatDate(dateString?: string | null): string {\n  if (!dateString) return \"Never\";\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n  return date.toLocaleDateString(\"en-US\", {\n    month: \"short\",\n    day: \"numeric\",\n    year: \"numeric\",\n    hour: \"numeric\",\n    minute: \"2-digit\",\n    hour12: true\n  });\n}\n\n/**\n * Format date string to human-readable UTC timestamp\n * @param dateString - ISO date string\n * @returns Formatted string (e.g., \"01/27/2026, 22:32:39 UTC\")\n */\nexport function formatDateTime(dateString: string): string {\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n  return date.toLocaleString(\"en-US\", {\n    timeZone: \"UTC\",\n    year: \"numeric\",\n    month: \"2-digit\",\n    day: \"2-digit\",\n    hour: \"2-digit\",\n    minute: \"2-digit\",\n    second: \"2-digit\",\n    hour12: false\n  }) + \" UTC\";\n}\n\n/**\n * Format date string to user-friendly local timestamp with 12-hour time\n * @param dateString - ISO date string or null/undefined\n * @returns Formatted string (e.g., \"1/27/2026, 10:32 PM\") or \"N/A\" if not provided\n */\nexport function formatDateTimeLocal(dateString?: string | null): string {\n  if (!dateString) return \"N/A\";\n\n  try {\n    const date = new Date(dateString);\n    if (isNaN(date.getTime())) {\n      return dateString;\n    }\n    return date.toLocaleDateString(\"en-US\", {\n      month: \"numeric\",\n      day: \"numeric\",\n      year: \"numeric\",\n      hour: \"numeric\",\n      minute: \"2-digit\",\n      hour12: true\n    });\n  } catch {\n    return \"N/A\";\n  }\n}\n","/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { formatBytes } from \"../utils/format\";\nimport { DEFAULT_PRIMARY_COLOR } from \"../utils/constants\";\nimport type { UploadSupportBundleResult } from \"../utils/upload-with-progress\";\n\ninterface UploadSupportBundleModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  /**\n   * Upload function with progress tracking\n   * onProgress receives percentage (0-100)\n   * signal is an AbortSignal for cancellation\n   */\n  uploadWithProgress: (\n    file: File,\n    appId: string,\n    onProgress: (percent: number) => void,\n    signal: AbortSignal\n  ) => Promise<UploadSupportBundleResult>;\n  /** Callback after successful upload - performs async polling to refresh bundle list */\n  onUploadSuccess: () => Promise<void>;\n  appId: string;\n  primaryColor?: string;\n}\n\nexport const UploadSupportBundleModal = ({\n  isOpen,\n  onClose,\n  uploadWithProgress,\n  onUploadSuccess,\n  appId,\n  primaryColor = DEFAULT_PRIMARY_COLOR\n}: UploadSupportBundleModalProps) => {\n  const [selectedFile, setSelectedFile] = useState<File | null>(null);\n  const [isUploading, setIsUploading] = useState(false);\n  const [uploadProgress, setUploadProgress] = useState<number>(0);\n  const [error, setError] = useState<string | null>(null);\n  const [abortController, setAbortController] = useState<AbortController | null>(null);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n\n  // Reset state when modal opens/closes\n  useEffect(() => {\n    if (!isOpen) {\n      setSelectedFile(null);\n      setIsUploading(false);\n      setUploadProgress(0);\n      setError(null);\n      // Abort any in-flight upload before clearing controller\n      setAbortController(prev => {\n        prev?.abort();\n        return null;\n      });\n    }\n  }, [isOpen]);\n\n  const handleFileChange = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n    const file = event.target.files?.[0];\n    if (!file) return;\n\n    if (!file.name.endsWith(\".tgz\") && !file.name.endsWith(\".tar.gz\")) {\n      setError(\"Invalid file type. Please select a .tgz or .tar.gz file.\");\n      return;\n    }\n\n    setError(null);\n    setSelectedFile(file);\n  }, []);\n\n  const handleUpload = useCallback(async () => {\n    if (!selectedFile || !appId) return;\n\n    setError(null);\n    setIsUploading(true);\n    setUploadProgress(0);\n\n    try {\n      // Upload with progress tracking\n      const controller = new AbortController();\n      setAbortController(controller);\n\n      const result = await uploadWithProgress(\n        selectedFile,\n        appId,\n        setUploadProgress,\n        controller.signal\n      );\n\n      if (!result.success) {\n        throw new Error(result.error ?? \"Failed to upload support bundle\");\n      }\n\n      // Success - notify parent and wait for polling to complete\n      await onUploadSuccess();\n      onClose();\n    } catch (err) {\n      if (err instanceof Error && err.message !== \"Upload cancelled\") {\n        console.error(\"Upload error:\", err);\n        setError(err.message);\n      }\n    } finally {\n      setIsUploading(false);\n      setUploadProgress(0);\n      setAbortController(null);\n    }\n  }, [selectedFile, appId, uploadWithProgress, onUploadSuccess, onClose]);\n\n  const handleCancel = useCallback(() => {\n    if (isUploading && abortController) {\n      abortController.abort();\n    }\n    onClose();\n  }, [isUploading, abortController, onClose]);\n\n  const handleBackdropClick = useCallback((e: React.MouseEvent) => {\n    if (e.target === e.currentTarget && !isUploading) {\n      onClose();\n    }\n  }, [isUploading, onClose]);\n\n  if (!isOpen) return null;\n\n  return (\n    <div\n      className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50\"\n      onClick={handleBackdropClick}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby=\"upload-modal-title\"\n    >\n      <div className=\"w-full max-w-md rounded-2xl bg-white p-6 shadow-xl\">\n        <h2 id=\"upload-modal-title\" className=\"text-lg font-semibold text-gray-900\">\n          Upload Support Bundle\n        </h2>\n\n        <div className=\"mt-4\">\n          <label className=\"block text-sm font-medium text-gray-700\">\n            Select Support Bundle\n          </label>\n          <input\n            ref={fileInputRef}\n            type=\"file\"\n            accept=\".tgz,.tar.gz,application/gzip,application/x-gzip\"\n            onChange={handleFileChange}\n            disabled={isUploading}\n            className=\"mt-2 block w-full text-sm text-gray-500 file:mr-4 file:rounded-lg file:border-0 file:bg-gray-100 file:px-4 file:py-2 file:text-sm file:font-medium file:text-gray-700 hover:file:bg-gray-200 disabled:opacity-50\"\n          />\n          {selectedFile && (\n            <div className=\"mt-3 flex items-center justify-between rounded-lg bg-gray-50 px-3 py-2 text-sm\">\n              <span className=\"truncate text-gray-700\">{selectedFile.name}</span>\n              <span className=\"ml-2 shrink-0 text-gray-500\">{formatBytes(selectedFile.size)}</span>\n            </div>\n          )}\n        </div>\n\n        {error && (\n          <div className=\"mt-4 rounded-lg bg-red-50 px-3 py-2 text-sm text-red-700\">\n            {error}\n          </div>\n        )}\n\n        {isUploading && (\n          <div className=\"mt-6 mb-6\">\n            <div className=\"flex items-center justify-between mb-2\">\n              <span className=\"text-sm font-medium text-gray-700\">\n                Uploading support bundle...\n              </span>\n              <span className=\"text-sm font-medium text-gray-900\">\n                {uploadProgress}%\n              </span>\n            </div>\n            <div className=\"w-full bg-gray-200 rounded-full h-2\">\n              <div\n                className=\"h-2 rounded-full transition-all duration-300\"\n                style={{\n                  width: `${uploadProgress}%`,\n                  backgroundColor: primaryColor || \"#3B82F6\",\n                }}\n              />\n            </div>\n          </div>\n        )}\n\n        <div className=\"mt-6 flex justify-end gap-3\">\n          <button\n            type=\"button\"\n            onClick={handleCancel}\n            className=\"rounded-lg px-4 py-2 text-sm font-medium text-gray-600 transition hover:bg-gray-100\"\n          >\n            {isUploading && abortController ? \"Cancel Upload\" : \"Cancel\"}\n          </button>\n          <button\n            type=\"button\"\n            onClick={handleUpload}\n            disabled={!selectedFile || isUploading}\n            className=\"rounded-lg px-4 py-2 text-sm font-medium text-white transition-opacity duration-200 hover:opacity-90 disabled:opacity-50\"\n            style={{ backgroundColor: primaryColor }}\n          >\n            {isUploading ? \"Uploading...\" : \"Upload\"}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nUploadSupportBundleModal.displayName = \"UploadSupportBundleModal\";\n"]}

package/dist/upload-with-progress-D760HthX.d.mts

@@ -0,0 +1,35 @@
+/**
+ * Client-side upload function with progress tracking and streaming using XMLHttpRequest
+ *
+ * This sends the file directly (not as FormData) to avoid proxy issues and enable true streaming.
+ * The file is sent with Content-Type: application/gzip and appId as a query parameter.
+ *
+ * @param file - The file to upload
+ * @param appId - The application ID
+ * @param onProgress - Callback that receives progress percentage (0-100)
+ * @param signal - AbortSignal for cancellation
+ *
+ * @example
+ * ```tsx
+ * import { uploadSupportBundleWithProgress } from "@replicated/portal-components/utils";
+ *
+ * <UploadSupportBundleModal
+ *   uploadWithProgress={uploadSupportBundleWithProgress}
+ *   // ... other props
+ * />
+ * ```
+ *
+ * Note: This requires a corresponding API route in your Next.js app at:
+ * /api/support-bundles/upload
+ *
+ * The API route should stream the request body directly to the backend without buffering.
+ */
+interface UploadSupportBundleResult {
+    success: boolean;
+    error?: string;
+    bundleId?: string;
+    bundleSlug?: string;
+}
+declare function uploadSupportBundleWithProgress(file: File, appId: string, onProgress: (percent: number) => void, signal: AbortSignal): Promise<UploadSupportBundleResult>;
+
+export { type UploadSupportBundleResult as U, uploadSupportBundleWithProgress as u };

package/dist/upload-with-progress-D760HthX.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Client-side upload function with progress tracking and streaming using XMLHttpRequest
+ *
+ * This sends the file directly (not as FormData) to avoid proxy issues and enable true streaming.
+ * The file is sent with Content-Type: application/gzip and appId as a query parameter.
+ *
+ * @param file - The file to upload
+ * @param appId - The application ID
+ * @param onProgress - Callback that receives progress percentage (0-100)
+ * @param signal - AbortSignal for cancellation
+ *
+ * @example
+ * ```tsx
+ * import { uploadSupportBundleWithProgress } from "@replicated/portal-components/utils";
+ *
+ * <UploadSupportBundleModal
+ *   uploadWithProgress={uploadSupportBundleWithProgress}
+ *   // ... other props
+ * />
+ * ```
+ *
+ * Note: This requires a corresponding API route in your Next.js app at:
+ * /api/support-bundles/upload
+ *
+ * The API route should stream the request body directly to the backend without buffering.
+ */
+interface UploadSupportBundleResult {
+    success: boolean;
+    error?: string;
+    bundleId?: string;
+    bundleSlug?: string;
+}
+declare function uploadSupportBundleWithProgress(file: File, appId: string, onProgress: (percent: number) => void, signal: AbortSignal): Promise<UploadSupportBundleResult>;
+
+export { type UploadSupportBundleResult as U, uploadSupportBundleWithProgress as u };

package/dist/utils/index.d.mts

@@ -1,6 +1,7 @@
-export { d as decodeBranding, n as normalizeColor, s as sanitizeUrlForCss } from '../branding-BsMSywts.mjs';
-import { a1 as DownloadPortalRelease } from '../index-JX9-CIMA.mjs';
+export { a as BackgroundType, B as BrandingResult, d as decodeBranding, n as normalizeColor, s as sanitizeUrlForCss } from '../branding-DmsrDTNE.mjs';
+import { a1 as DownloadPortalRelease } from '../index-DaH1bSuO.mjs';
 import { ReleaseEntry } from '../release-history-panel.mjs';
+export { U as UploadSupportBundleResult, u as uploadSupportBundleWithProgress } from '../upload-with-progress-D760HthX.mjs';
 import '../fetch-license-iTyF7_GY.mjs';
 import '../actions/change-team.mjs';
 import '../actions/trial-signup.mjs';

package/dist/utils/index.d.ts

@@ -1,6 +1,7 @@
-export { d as decodeBranding, n as normalizeColor, s as sanitizeUrlForCss } from '../branding-BsMSywts.js';
-import { a1 as DownloadPortalRelease } from '../index-DXy7RxOX.js';
+export { a as BackgroundType, B as BrandingResult, d as decodeBranding, n as normalizeColor, s as sanitizeUrlForCss } from '../branding-DmsrDTNE.js';
+import { a1 as DownloadPortalRelease } from '../index-Bcp17Mf3.js';
 import { ReleaseEntry } from '../release-history-panel.js';
+export { U as UploadSupportBundleResult, u as uploadSupportBundleWithProgress } from '../upload-with-progress-D760HthX.js';
 import '../fetch-license-iTyF7_GY.js';
 import '../actions/change-team.js';
 import '../actions/trial-signup.js';

package/dist/utils/index.js

@@ -150,6 +150,7 @@ var decodeBranding = ({ brandingData }) => {
     const secondaryColorRaw = parsed.secondaryColor ?? parsed.secondary_color;
     const primaryColor = normalizeColor(primaryColorRaw);
     const secondaryColor = normalizeColor(secondaryColorRaw);
+    const contact = typeof parsed.contact === "string" ? parsed.contact : void 0;
     const supportPortalLink = typeof parsed.supportPortalLink === "string" ? parsed.supportPortalLink : void 0;
     const backgroundRaw = parsed.background;
     const background = backgroundRaw === "minimal" || backgroundRaw === "custom" || backgroundRaw === "image" ? backgroundRaw : void 0;
@@ -162,6 +163,7 @@ var decodeBranding = ({ brandingData }) => {
       favicon,
       primaryColor: primaryColor || DEFAULT_PRIMARY_COLOR,
       secondaryColor: secondaryColor || DEFAULT_SECONDARY_COLOR,
+      contact,
       supportPortalLink,
       background,
       backgroundImage,
@@ -211,6 +213,7 @@ var fetchCustomBrandingImpl = async () => {
     title: payload.title,
     primaryColor: payload.primaryColor,
     secondaryColor: payload.secondaryColor,
+    contact: payload.contact,
     favicon: payload.faviconUrl,
     supportPortalLink: payload.supportPortalLink || "",
     background: payload.background,
@@ -395,6 +398,50 @@ function convertToReleaseEntry(release, channelName, options) {
   };
 }
 
+// src/utils/upload-with-progress.ts
+async function uploadSupportBundleWithProgress(file, appId, onProgress, signal) {
+  return new Promise((resolve, reject) => {
+    const xhr = new XMLHttpRequest();
+    xhr.upload.addEventListener("progress", (e) => {
+      if (e.lengthComputable) {
+        const percent = Math.round(e.loaded / e.total * 100);
+        onProgress(percent);
+      }
+    });
+    xhr.addEventListener("load", () => {
+      if (xhr.status === 200) {
+        try {
+          const response = JSON.parse(xhr.responseText);
+          resolve(response);
+        } catch (err) {
+          reject(new Error("Failed to parse server response"));
+        }
+      } else {
+        try {
+          const response = JSON.parse(xhr.responseText);
+          reject(new Error(response.error || `Upload failed: ${xhr.status}`));
+        } catch {
+          reject(new Error(`Upload failed: ${xhr.status} ${xhr.statusText}`));
+        }
+      }
+    });
+    xhr.addEventListener("error", () => {
+      reject(new Error("Network error. Please check your connection."));
+    });
+    xhr.addEventListener("abort", () => {
+      reject(new Error("Upload cancelled"));
+    });
+    signal.addEventListener("abort", () => {
+      xhr.abort();
+    });
+    const basePath = process.env.NEXT_PUBLIC_BASE_PATH || "";
+    const uploadUrl = `${basePath}/api/support-bundles/upload?appId=${encodeURIComponent(appId)}`;
+    xhr.open("POST", uploadUrl, true);
+    xhr.setRequestHeader("Content-Type", "application/gzip");
+    xhr.send(file);
+  });
+}
+
 exports.DEFAULT_FAVICON = DEFAULT_FAVICON;
 exports.DEFAULT_PRIMARY_COLOR = DEFAULT_PRIMARY_COLOR;
 exports.DEFAULT_SECONDARY_COLOR = DEFAULT_SECONDARY_COLOR;
@@ -411,6 +458,7 @@ exports.isHttpApiOrigin = isHttpApiOrigin;
 exports.isRedirectError = isRedirectError;
 exports.normalizeColor = normalizeColor;
 exports.sanitizeUrlForCss = sanitizeUrlForCss;
+exports.uploadSupportBundleWithProgress = uploadSupportBundleWithProgress;
 exports.validateSession = validateSession;
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map