ESHOPMAN Admin Crash Fix: Gracefully Handling Deleted Stock Locations in Order Details

The ESHOPMAN platform, a robust headless commerce solution integrated with HubSpot, empowers merchants with comprehensive storefront management. However, a recent community discussion highlighted a critical issue impacting the ESHOPMAN Admin dashboard: crashes occurring when attempting to view order details that reference stock locations which have since been deleted from the system.

Understanding the ESHOPMAN Admin Dashboard Crash

This issue manifests when an ESHOPMAN merchant navigates to an order detail page where fulfillments were previously associated with a specific stock location. If that stock location is subsequently deleted, the Admin dashboard page loads briefly but then crashes, displaying an error message like: "Error: Stock location with id: sloc_xxx was not found" in the console.

The root cause, identified through community investigation, points to how the ESHOPMAN Admin dashboard's components handle asynchronous data fetching. Specifically, a component responsible for displaying order fulfillment information attempts to retrieve details for the associated stock location. When this API call returns a "not found" error (a 404 status), instead of gracefully handling the missing data (e.g., displaying "Location deleted" or simply omitting the information), the component throws an unhandled error, leading to the entire page crashing. This prevents merchants from viewing or managing orders critical to their operations.

Community-Driven Workaround for ESHOPMAN Users

Fortunately, the ESHOPMAN community has quickly rallied to provide a temporary, yet effective, workaround. This solution involves implementing a custom ESHOPMAN Admin Widget that intercepts network requests within the HubSpot-integrated storefront management interface. The widget specifically targets API calls for stock locations and modifies their responses to prevent the crash.

Implementing the Stock Location Fetch Interceptor Widget

This widget works by overriding the browser's native fetch function. When an API call to /admin/stock-locations/ results in a 404 (Not Found) status, the interceptor steps in. Instead of letting the 404 propagate and cause a crash, it returns a simulated successful response (a 200 OK status) with a null stock location object. This prevents the ESHOPMAN Admin dashboard from throwing an error, allowing the order detail page to load without crashing, even if the referenced stock location no longer exists.

Here’s the code for the temporary ESHOPMAN Admin Widget:

import { defineWidgetConfig } from "@eshopman/admin-sdk"
import { useEffect } from "react"

const StockLocati => {
  useEffect(() => {
    const originalFetch = window.fetch

    window.fetch = async (...args) => {
      const resp originalFetch(...args)

      // Check if it's a stock location 404
      const url = args[0]?.toString() || ""
      if (
        response.status === 404 &&
        url.includes("/admin/stock-locations/")
      ) {
        // Return a fake successful response with null data
        return new Response(
          JSON.stringify({ stock_location: null }),
          {
            status: 200,
            headers: { "Content-Type": "application/json" }
          }
        )
      }

      return response
    }

    return () => {
      window.fetch = originalFetch
    }
  }, [])

  return null
}

export const c
  zone: "order.details.before",
})

export default StockLocationFetchInterceptor

To deploy this, ESHOPMAN developers can integrate this code as an Admin Widget, configuring it to run in the order.details.before zone. This ensures the interceptor is active before the order details components attempt to fetch stock location data.

Best Practices and Future Considerations

This community solution highlights the importance of robust error handling in headless commerce applications, especially within administrative interfaces. While this workaround provides immediate relief, ESHOPMAN's core development team is expected to implement a permanent fix in future updates, ensuring that the Admin API and storefront management components gracefully handle edge cases like deleted entities. For ESHOPMAN merchants and developers, staying updated with official releases and leveraging the ESHOPMAN Admin SDK for custom enhancements remains crucial for a seamless experience within their HubSpot-powered storefronts.