Files
hermes-config/skills/self-hosting/shop-pro-quote/references/pocketbase-auto-cancellation.md
T
2026-07-12 10:17:17 -04:00

2.0 KiB

PocketBase SDK Auto-Cancellation

The Problem

PocketBase JS SDK enables auto-cancellation by default. Every create() and update() call to the same collection shares a default requestKey derived from method + URL. When two calls to the same collection happen simultaneously (double-click, race condition, rapid re-submission), the second call auto-cancels the first and throws:

Error: The request was autocancelled.

This is surfaced to the user as "Error creating repair order: The request was autocancelled."

The Fix

Pass { requestKey: null } to ALL mutating PocketBase calls in pocketbase.js:

// addDoc
const record = await pb.collection(collName).create(pbData, { requestKey: null });

// updateDoc
const record = await pb.collection(collName).update(docId, pbData, { requestKey: null });

// setDoc (both branches)
return pb.collection(collName).update(records[0].id, pbData, { requestKey: null });
return pb.collection(collName).create(pbData, { requestKey: null });

The getDocs and getFullListLegacy functions already pass { requestKey: null } in their options.

Belt-and-Suspenders: Double-Submission Guard

Even with requestKey: null, prevent duplicate form submissions by disabling the submit button on first click:

function handleFormSubmit() {
    const submitBtn = document.getElementById('submit-btn');
    if (submitBtn && submitBtn.disabled) return;  // guard
    if (submitBtn) {
        submitBtn.disabled = true;
        submitBtn.textContent = 'Saving...';
    }
    // ... submission logic ...
    // Re-enable after success:
    if (submitBtn) {
        submitBtn.disabled = false;
        submitBtn.textContent = 'Create Repair Order';
    }
    // ... success cleanup (clear form, collapse section) ...
} catch (error) {
    // Re-enable in catch block:
    if (submitBtn) {
        submitBtn.disabled = false;
        submitBtn.textContent = 'Create Repair Order';
    }
    // ... error handling ...
}

This guards against: double-clicks, keyboard double-Enter, and accidental double-taps on mobile.