@shopify/shopify-app-remix 2.7.0 → 2.8.1

package/dist/ts/server/authenticate/public/appProxy/types.d.ts

@@ -0,0 +1,201 @@
+import { Session, ShopifyRestResources } from '@shopify/shopify-api';
+import { AdminApiContext, StorefrontContext } from '../../../clients';
+export type AuthenticateAppProxy = (request: Request) => Promise<AppProxyContext | AppProxyContextWithSession>;
+interface Options {
+    /**
+     * Whether to use the shop's theme layout around the Liquid content.
+     */
+    layout?: boolean;
+}
+export type LiquidResponseFunction = (body: string, initAndOptions?: number | (ResponseInit & Options)) => Response;
+interface Context {
+    /**
+     * A utility for creating a Liquid Response.
+     *
+     * @example
+     * <caption>Rendering liquid content.</caption>
+     * <description>Use the `liquid` helper to render a `Response` with Liquid content using the shop's theme. See the [Liquid reference](https://shopify.dev/docs/api/liquid) for all the features it enables.</description>
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import {authenticate} from "~/shopify.server"
+     *
+     * export async function loader({ request }) {
+     *   const {liquid} = await authenticate.public.appProxy(request);
+     *
+     *   return liquid("Hello {{shop.name}}");
+     * }
+     * ```
+     *
+     * @example
+     * <caption>Rendering liquid content without a layout.</caption>
+     * <description>Set the `layout` option to `false` to render the Liquid content without a theme.</description>
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import {authenticate} from "~/shopify.server"
+     *
+     * export async function loader({ request }) {
+     *   const {liquid} = await authenticate.public.appProxy(request);
+     *
+     *   return liquid(
+     *     "Hello {{shop.name}}",
+     *     { layout: false }
+     *   );
+     * }
+     * ```
+     *
+     * @example
+     * <caption>Rendering a form in a Liquid response.</caption>
+     * <description>Handle form submissions through an app proxy.</description>
+     * ```ts
+     * // app/routes/apps.proxy.my-action.tsx
+     * import { redirect } from "@remix-run/node";
+     * import { authenticate } from "~/shopify.server";
+     *
+     * export async function loader({ request }) {
+     *   const { liquid } = await authenticate.public.appProxy(request);
+     *
+     *   return liquid(`
+     *     <form method="post" action="/apps/proxy/my-action">
+     *       <input type="text" name="field" />
+     *       <button type="submit">Submit</button>
+     *     </form>
+     *   `);
+     * }
+     *
+     * export async function action({ request }) {
+     *   await authenticate.public.appProxy(request);
+     *
+     *   const formData = await request.formData();
+     *   const field = formData.get("field")?.toString();
+     *
+     *   // Perform actions here
+     *   if (field) {
+     *     console.log("Field:", field);
+     *   }
+     *
+     *   // Return to the form page
+     *   return redirect("/apps/proxy/my-action");
+     * }
+     * ```
+     */
+    liquid: LiquidResponseFunction;
+}
+export interface AppProxyContext extends Context {
+    /**
+     * No session is available for the shop that made this request.
+     *
+     * This comes from the session storage which `shopifyApp` uses to store sessions in your database of choice.
+     */
+    session: undefined;
+    /**
+     * No session is available for the shop that made this request.
+     * Therefore no methods for interacting with the GraphQL / REST Admin APIs are available.
+     */
+    admin: undefined;
+    /**
+     * No session is available for the shop that made this request.
+     * Therefore no method for interacting with the Storefront API is available.
+     */
+    storefront: undefined;
+}
+export interface AppProxyContextWithSession<Resources extends ShopifyRestResources = ShopifyRestResources> extends Context {
+    /**
+     * The session for the shop that made the request.
+     *
+     * This comes from the session storage which `shopifyApp` uses to store sessions in your database of choice.
+     *
+     * Use this to get shop or user-specific data.
+     *
+     * @example
+     * <caption>Using the session object.</caption>
+     * <description>Get the session for the shop that initiated the request to the app proxy.</description>
+     * ```ts
+     * // app/routes/**\/.ts
+     * import { json } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     * import { getMyAppModelData } from "~/db/model.server";
+     *
+     * export const loader = async ({ request }) => {
+     *   // Get the session for the shop that initiated the request to the app proxy.
+     *   const { session } =
+     *     await authenticate.public.appProxy(request);
+     *
+     *   // Use the session data to make to queries to your database or additional requests.
+     *   return json(
+     *     await getMyAppModelData({shop: session.shop})
+     *   );
+     * };
+     * ```
+     */
+    session: Session;
+    /**
+     * Methods for interacting with the GraphQL / REST Admin APIs for the store that made the request.
+     *
+     * @example
+     * <caption>Interacting with the Admin API.</caption>
+     * <description>Use the `admin` object to interact with the REST or GraphQL APIs.</description>
+     * ```ts
+     * // app/routes/**\/.ts
+     * import { json } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export async function action({ request }: ActionFunctionArgs) {
+     *   const { admin } = await authenticate.public.appProxy(request);
+     *
+     *   const response = await admin.graphql(
+     *     `#graphql
+     *     mutation populateProduct($input: ProductInput!) {
+     *       productCreate(input: $input) {
+     *         product {
+     *           id
+     *         }
+     *       }
+     *     }`,
+     *     {
+     *       variables: {
+     *         input: { title: "Product Name" }
+     *       }
+     *     }
+     *   );
+     *
+     *   const productData = await response.json();
+     *   return json({ data: productData.data });
+     * }
+     * ```
+     */
+    admin: AdminApiContext<Resources>;
+    /**
+     * Method for interacting with the Shopify Storefront Graphql API for the store that made the request.
+     *
+     * @example
+     * <caption>Interacting with the Storefront API.</caption>
+     * <description>Use the `storefront` object to interact with the GraphQL API.</description>
+     * ```ts
+     * // app/routes/**\/.ts
+     * import { json } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export async function action({ request }: ActionFunctionArgs) {
+     *   const { storefront } = await authenticate.public.appProxy(request);
+     *
+     *   const response = await storefront.graphql(
+     *     `#graphql
+     *     query blogIds {
+     *       blogs(first: 10) {
+     *         edges {
+     *           node {
+     *             id
+     *           }
+     *         }
+     *       }
+     *     }`
+     *   );
+     *
+     *   return json(await response.json());
+     * }
+     * ```
+     */
+    storefront: StorefrontContext;
+}
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/ts/server/authenticate/public/appProxy/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/server/authenticate/public/appProxy/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,oBAAoB,EAAC,MAAM,sBAAsB,CAAC;AAEnE,OAAO,EAAC,eAAe,EAAE,iBAAiB,EAAC,MAAM,kBAAkB,CAAC;AAEpE,MAAM,MAAM,oBAAoB,GAAG,CACjC,OAAO,EAAE,OAAO,KACb,OAAO,CAAC,eAAe,GAAG,0BAA0B,CAAC,CAAC;AAE3D,UAAU,OAAO;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,sBAAsB,GAAG,CACnC,IAAI,EAAE,MAAM,EACZ,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,YAAY,GAAG,OAAO,CAAC,KAC/C,QAAQ,CAAC;AAEd,UAAU,OAAO;IACf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAoEG;IACH,MAAM,EAAE,sBAAsB,CAAC;CAChC;AAED,MAAM,WAAW,eAAgB,SAAQ,OAAO;IAC9C;;;;OAIG;IACH,OAAO,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,UAAU,EAAE,SAAS,CAAC;CACvB;AAED,MAAM,WAAW,0BAA0B,CACzC,SAAS,SAAS,oBAAoB,GAAG,oBAAoB,CAC7D,SAAQ,OAAO;IACf;;;;;;;;;;;;;;;;;;;;;;;;;;;OA2BG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAkCG;IACH,KAAK,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IAElC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA8BG;IACH,UAAU,EAAE,iBAAiB,CAAC;CAC/B"}

