# How to Integrate Retool with Spocket

- Tool: Retool
- Difficulty: Beginner
- Time required: 15 minutes
- Last updated: April 2026

## TL;DR

Connect Retool to Spocket using a REST API Resource with API key authentication. Configure the Spocket API base URL and authorization header, then build queries to browse supplier products, track orders, and monitor fulfillment quality. The setup takes about 15 minutes and creates a dropshipping supplier management dashboard.

## Why Connect Retool to Spocket?

Spocket's native interface is designed for individual store owners browsing and importing products, not for operations teams managing supplier relationships across multiple stores. Connecting Retool to the Spocket API lets you build internal dashboards that provide a unified view of your supplier catalog, order pipeline, and fulfillment quality metrics — data that requires clicking through multiple Spocket screens to gather manually.

The Spocket API exposes endpoints for products, orders, suppliers, and shipping information. In Retool, you can query this data visually and combine it with your own database or Shopify data to build comprehensive dropshipping operations panels. Common use cases include supplier performance dashboards that track average fulfillment time and defect rates, product catalog browsers that help buyers compare pricing and shipping estimates across suppliers, and order status trackers that surface delayed or failed fulfillments before customers complain.

For agencies and merchants managing multiple Spocket-integrated stores, Retool provides a single interface that aggregates data across all operations rather than requiring separate logins to each store dashboard. This is particularly valuable for comparing supplier quality — a critical consideration since Spocket's US/EU supplier focus differentiates it from AliExpress-based alternatives.

## Before you start

