shopify-nuxt 0.0.12 → 0.0.13

package/README.md

@@ -16,6 +16,26 @@ It builds on the `@shopify/shopify-api` package and creates a Nuxt module layer
 
 > **Note**: this package will enable your app's backend to work with Shopify APIs, and by default it will behave as an [embedded app](https://shopify.dev/docs/apps/auth/oauth/session-tokens). It uses the CDN-based [Shopify App Bridge](https://shopify.dev/docs/apps/tools/app-bridge) for frontend authentication.
 
+## How is this different from `@nuxtjs/shopify`?
+
+[`@nuxtjs/shopify`](https://shopify.nuxtjs.org) and `shopify-nuxt` solve completely different problems — you may even use both in the same project.
+
+|                               | [`@nuxtjs/shopify`](https://shopify.nuxtjs.org) | `shopify-nuxt` (this package)               |
+| ----------------------------- | ----------------------------------------------- | ------------------------------------------- |
+| **Use case**                  | Headless storefront                             | Shopify admin app (embedded)                |
+| **Who it's for**              | Merchants building custom storefronts           | Developers building Shopify apps            |
+| **Authentication**            | Static access token in config                   | OAuth + per-merchant session token exchange |
+| **Runs inside Shopify Admin** | No                                              | Yes (App Bridge iframe)                     |
+| **App Bridge**                | No                                              | Yes — CDN-based, auto-injected              |
+| **Webhooks**                  | No                                              | Yes — HMAC-verified                         |
+| **Billing API**               | No                                              | Yes                                         |
+| **Per-shop session storage**  | No                                              | Yes — pluggable adapters                    |
+| **Equivalent to**             | Shopify Hydrogen / storefront SDKs              | `@shopify/shopify-app-react-router`         |
+
+**Use `@nuxtjs/shopify`** if you want to build a custom Nuxt storefront that queries products, collections, and customer data from a Shopify store using the Storefront or Admin API with a static token.
+
+**Use `shopify-nuxt`** if you are building a Shopify app — something that runs inside the Shopify Admin, authenticates merchants via OAuth, handles session tokens, manages webhooks, and optionally charges merchants via the Billing API.
+
 ## Requirements
 
 To follow these usage guides, you will need to:

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "shopify-nuxt",
   "configKey": "shopify",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/runtime/composables/useShopifyFetch.d.ts

@@ -1,8 +1,10 @@
 import type { NitroFetchRequest, TypedInternalResponse, AvailableRouterMethod } from 'nitropack/types';
 import type { RouterMethod } from 'h3';
 type ShopifyFetchData<T, R extends NitroFetchRequest, M extends RouterMethod> = [T] extends [undefined] ? TypedInternalResponse<R, unknown, M> : T;
+type QueryParams = Record<string, string | number | boolean | null | undefined>;
 export declare function useShopifyFetch<T = undefined, R extends NitroFetchRequest = NitroFetchRequest, M extends AvailableRouterMethod<R> = 'get' extends AvailableRouterMethod<R> ? 'get' : AvailableRouterMethod<R>>(url: R, options?: Omit<RequestInit, 'method'> & {
     method?: Uppercase<M> | M;
+    query?: QueryParams;
 }): Promise<{
     data: ShopifyFetchData<T, R, Extract<Lowercase<M>, RouterMethod>>;
     response: Response;

package/dist/runtime/composables/useShopifyFetch.js

@@ -1,6 +1,6 @@
 import { useNuxtApp, useRequestEvent } from "#app";
 export async function useShopifyFetch(url, options) {
-  const opts = options ?? {};
+  const { query, ...opts } = options ?? {};
   if (import.meta.server) {
     const event = useRequestEvent();
     const headers2 = {};
@@ -18,7 +18,8 @@ export async function useShopifyFetch(url, options) {
     const fetchResponse2 = await globalThis.$fetch.raw(url, {
       ...rest,
       method,
-      headers: headers2
+      headers: headers2,
+      query
     });
     return { data: fetchResponse2._data, response: fetchResponse2 };
   }
@@ -32,7 +33,18 @@ export async function useShopifyFetch(url, options) {
   const token = await shopify.idToken();
   const headers = new Headers(opts.headers || {});
   headers.set("Authorization", `Bearer ${token}`);
-  const fetchResponse = await fetch(url, {
+  let resolvedUrl = url;
+  if (query) {
+    const params = new URLSearchParams();
+    for (const [key, value] of Object.entries(query)) {
+      if (value !== null && value !== void 0) {
+        params.set(key, String(value));
+      }
+    }
+    const qs = params.toString();
+    if (qs) resolvedUrl += (resolvedUrl.includes("?") ? "&" : "?") + qs;
+  }
+  const fetchResponse = await fetch(resolvedUrl, {
     ...opts,
     headers
   });

package/dist/runtime/server/utils/authenticate-admin.d.ts

@@ -1,5 +1,6 @@
 import type { H3Event } from 'h3';
 import type { AdminContext } from '../../types.js';
+import type { JwtPayload } from '@shopify/shopify-api';
 /**
  * Authenticate an admin request and return an authenticated admin context.
  *
@@ -14,4 +15,4 @@ import type { AdminContext } from '../../types.js';
  * })
  * ```
  */
-export declare function useShopifyAdmin(event: H3Event): Promise<AdminContext>;
+export declare function useShopifyAdmin<T extends object = JwtPayload>(event: H3Event): Promise<AdminContext<T>>;

package/dist/runtime/types.d.ts

@@ -87,13 +87,13 @@ export interface ShopifyRuntimeConfig {
     /** Billing configuration */
     billing?: Record<string, any>;
 }
-export interface AdminContext {
+export interface AdminContext<T extends object = JwtPayload> {
     /** The authenticated session */
     session: Session;
     /** Admin API client (graphql + rest) */
     admin: AdminApiContext;
     /** The decoded session token (embedded apps only) */
-    sessionToken?: JwtPayload;
+    sessionToken?: T;
     /** Billing helpers */
     billing: BillingContext;
     /** CORS header helper */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "shopify-nuxt",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "description": "Shopify app integration for Nuxt - authentication, webhooks, billing, and App Bridge",
   "repository": "kiriminaja/shopify-nuxt",
   "license": "MIT",