package/dist/ts/server/authenticate/public/checkout/authenticate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"authenticate.d.ts","sourceRoot":"","sources":["../../../../../../src/server/authenticate/public/checkout/authenticate.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAShD,OAAO,KAAK,EAAC,oBAAoB,EAAkB,MAAM,SAAS,CAAC;AAEnE,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,WAAW,GAClB,oBAAoB,CAkCtB"}

package/dist/ts/server/boundary/index.d.ts

@@ -0,0 +1,38 @@
+import { headersBoundary } from './headers';
+import { errorBoundary } from './error';
+/**
+ * A collection of functions that handle the necessary code for error boundaries in routes using authenticate.admin.
+ */
+export declare const boundary: {
+    /**
+     * A function that handles errors or thrown responses.
+     *
+     * @example
+     * <caption>Catching errors in a route</caption>
+     * ```ts
+     * // /app/routes/admin/widgets.ts
+     * import { boundary } from "@shopify/shopify-app-remix/server";
+     *
+     * export function ErrorBoundary() {
+     *   return boundary.error(useRouteError());
+     * }
+     * ```
+     */
+    error: typeof errorBoundary;
+    /**
+     * A function that sets the appropriate document response headers.
+     *
+     * @example
+     * <caption>Catching errors in a route</caption>
+     * ```ts
+     * // /app/routes/admin/widgets.ts
+     * import { boundary } from "@shopify/shopify-app-remix/server";
+     *
+     * export const headers = (headersArgs) => {
+     *   return boundary.headers(headersArgs);
+     * };
+     * ```
+     */
+    headers: typeof headersBoundary;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/ts/server/clients/admin/types.d.ts

@@ -0,0 +1,242 @@
+import { Session, ShopifyRestResources } from '@shopify/shopify-api';
+import { AdminOperations } from '@shopify/admin-api-client';
+import { BasicParams } from '../../types';
+import { GraphQLClient } from '../types';
+import type { RestClientWithResources } from './rest';
+export interface AdminClientOptions {
+    params: BasicParams;
+    session: Session;
+    handleClientError?: HandleAdminClientError;
+}
+export type HandleAdminClientError = (arg: {
+    error: any;
+    params: BasicParams;
+    session: Session;
+}) => Promise<void>;
+export interface AdminApiContext<Resources extends ShopifyRestResources = ShopifyRestResources> {
+    /**
+     * Methods for interacting with the Shopify Admin REST API
+     *
+     * There are methods for interacting with individual REST resources. You can also make `GET`, `POST`, `PUT` and `DELETE` requests should the REST resources not meet your needs.
+     *
+     * {@link https://shopify.dev/docs/api/admin-rest}
+     *
+     * @example
+     * <caption>Using REST resources.</caption>
+     * <description>Getting the number of orders in a store using REST resources. Visit the [Admin REST API references](/docs/api/admin-rest) for examples on using each resource. </description>
+     *
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import { LoaderFunctionArgs, json } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export const loader = async ({ request }: LoaderFunctionArgs) => {
+     *   const {
+     *     admin,
+     *     session,
+     *   } = await authenticate.admin(request);
+     *
+     *   return json(
+     *     admin.rest.resources.Order.count({ session }),
+     *   );
+     * };
+     * ```
+     *
+     * ```ts
+     * // /app/shopify.server.ts
+     * import { shopifyApp } from "@shopify/shopify-app-remix/server";
+     * import { restResources } from "@shopify/shopify-api/rest/admin/2023-07";
+     *
+     * const shopify = shopifyApp({
+     *   restResources,
+     *   // ...etc
+     * });
+     * export default shopify;
+     * export const authenticate = shopify.authenticate;
+     * ```
+     *
+     * @example
+     * <caption>Performing a GET request to the REST API.</caption>
+     * <description>Use `admin.rest.get` to make custom requests to make a request to to the `customer/count` endpoint</description>
+     *
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import { LoaderFunctionArgs, json } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export const loader = async ({ request }: LoaderFunctionArgs) => {
+     *   const {
+     *     admin,
+     *     session,
+     *   } = await authenticate.admin(request);
+     *
+     *   const response = await admin.rest.get({
+     *     path: "/customers/count.json",
+     *   });
+     *   const customers = await response.json();
+     *
+     *   return json({ customers });
+     * };
+     * ```
+     *
+     * ```ts
+     * // /app/shopify.server.ts
+     * import { shopifyApp } from "@shopify/shopify-app-remix/server";
+     * import { restResources } from "@shopify/shopify-api/rest/admin/2023-04";
+     *
+     * const shopify = shopifyApp({
+     *   restResources,
+     *   // ...etc
+     * });
+     * export default shopify;
+     * export const authenticate = shopify.authenticate;
+     * ```
+     *
+     * @example
+     * <caption>Performing a POST request to the REST API.</caption>
+     * <description>Use `admin.rest.post` to make custom requests to make a request to to the `customers.json` endpoint to send a welcome email</description>
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import { LoaderFunctionArgs, json } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export const loader = async ({ request }: LoaderFunctionArgs) => {
+     *   const {
+     *     admin,
+     *     session,
+     *   } = await authenticate.admin(request);
+     *
+     *   const response = admin.rest.post({
+     *     path: "customers/7392136888625/send_invite.json",
+     *     body: {
+     *       customer_invite: {
+     *         to: "new_test_email@shopify.com",
+     *         from: "j.limited@example.com",
+     *         bcc: ["j.limited@example.com"],
+     *         subject: "Welcome to my new shop",
+     *         custom_message: "My awesome new store",
+     *       },
+     *     },
+     *   });
+     *
+     *   const customerInvite = await response.json();
+     *   return json({ customerInvite });
+     * };
+     * ```
+     *
+     * ```ts
+     * // /app/shopify.server.ts
+     * import { shopifyApp } from "@shopify/shopify-app-remix/server";
+     * import { restResources } from "@shopify/shopify-api/rest/admin/2023-04";
+     *
+     * const shopify = shopifyApp({
+     *   restResources,
+     *   // ...etc
+     * });
+     * export default shopify;
+     * export const authenticate = shopify.authenticate;
+     * ```
+     */
+    rest: RestClientWithResources<Resources>;
+    /**
+     * Methods for interacting with the Shopify Admin GraphQL API
+     *
+     * {@link https://shopify.dev/docs/api/admin-graphql}
+     * {@link https://github.com/Shopify/shopify-app-js/blob/main/packages/apps/shopify-api/docs/reference/clients/Graphql.md}
+     *
+     * @example
+     * <caption>Querying the GraphQL API.</caption>
+     * <description>Use `admin.graphql` to make query / mutation requests.</description>
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import { ActionFunctionArgs } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export const action = async ({ request }: ActionFunctionArgs) => {
+     *   const { admin } = await authenticate.admin(request);
+     *
+     *   const response = await admin.graphql(
+     *     `#graphql
+     *     mutation populateProduct($input: ProductInput!) {
+     *       productCreate(input: $input) {
+     *         product {
+     *           id
+     *         }
+     *       }
+     *     }`,
+     *     {
+     *       variables: {
+     *         input: { title: "Product Name" },
+     *       },
+     *     },
+     *   );
+     *
+     *   const productData = await response.json();
+     *   return json({
+     *     productId: productData.data?.productCreate?.product?.id,
+     *   });
+     * }
+     * ```
+     *
+     * ```ts
+     * // /app/shopify.server.ts
+     * import { shopifyApp } from "@shopify/shopify-app-remix/server";
+     *
+     * const shopify = shopifyApp({
+     *   // ...
+     * });
+     * export default shopify;
+     * export const authenticate = shopify.authenticate;
+     * ```
+     *
+     * @example
+     * <caption>Handling GraphQL errors.</caption>
+     * <description>Catch `GraphqlQueryError` errors to see error messages from the API.</description>
+     * ```ts
+     * // /app/routes/**\/*.ts
+     * import { ActionFunctionArgs } from "@remix-run/node";
+     * import { authenticate } from "../shopify.server";
+     *
+     * export const action = async ({ request }: ActionFunctionArgs) => {
+     *   const { admin } = await authenticate.admin(request);
+     *
+     *   try {
+     *     const response = await admin.graphql(
+     *       `#graphql
+     *       query incorrectQuery {
+     *         products(first: 10) {
+     *           nodes {
+     *             not_a_field
+     *           }
+     *         }
+     *       }`,
+     *     );
+     *
+     *     return json({ data: await response.json() });
+     *   } catch (error) {
+     *     if (error instanceof GraphqlQueryError) {
+     *       // error.body.errors:
+     *       // { graphQLErrors: [
+     *       //   { message: "Field 'not_a_field' doesn't exist on type 'Product'" }
+     *       // ] }
+     *       return json({ errors: error.body?.errors }, { status: 500 });
+     *     }
+     *     return json({ message: "An error occurred" }, { status: 500 });
+     *   }
+     * }
+     * ```
+     *
+     * ```ts
+     * // /app/shopify.server.ts
+     * import { shopifyApp } from "@shopify/shopify-app-remix/server";
+     *
+     * const shopify = shopifyApp({
+     *   // ...
+     * });
+     * export default shopify;
+     * export const authenticate = shopify.authenticate;
+     * ```
+     */
+    graphql: GraphQLClient<AdminOperations>;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/ts/server/version.d.ts

@@ -0,0 +1,2 @@
+export declare const SHOPIFY_REMIX_LIBRARY_VERSION = "2.8.1";
+//# sourceMappingURL=version.d.ts.map