- A Spocket account with at least one connected store and access to the API settings
- A Spocket API key (available from your Spocket account's API or integration settings)
- A Retool account (Cloud or self-hosted) with permission to add Resources
- Basic familiarity with the Retool query editor and component panel

## Step-by-step guide

### 1. Obtain your Spocket API key and store it in Retool

Log in to your Spocket account at app.spocket.co. Navigate to your account settings by clicking your profile name or avatar in the top navigation bar. Look for an API section, Developer Settings, or Integrations in the settings menu. Spocket provides API keys for programmatic access to your account data — the exact location may vary based on your Spocket plan; API access is typically available on paid plans.

Copy the API key from the settings page. Handle it carefully — this key grants full API access to your Spocket account including order management and product data. Do not paste it into shared documents, browser address bars, or code that gets committed to version control.

In Retool, navigate to Settings (gear icon in the left sidebar of the Retool home page) → Configuration Variables. Click Add Variable, set the name to SPOCKET_API_KEY, paste your API key as the value, and toggle the Secret switch to On. Marking it as Secret restricts the variable to resource configurations and workflows — it will never be accessible in Retool's frontend JavaScript or visible to regular app users. Click Save to store the variable.

**Expected result:** Your Spocket API key is stored as a Secret Configuration Variable in Retool. You are ready to configure the REST API Resource.

### 2. Create a Spocket REST API Resource in Retool

Open the Retool home page and click the Resources tab in the top navigation or left sidebar. Click the Add Resource button in the top right corner. In the resource type selector, type 'REST API' in the search box or scroll to find it, then click REST API to open the configuration form.

In the Name field, enter 'Spocket API'. In the Base URL field, enter the Spocket API base URL: https://api.spocket.co — verify the current base URL in Spocket's API documentation as it may have a version path such as /v1 or /api. Check the Spocket API documentation for the exact base URL format.

Scroll to the Headers section. Click Add header and configure the authorization header. Set Key to Authorization and Value to Bearer {{ retoolContext.configVars.SPOCKET_API_KEY }}. This ensures every request made through this resource includes your API key in the Authorization header, automatically injected from the secure Configuration Variable. Add a second header: Key = Content-Type, Value = application/json. Add a third header: Key = Accept, Value = application/json.

Leave the authentication type dropdown set to None since you are handling auth via the custom Authorization header. Give the resource a recognizable name and click Save Changes. The Spocket API resource is now available in the query editor across all your Retool apps.

**Expected result:** A 'Spocket API' REST API Resource is saved and visible in the Resources list. It is configured with the base URL and Authorization header pointing to your secure API key.

### 3. Build queries to fetch products and orders

Open or create a Retool app. In the Code panel at the bottom, click + New to create your first query. Name it getProducts. Select the Spocket API resource from the Resource dropdown. Set the HTTP method to GET. In the URL path field, enter /products (or the appropriate endpoint path from Spocket's API documentation, such as /api/v1/products). Add URL parameters to control results: limit = 50 (or the maximum allowed), and optionally category or country parameters to filter results.

Set this query's Trigger to run automatically on page load. Click Run to test it and verify you receive a JSON response with product data including names, prices, and supplier information.

Create a second query named getOrders. Resource = Spocket API, method = GET, path = /orders (or /api/v1/orders). Add URL parameters: limit = 100, and optionally status = 'pending' or status = 'processing' to filter by fulfillment state. Add a page parameter for pagination. Set this query to also run on page load.

Create a third query named getSuppliers. Resource = Spocket API, method = GET, path = /suppliers. This returns the suppliers you have interacted with or imported products from. These three queries provide the data foundation for your dropshipping operations dashboard.

```
// JavaScript transformer to calculate margin and format product data
// Attach to getProducts query via Advanced → Transform data
const products = data;
if (!products || !Array.isArray(products)) return [];

return products.map(product => {
  const supplierPrice = parseFloat(product.wholesale_price || product.cost || 0);
  const retailPrice = parseFloat(product.retail_price || product.msrp || 0);
  const margin = retailPrice > 0
    ? (((retailPrice - supplierPrice) / retailPrice) * 100).toFixed(1)
    : 'N/A';

  return {
    id: product.id,
    title: product.title || product.name || 'Unknown',
    supplier: product.supplier_name || product.brand || 'Unknown Supplier',
    supplierPrice: `$${supplierPrice.toFixed(2)}`,
    retailPrice: `$${retailPrice.toFixed(2)}`,
    margin: margin !== 'N/A' ? `${margin}%` : 'N/A',
    shippingTime: product.shipping_days_min && product.shipping_days_max
      ? `${product.shipping_days_min}-${product.shipping_days_max} days`
      : 'N/A',
    country: product.origin_country || product.ship_from || 'Unknown',
    inStock: product.in_stock !== false
  };
});
```

**Expected result:** Three queries are returning data: getProducts shows supplier products with pricing, getOrders shows current orders with status information, and getSuppliers shows supplier profiles.

### 4. Build the supplier product catalog and order tracking dashboard

Assemble the dashboard interface with the queried data. First, add a Select component at the top of the canvas for category filtering. Set its options manually or from a transformer that extracts unique categories from getProducts.data. Also add a Text Input for keyword search and a Slider or Number Input for maximum price filtering.

Drag a Table component onto the main canvas area. In the Table's Inspector, set Data source to {{ getProducts.data }} (with the formatProducts transformer applied). Configure visible columns: title, supplier, supplierPrice, retailPrice, margin, shippingTime, country, and inStock (displayed as a green/red badge using a column renderer). Enable sorting on margin and retail price columns. Add a filter in the Table settings that connects to your search Text Input: filter rows where title contains {{ searchInput.value }}.

Add a second Table below or in a tabbed layout for orders. Set Data source to {{ getOrders.data }}. Configure columns: order ID, customer reference, supplier, status (with color-coded badges: green for delivered, blue for shipped, yellow for processing, red for failed), tracking number, and order date. Add a date range filter using Date Picker components.

Drag a Chart component to the right of the orders Table. Set type to Bar and use a transformer that groups orders by supplier and counts them to show order volume per supplier. This gives a quick view of which suppliers you are most dependent on. For agencies managing multiple client stores with complex reporting needs, RapidDev's team can help build multi-store Retool dashboards with advanced supplier analytics.

```
// Transformer: group orders by supplier for Chart
// Use as standalone transformer, reference in Chart Data source
const orders = getOrders.data;
if (!orders || !Array.isArray(orders)) return [];

const counts = orders.reduce((acc, order) => {
  const supplier = order.supplier_name || order.brand || 'Unknown';
  acc[supplier] = (acc[supplier] || 0) + 1;
  return acc;
}, {});

return Object.entries(counts)
  .map(([supplier, orderCount]) => ({ supplier, orderCount }))
  .sort((a, b) => b.orderCount - a.orderCount)
  .slice(0, 10);
```

**Expected result:** The dashboard shows a filterable product catalog Table with margin calculations, an order tracking Table with status badges, and a Chart showing order volume by supplier.

### 5. Add order status update and fulfillment tracking queries

Extend the dashboard with write capabilities for order management. In the Code panel, create a new query named updateOrderStatus. Resource = Spocket API, method = PATCH or PUT, path = /orders/{{ ordersTable.selectedRow.id }}. Set Body Type to JSON. The body should reference the current selected order and allow status updates: { 'status': '{{ statusSelect.value }}' }. Set this query to Manual trigger.

Add a Select component labeled 'Update Status' above the orders Table with options: processing, shipped, delivered, cancelled. Add a Button labeled 'Update Order'. In the button's Inspector, add a Click event handler that triggers the updateOrderStatus query. In the query's success handler, add two actions: refresh getOrders to reload the table, and show a notification 'Order status updated successfully'.

Create a separate query named getOrderTracking. Resource = Spocket API, method = GET, path = /orders/{{ ordersTable.selectedRow.id }}/tracking. This retrieves the tracking information for the selected order row. Set Trigger to run automatically when ordersTable.selectedRow changes. Display the tracking data in a JSON Viewer component or a series of Text components below the order table — show carrier name, tracking number, and current location if available.

For suppliers with consistent late deliveries, build a Retool Workflow that queries getOrders on a schedule, identifies orders older than the expected fulfillment window, and sends a Slack or email alert to the operations team.

```
{
  "status": "{{ statusSelect.value }}",
  "note": "{{ orderNoteInput.value }}",
  "updated_at": "{{ new Date().toISOString() }}"
}
```

**Expected result:** Selecting an order in the Table and clicking Update Order sends a PATCH request to Spocket and refreshes the data. The tracking panel shows the latest shipping status for the selected order.

## Best practices

- Store your Spocket API key in Retool Configuration Variables marked as Secret — never hard-code it in query fields or URL parameters.
- Use query transformers to calculate margin percentages and format pricing data rather than displaying raw API values — this makes the dashboard immediately actionable for buyers.
- Add pagination to product and order queries using Retool's Pagination component linked to query page parameters — loading all records at once can be slow for large catalogs.
- Filter order queries by status in the URL parameters to separate pending, processing, and completed orders rather than fetching all and filtering in the UI — this reduces API response size and improves load speed.
- Add a date range filter to the orders Table so operations teams can focus on recent fulfillment activity without wading through historical records.
- Use Retool Workflows to schedule daily order status syncs and alert on orders that have been processing for more than your supplier's stated fulfillment time.
- Track supplier fulfillment metrics in a separate database table using snapshots from Spocket's API to build historical performance trends that the API itself does not provide.

## Use cases

### Build a supplier product catalog browser and comparison tool

Create a Retool dashboard that queries Spocket's product catalog with filters for category, price range, and shipping country. Display results in a Table with product image thumbnails, retail price, supplier price, and estimated shipping time. Add a multi-select to compare up to 5 products side-by-side in a detail panel showing margin calculations.

Prompt example:

```
Build a product catalog panel that lists Spocket products with columns for title, supplier price, retail price, margin percentage, and estimated US shipping time. Include filters for category and price range, and calculate the margin percentage automatically from the two price columns.
```

### Track order status and monitor fulfillment performance

Build a Retool order tracking dashboard that shows all Spocket orders with their current fulfillment status, supplier name, tracking numbers, and expected delivery dates. Add color-coded status indicators (green for delivered, yellow for in transit, red for delayed) and a bar chart showing fulfillment time distribution across suppliers.

Prompt example:

```
Build an order tracker panel that displays all active Spocket orders sorted by order date, with columns for order ID, customer name, supplier, fulfillment status, tracking number, and expected delivery. Flag orders older than 7 days as potentially delayed with a red status badge.
```

### Monitor supplier quality and delivery performance metrics

Create a Retool analytics dashboard that groups completed orders by supplier and calculates average fulfillment time, on-time delivery rate, and return rate for each. Display metrics in a Table ranked by overall performance score and a Chart comparing suppliers on key quality dimensions to guide future sourcing decisions.

Prompt example:

```
Build a supplier performance panel that shows each Spocket supplier's average fulfillment days, on-time rate, and order count from completed orders stored in a database. Rank suppliers by a weighted performance score and add a bar chart comparing the top 10 suppliers.
```

## Troubleshooting

### API queries return 401 Unauthorized or 403 Forbidden

Cause: The API key stored in Configuration Variables is incorrect, expired, or the Authorization header format does not match what Spocket's API expects.

Solution: In the Retool Resources tab, open the Spocket API resource and verify the Authorization header value is exactly Bearer {{ retoolContext.configVars.SPOCKET_API_KEY }} — note the space between 'Bearer' and the token reference. Check your Spocket account settings to confirm the API key is still active and has not been regenerated. If Spocket uses a different auth header name (such as X-Api-Key or Spocket-Token), update the header key accordingly based on Spocket's current API documentation.

### getProducts query returns an empty array even though products exist in the Spocket account

Cause: The API endpoint path is incorrect, a required query parameter is missing, or the API response wraps results in a nested object rather than returning a direct array.

Solution: Run the query and click the Query Inspector tab to see the raw response body. If products are nested inside a field (like { data: { products: [...] } }), add a query transformer that navigates to the correct field: return data.data.products. Verify the endpoint path against Spocket's API documentation — the exact path may include version prefixes like /api/v1/products. Also check whether a store_id parameter is required to scope results to a specific connected store.

### Product pricing fields show undefined or null values in the Table

Cause: Spocket's API uses different field names for pricing across different product types or API versions — wholesale_price, cost, suggested_retail_price, and msrp may all be used inconsistently.

Solution: Inspect the raw API response for a single product to identify the exact field names returned. Update the formatProducts transformer to check multiple field names using logical OR: const supplierPrice = parseFloat(product.wholesale_price || product.cost || product.supplier_price || 0). Add similar fallbacks for retail price fields. Log product keys with Object.keys(data[0]) in the transformer during debugging to see all available fields.

```
// Defensive price extraction with fallbacks
const supplierPrice = parseFloat(
  product.wholesale_price ||
  product.cost ||
  product.supplier_price ||
  product.purchase_price ||
  0
);
```

## Frequently asked questions

### Does Retool have a native Spocket connector?

No. Retool does not include a dedicated Spocket connector. You connect Spocket by configuring its REST API as a generic REST API Resource in Retool's Resources tab. Once the base URL and API key header are configured, all queries are built visually in Retool's query editor without needing to reference API documentation for individual requests.

### What Spocket plan is required to access the API?

API access is typically available on Spocket's paid plans (Pro and Empire tiers). The free Starter plan does not include API access. Check your current Spocket subscription in account settings — if you do not see an API key option, upgrading your plan or contacting Spocket support to request API access may be necessary.

### Can Retool automatically sync Spocket orders to my store's order management system?

Yes. You can build a Retool Workflow that runs on a schedule, queries Spocket's orders API for new or updated orders, and writes the data to your own database or sends it to another system via a REST API resource. This enables automated order status synchronization without manual exports. Alternatively, pair Retool with a Spocket-to-Shopify or Spocket-to-WooCommerce integration for real-time webhook-based sync, since Retool can trigger status update API calls when events occur in your primary store system.

### Can I compare Spocket suppliers against each other in a Retool dashboard?

Yes. By querying Spocket's product endpoints filtered by supplier and combining with your order history data, you can build comparison dashboards that show each supplier's average price, shipping time, product quality ratings, and fulfillment rate. Store completed order metrics in a database table and use Retool Charts to visualize supplier performance side-by-side — this provides insight that Spocket's native interface does not offer in a single view.

---

Source: https://www.rapidevelopers.com/retool-integrations/spocket
© RapidDev — https://www.rapidevelopers.com/retool-integrations/spocket