@payloadcms/figma 0.1.0-alpha.3 → 0.1.0-alpha.5

package/dist/plugin/cloud-limits/CloudLimitProvider/index.js

@@ -1,113 +1,40 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { FormErrorHandlerContext, toast, useConfig, useFormErrorHandler, useModal, useTranslation } from '@payloadcms/ui';
-import { hasAutosaveEnabled } from 'payload/shared';
+import { FormErrorHandlerContext, useConfig, useFormErrorHandler, useModal, useTranslation } from '@payloadcms/ui';
+import { DrawerDepthContext } from '@payloadcms/ui/elements/Drawer';
+import { formatAdminURL, hasAutosaveEnabled } from 'payload/shared';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { FigmaCloudLimitDocumentCountModal } from '../CloudLimitModal/index.js';
-import { cloudLimitDocumentCountModalSlug, cloudLimitErrorCodes, cloudLimitToastKeyByCode, getCloudLimitErrorCode } from '../shared.js';
+import { cloudLimitDocumentCountModalSlug, cloudLimitErrorCodes, getCloudLimitErrorCode } from '../shared.js';
 import { FigmaCloudLimitSlugRegistryContext } from '../SlugRegistryContext/index.js';
-const AUTOSAVE_TOAST_ID = 'figma-cloud-limit-doc-count';
-let isUploadFetchPatched = false;
-function slugFromPathSuffix(suffix) {
-    return /^\/collections\/([^/?#]+)/.exec(suffix)?.[1];
-}
-/**
- * Surfaces Content API cloud-limit errors in the admin UI.
- */ export function FigmaCloudLimitProvider({ children }) {
+import { cloudLimitInterceptor } from '../utilities/cloudLimitInterceptor.js';
+import { dismissSubmittingToast, showCloudLimitToast } from '../utilities/toasts.js';
+export function FigmaCloudLimitProvider({ children }) {
     const { openModal } = useModal();
     const { i18n, t } = useTranslation();
     const { config, getEntityConfig } = useConfig();
     const parentErrorHandler = useFormErrorHandler();
-    const adminRouteRef = useRef(config.routes?.admin ?? '/admin');
-    const apiRouteRef = useRef(config.routes?.api ?? '/api');
-    const [collectionSlug, setCollectionSlug] = useState();
-    const [collectionLabel, setCollectionLabel] = useState();
+    const adminRoute = config.routes?.admin ?? '/admin';
+    const apiRoute = config.routes?.api ?? '/api';
+    const [modal, setModal] = useState({
+        drawerDepth: 0
+    });
     const retryRef = useRef(undefined);
-    // Ref so the handler always calls the latest getEntityConfig without being recreated.
-    const getEntityConfigRef = useRef(getEntityConfig);
-    getEntityConfigRef.current = getEntityConfig;
-    const tRef = useRef(t);
-    tRef.current = t;
-    // Stack of active collection slugs. FigmaCloudLimitSlugTracker components push/pop as
-    // documents mount/unmount (including drawers). The last entry is the active form's collection.
-    const slugStackRef = useRef([]);
-    const registerCollectionSlug = useCallback((slug)=>{
-        const id = Symbol();
-        slugStackRef.current = [
-            ...slugStackRef.current,
-            {
-                id,
-                slug
-            }
-        ];
+    const registrationsRef = useRef([]);
+    const register = useCallback((registration)=>{
+        registrationsRef.current.push(registration);
         return ()=>{
-            slugStackRef.current = slugStackRef.current.filter((e)=>e.id !== id);
-        };
-    }, []);
-    // Detect upload related cloud-limit that bypass form state
-    useEffect(()=>{
-        if (isUploadFetchPatched) {
-            return;
-        }
-        isUploadFetchPatched = true;
-        const originalFetch = window.fetch.bind(window);
-        const originalToastError = toast.error;
-        const toastObj = toast;
-        const pendingSuppressions = [];
-        const removeSuppression = (suppression)=>{
-            window.clearTimeout(suppression.timeout);
-            const index = pendingSuppressions.indexOf(suppression);
+            const index = registrationsRef.current.indexOf(registration);
             if (index !== -1) {
-                pendingSuppressions.splice(index, 1);
-            }
-        };
-        toastObj.error = (...args)=>{
-            // prevent the thrown error from sending a duplicate toast
-            const msg = typeof args[0] === 'string' ? args[0] : args[0]?.props?.errorMessage ?? '';
-            const suppression = pendingSuppressions.find(({ message })=>msg.includes(message));
-            if (suppression) {
-                removeSuppression(suppression);
-                return '';
-            }
-            return originalToastError(...args);
-        };
-        window.fetch = async function(...args) {
-            const response = await originalFetch(...args);
-            if (response.status === 409) {
-                const url = args[0] instanceof Request ? args[0].url : String(args[0]);
-                const uploadInstructionsPath = `${apiRouteRef.current.replace(/\/$/, '')}/upload-instructions`;
-                if (new URL(url, window.location.origin).pathname === uploadInstructionsPath) {
-                    try {
-                        const json = await response.clone().json();
-                        const code = getCloudLimitErrorCode(json);
-                        const messageKey = code !== undefined ? cloudLimitToastKeyByCode[code] : undefined;
-                        if (messageKey) {
-                            toast.info(tRef.current(messageKey));
-                            const rawMessage = json?.errors?.[0]?.message;
-                            if (rawMessage) {
-                                const suppression = {
-                                    message: rawMessage,
-                                    timeout: 0
-                                };
-                                suppression.timeout = window.setTimeout(()=>removeSuppression(suppression), 0);
-                                pendingSuppressions.push(suppression);
-                            }
-                        }
-                    } catch  {
-                    // ignore JSON parse failures
-                    }
-                }
+                registrationsRef.current.splice(index, 1);
             }
-            return response;
-        };
-        return ()=>{
-            pendingSuppressions.forEach(({ timeout })=>window.clearTimeout(timeout));
-            window.fetch = originalFetch;
-            toastObj.error = originalToastError;
-            isUploadFetchPatched = false;
         };
     }, []);
+    useEffect(()=>cloudLimitInterceptor(apiRoute, (key)=>t(key)), [
+        apiRoute,
+        t
+    ]);
     const handleNonFieldError = useCallback((err, retry)=>{
         const code = getCloudLimitErrorCode({
             errors: [
@@ -117,51 +44,65 @@ function slugFromPathSuffix(suffix) {
         if (!code) {
             return parentErrorHandler?.(err, retry) ?? false;
         }
-        if (code === cloudLimitErrorCodes.documentCount) {
-            // Prefer the tracker-provided slug (correct even in drawers) over URL parsing.
-            const stack = slugStackRef.current;
-            const slug = stack.length > 0 ? stack[stack.length - 1]?.slug : slugFromPathSuffix(window.location.pathname.slice(adminRouteRef.current.length));
-            const collectionConfig = slug ? getEntityConfigRef.current({
-                collectionSlug: slug
-            }) : undefined;
-            const isAutosave = collectionConfig ? hasAutosaveEnabled(collectionConfig) : false;
-            if (isAutosave) {
-                // Stable ID prevents a new toast stacking on every autosave attempt.
-                toast.info(t('figma:cloudLimitDocumentCountError'), {
-                    id: AUTOSAVE_TOAST_ID
-                });
-                return true;
-            }
-            const label = collectionConfig?.labels?.plural != null ? getTranslation(collectionConfig.labels.plural, i18n) : slug;
-            setCollectionSlug(slug);
-            setCollectionLabel(label);
-            retryRef.current = retry;
-            openModal(cloudLimitDocumentCountModalSlug);
+        dismissSubmittingToast(t('general:submitting'));
+        if (code !== cloudLimitErrorCodes.documentCount) {
+            showCloudLimitToast(code, t);
             return true;
         }
-        const messageKey = cloudLimitToastKeyByCode[code];
-        if (messageKey) {
-            toast.info(t(messageKey));
+        const registrations = registrationsRef.current;
+        let activeRegistration;
+        for(let index = registrations.length - 1; index >= 0; index--){
+            if (registrations[index]?.isSubmitting) {
+                activeRegistration = registrations[index];
+                break;
+            }
+        }
+        activeRegistration ??= registrations[registrations.length - 1];
+        const adminPath = formatAdminURL({
+            adminRoute,
+            includeBasePath: true
+        });
+        const slug = activeRegistration?.slug ?? /^\/collections\/([^/?#]+)/.exec(window.location.pathname.slice(adminPath.length))?.[1];
+        const collectionConfig = slug ? getEntityConfig({
+            collectionSlug: slug
+        }) : undefined;
+        if (collectionConfig && hasAutosaveEnabled(collectionConfig)) {
+            showCloudLimitToast(code, t);
             return true;
         }
-        return false;
+        setModal({
+            collectionLabel: collectionConfig?.labels?.plural != null ? getTranslation(collectionConfig.labels.plural, i18n) : slug,
+            collectionListURL: slug ? formatAdminURL({
+                adminRoute,
+                includeBasePath: true,
+                path: `/collections/${slug}`
+            }) : undefined,
+            drawerDepth: activeRegistration?.drawerDepth ?? 0
+        });
+        retryRef.current = retry;
+        openModal(cloudLimitDocumentCountModalSlug);
+        return true;
     }, [
+        adminRoute,
+        getEntityConfig,
         i18n,
         openModal,
         parentErrorHandler,
         t
     ]);
     return /*#__PURE__*/ _jsx(FigmaCloudLimitSlugRegistryContext, {
-        value: registerCollectionSlug,
+        value: register,
         children: /*#__PURE__*/ _jsxs(FormErrorHandlerContext, {
             value: handleNonFieldError,
             children: [
                 children,
-                /*#__PURE__*/ _jsx(FigmaCloudLimitDocumentCountModal, {
-                    adminRoute: adminRouteRef.current,
-                    collectionLabel: collectionLabel,
-                    collectionSlug: collectionSlug,
-                    onRetry: ()=>retryRef.current?.()
+                /*#__PURE__*/ _jsx(DrawerDepthContext, {
+                    value: modal.drawerDepth,
+                    children: /*#__PURE__*/ _jsx(FigmaCloudLimitDocumentCountModal, {
+                        collectionLabel: modal.collectionLabel,
+                        collectionListURL: modal.collectionListURL,
+                        onRetry: ()=>retryRef.current?.()
+                    })
                 })
             ]
         })

package/dist/plugin/cloud-limits/LimitReachedView/index.css

@@ -0,0 +1,14 @@
+.limit-hit-on-create {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacer-3);
+  min-block-size: calc(100dvh - var(--app-header-height, 0px));
+}
+
+.limit-hit-on-create__message {
+  margin: 0;
+  color: var(--color-text);
+  font-size: var(--text-body-medium-font-size);
+}

package/dist/plugin/cloud-limits/LimitReachedView/index.d.ts

@@ -0,0 +1,4 @@
+import type { AdminViewServerProps } from 'payload';
+import React from 'react';
+import './index.css';
+export declare const LimitReachedView: React.FC<AdminViewServerProps>;

package/dist/plugin/cloud-limits/LimitReachedView/index.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getTranslation } from '@payloadcms/translations';
+import { Button, SetStepNav } from '@payloadcms/ui';
+import { formatAdminURL } from 'payload/shared';
+import React from 'react';
+import './index.css';
+const baseClass = 'limit-hit-on-create';
+export const LimitReachedView = ({ collectionConfig, initPageResult })=>{
+    const { req } = initPageResult;
+    const adminRoute = req.payload.config.routes.admin;
+    const tFigma = req.t;
+    if (!collectionConfig) {
+        return null;
+    }
+    const collectionLabel = getTranslation(collectionConfig.labels.plural, req.i18n);
+    const collectionListURL = formatAdminURL({
+        adminRoute,
+        includeBasePath: true,
+        path: `/collections/${collectionConfig.slug}`
+    });
+    return /*#__PURE__*/ _jsxs("main", {
+        className: baseClass,
+        children: [
+            /*#__PURE__*/ _jsx(SetStepNav, {
+                nav: [
+                    {
+                        label: collectionLabel,
+                        url: collectionListURL
+                    },
+                    {
+                        label: req.t('general:createNew')
+                    }
+                ]
+            }),
+            /*#__PURE__*/ _jsx("p", {
+                className: `${baseClass}__message`,
+                children: tFigma('figma:cloudLimitDocumentCountError')
+            }),
+            /*#__PURE__*/ _jsx(Button, {
+                buttonStyle: "primary",
+                el: "link",
+                margin: false,
+                size: "medium",
+                url: formatAdminURL({
+                    adminRoute,
+                    includeBasePath: true
+                }),
+                children: req.t('general:backToDashboard')
+            })
+        ]
+    });
+};

package/dist/plugin/cloud-limits/SlugRegistryContext/index.d.ts

@@ -1,2 +1,7 @@
-export type RegisterCollectionSlug = (slug: string | undefined) => () => void;
-export declare const FigmaCloudLimitSlugRegistryContext: import("react").Context<RegisterCollectionSlug>;
+export type CollectionFormRegistration = {
+    drawerDepth: number;
+    isSubmitting: boolean;
+    slug: string | undefined;
+};
+export type RegisterCollectionForm = (registration: CollectionFormRegistration) => () => void;
+export declare const FigmaCloudLimitSlugRegistryContext: import("react").Context<RegisterCollectionForm>;

package/dist/plugin/cloud-limits/SlugTracker/index.d.ts

@@ -1,9 +1 @@
-/**
- * Invisible component injected into every collection's
- * `admin.components.edit.beforeDocumentControls`. Renders inside
- * DocumentInfoProvider so it can read the correct collectionSlug even inside
- * relationship drawers. Pushes to / pops from the slug stack owned by
- * FigmaCloudLimitProvider so the error handler always knows which collection
- * the active form belongs to.
- */
 export declare function FigmaCloudLimitSlugTracker(): null;

package/dist/plugin/cloud-limits/SlugTracker/index.js

@@ -1,22 +1,26 @@
 'use client';
-import { useDocumentInfo } from '@payloadcms/ui';
+import { useDocumentInfo, useFormBackgroundProcessing, useFormProcessing } from '@payloadcms/ui';
+import { useDrawerDepth } from '@payloadcms/ui/elements/Drawer';
 import { use, useEffect } from 'react';
 import { FigmaCloudLimitSlugRegistryContext } from '../SlugRegistryContext/index.js';
-/**
- * Invisible component injected into every collection's
- * `admin.components.edit.beforeDocumentControls`. Renders inside
- * DocumentInfoProvider so it can read the correct collectionSlug even inside
- * relationship drawers. Pushes to / pops from the slug stack owned by
- * FigmaCloudLimitProvider so the error handler always knows which collection
- * the active form belongs to.
- */ export function FigmaCloudLimitSlugTracker() {
+export function FigmaCloudLimitSlugTracker() {
     const register = use(FigmaCloudLimitSlugRegistryContext);
     const { collectionSlug } = useDocumentInfo();
+    const drawerDepth = useDrawerDepth();
+    const isBackgroundProcessing = useFormBackgroundProcessing();
+    const isProcessing = useFormProcessing();
     useEffect(()=>{
-        const unregister = register(collectionSlug);
+        const unregister = register({
+            slug: collectionSlug,
+            drawerDepth,
+            isSubmitting: isBackgroundProcessing || isProcessing
+        });
         return unregister;
     }, [
         collectionSlug,
+        drawerDepth,
+        isBackgroundProcessing,
+        isProcessing,
         register
     ]);
     return null;

package/dist/plugin/cloud-limits/routes.d.ts

@@ -0,0 +1,2 @@
+export declare const LIMIT_REACHED_VIEW_KEY = "figmaLimitReached";
+export declare const LIMIT_REACHED_VIEW_PATH = "/limit-reached";

package/dist/plugin/cloud-limits/routes.js

@@ -0,0 +1,4 @@
+export const LIMIT_REACHED_VIEW_KEY = 'figmaLimitReached';
+// Reserved collection-level admin route. Applications using custom string IDs must not use
+// "limit-reached"; the custom view intentionally takes precedence over a document edit route.
+export const LIMIT_REACHED_VIEW_PATH = '/limit-reached';

package/dist/plugin/cloud-limits/server/redirectInitialAutosaveCreate.d.ts

@@ -0,0 +1,9 @@
+import type { Payload, PayloadRequest } from 'payload';
+type Args = {
+    collectionSlug: string;
+    errorCode: unknown;
+    payload: Payload;
+    req?: Partial<Pick<PayloadRequest, 'pathname' | 'server'>>;
+};
+export declare function redirectInitialAutosaveCreate({ collectionSlug, errorCode, payload, req, }: Args): void;
+export {};

package/dist/plugin/cloud-limits/server/redirectInitialAutosaveCreate.js

@@ -0,0 +1,28 @@
+import { formatAdminURL, hasAutosaveEnabled } from 'payload/shared';
+import { LIMIT_REACHED_VIEW_PATH } from '../routes.js';
+import { cloudLimitErrorCodes } from '../shared.js';
+export function redirectInitialAutosaveCreate({ collectionSlug, errorCode, payload, req }) {
+    // Initial autosave creates an empty document, so documentDataSize is not expected in
+    // production. Keep it as a defensive/test-only fallback and intentionally route it
+    // through the same terminal create-failure view.
+    const isSupportedLimit = errorCode === cloudLimitErrorCodes.documentCount || errorCode === cloudLimitErrorCodes.documentDataSize;
+    const collectionConfig = payload.collections[collectionSlug]?.config;
+    const server = req?.server;
+    if (!isSupportedLimit || !collectionConfig || !server || !hasAutosaveEnabled(collectionConfig)) {
+        return;
+    }
+    const { admin: adminRoute } = payload.config.routes;
+    const createPath = formatAdminURL({
+        adminRoute,
+        includeBasePath: true,
+        path: `/collections/${collectionSlug}/create`
+    });
+    if (req.pathname?.replace(/\/$/, '') !== createPath.replace(/\/$/, '')) {
+        return;
+    }
+    server.redirect(formatAdminURL({
+        adminRoute,
+        includeBasePath: true,
+        path: `/collections/${collectionSlug}${LIMIT_REACHED_VIEW_PATH}`
+    }));
+}

package/dist/plugin/cloud-limits/shared.d.ts

@@ -7,4 +7,4 @@ export type CloudLimitErrorCode = (typeof cloudLimitErrorCodes)[keyof typeof clo
 export declare function isCloudLimitErrorCode(code: unknown): code is CloudLimitErrorCode;
 export declare function getCloudLimitErrorCode(json: unknown): CloudLimitErrorCode | undefined;
 export declare const cloudLimitDocumentCountModalSlug = "figma-cloud-limit-document-count";
-export declare const cloudLimitToastKeyByCode: Partial<Record<CloudLimitErrorCode, string>>;
+export declare const cloudLimitToastKeyByCode: Record<CloudLimitErrorCode, string>;

package/dist/plugin/cloud-limits/shared.js

@@ -7,6 +7,20 @@ const knownCloudLimitCodes = Object.values(cloudLimitErrorCodes);
 export function isCloudLimitErrorCode(code) {
     return typeof code === 'string' && knownCloudLimitCodes.includes(code);
 }
+const cloudLimitCodeByMessagePattern = [
+    {
+        code: cloudLimitErrorCodes.documentCount,
+        pattern: /document count/i
+    },
+    {
+        code: cloudLimitErrorCodes.documentDataSize,
+        pattern: /document data size/i
+    },
+    {
+        code: cloudLimitErrorCodes.assetStorage,
+        pattern: /asset storage limit/i
+    }
+];
 export function getCloudLimitErrorCode(json) {
     const errors = json?.errors;
     if (!Array.isArray(errors)) {
@@ -17,11 +31,22 @@ export function getCloudLimitErrorCode(json) {
         if (isCloudLimitErrorCode(code)) {
             return code;
         }
+        const message = err?.message;
+        if (message?.startsWith('Content API ')) {
+            // Payload's bulk-upload response currently drops APIError.data.code. Match only the
+            // identifying phrase from each Content API message so variable values and minor wording
+            // changes do not break the fallback. Prefer the structured code above whenever present.
+            const match = cloudLimitCodeByMessagePattern.find(({ pattern })=>pattern.test(message));
+            if (match) {
+                return match.code;
+            }
+        }
     }
     return undefined;
 }
 export const cloudLimitDocumentCountModalSlug = 'figma-cloud-limit-document-count';
 export const cloudLimitToastKeyByCode = {
     [cloudLimitErrorCodes.assetStorage]: 'figma:cloudLimitAssetStorageError',
+    [cloudLimitErrorCodes.documentCount]: 'figma:cloudLimitDocumentCountError',
     [cloudLimitErrorCodes.documentDataSize]: 'figma:cloudLimitDocumentDataSizeError'
 };

package/dist/plugin/cloud-limits/utilities/cloudLimitInterceptor.d.ts

@@ -0,0 +1,2 @@
+import type { Translate } from './toasts.js';
+export declare function cloudLimitInterceptor(apiRoute: string, translate: Translate): () => void;

package/dist/plugin/cloud-limits/utilities/cloudLimitInterceptor.js

@@ -0,0 +1,134 @@
+'use client';
+import { toast } from '@payloadcms/ui';
+import { formatAdminURL } from 'payload/shared';
+import { getCloudLimitErrorCode } from '../shared.js';
+import { showCloudLimitToast } from './toasts.js';
+const ERROR_SUPPRESSION_MS = 1_000;
+const SUMMARY_SUPPRESSION_MS = 60_000;
+function restoreBulkErrorCodes(response, json) {
+    if (!json || typeof json !== 'object' || !Array.isArray(json.docs) || !Array.isArray(json.errors)) {
+        return undefined;
+    }
+    let hasLimitError = false;
+    const errors = json.errors.map((error)=>{
+        const code = getCloudLimitErrorCode({
+            errors: [
+                error
+            ]
+        });
+        if (!code || !error || typeof error !== 'object') {
+            return error;
+        }
+        hasLimitError = true;
+        const data = error.data;
+        return {
+            ...error,
+            data: {
+                ...typeof data === 'object' && data ? data : {},
+                code
+            }
+        };
+    });
+    if (!hasLimitError) {
+        return undefined;
+    }
+    const { message: _aggregateMessage, ...result } = json;
+    const headers = new Headers(response.headers);
+    headers.delete('content-encoding');
+    headers.delete('content-length');
+    return new Response(JSON.stringify({
+        ...result,
+        errors
+    }), {
+        headers,
+        status: response.status,
+        statusText: response.statusText
+    });
+}
+export function cloudLimitInterceptor(apiRoute, translate) {
+    const originalFetch = window.fetch;
+    const originalToastError = toast.error;
+    const suppressions = new Map();
+    let suppressSummary = false;
+    let summaryTimeout;
+    const patchedToastError = (...args)=>{
+        const message = typeof args[0] === 'string' ? args[0] : args[0]?.props?.errorMessage ?? '';
+        const match = [
+            ...suppressions
+        ].find(([rawMessage])=>message.includes(rawMessage));
+        if (match) {
+            const [, suppression] = match;
+            // Keep the suppression for its full lifetime so overlapping requests with the same raw
+            // error cannot leak duplicate Payload error toasts. The stable info-toast ID deduplicates
+            // the replacement notification.
+            showCloudLimitToast(suppression.code, translate);
+            if (suppression.isBulkUpload) {
+                suppressSummary = true;
+                window.clearTimeout(summaryTimeout);
+                summaryTimeout = window.setTimeout(()=>suppressSummary = false, SUMMARY_SUPPRESSION_MS);
+            }
+            return '';
+        }
+        if (suppressSummary && /^Failed to save \d+ files$/.test(message)) {
+            suppressSummary = false;
+            window.clearTimeout(summaryTimeout);
+            return '';
+        }
+        return originalToastError(...args);
+    };
+    const patchedFetch = async (...args)=>{
+        const response = await originalFetch(...args);
+        if (response.status < 400) {
+            return response;
+        }
+        try {
+            const json = await response.clone().json();
+            const bulkResponse = response.status === 400 ? restoreBulkErrorCodes(response, json) : undefined;
+            if (bulkResponse) {
+                return bulkResponse;
+            }
+            const input = args[0];
+            const pathname = new URL(input instanceof Request ? input.url : String(input), window.location.origin).pathname;
+            const method = (input instanceof Request ? input.method : args[1]?.method ?? 'GET').toUpperCase();
+            const apiPath = formatAdminURL({
+                apiRoute,
+                path: ''
+            }).replace(/\/$/, '');
+            const endpoint = pathname.startsWith(`${apiPath}/`) ? pathname.slice(apiPath.length + 1) : '';
+            const isUploadInstructions = endpoint === 'upload-instructions';
+            const isCollectionCreate = method === 'POST' && endpoint !== '' && !endpoint.includes('/');
+            if (!isUploadInstructions && !isCollectionCreate) {
+                return response;
+            }
+            const code = getCloudLimitErrorCode(json);
+            const rawMessage = json?.errors?.[0]?.message;
+            if (code && rawMessage) {
+                const previous = suppressions.get(rawMessage);
+                window.clearTimeout(previous?.timeout);
+                const suppression = {
+                    code,
+                    isBulkUpload: isCollectionCreate,
+                    timeout: 0
+                };
+                suppression.timeout = window.setTimeout(()=>suppressions.delete(rawMessage), ERROR_SUPPRESSION_MS);
+                suppressions.set(rawMessage, suppression);
+            }
+        } catch  {
+        // Leave Payload's default handling intact for malformed error responses.
+        }
+        return response;
+    };
+    window.fetch = patchedFetch;
+    toast.error = patchedToastError;
+    return ()=>{
+        suppressions.forEach(({ timeout })=>window.clearTimeout(timeout));
+        window.clearTimeout(summaryTimeout);
+        if (window.fetch === patchedFetch) {
+            window.fetch = originalFetch;
+        }
+        if (toast.error === patchedToastError) {
+            ;
+            toast.error = originalToastError;
+        }
+    };
+}

package/dist/plugin/cloud-limits/utilities/toasts.d.ts

@@ -0,0 +1,4 @@
+import type { CloudLimitErrorCode } from '../shared.js';
+export type Translate = (key: string) => string;
+export declare function dismissSubmittingToast(label: string): void;
+export declare function showCloudLimitToast(code: CloudLimitErrorCode, translate: Translate): void;

package/dist/plugin/cloud-limits/utilities/toasts.js

@@ -0,0 +1,19 @@
+'use client';
+import { toast } from '@payloadcms/ui';
+import { cloudLimitToastKeyByCode } from '../shared.js';
+const TOAST_ID_PREFIX = 'figma-cloud-limit';
+export function dismissSubmittingToast(label) {
+    const activeToasts = toast.getToasts();
+    for(let index = activeToasts.length - 1; index >= 0; index--){
+        const candidate = activeToasts[index];
+        if (candidate && !('dismiss' in candidate) && candidate.promise !== undefined && candidate.title === label && candidate.type === 'loading') {
+            toast.dismiss(candidate.id);
+            return;
+        }
+    }
+}
+export function showCloudLimitToast(code, translate) {
+    toast.info(translate(cloudLimitToastKeyByCode[code]), {
+        id: `${TOAST_ID_PREFIX}-${code}`
+    });
+}