Expose RemixRestClient and GraphQLClient types for @shopify/shopify-app-remix

[geongeorge]

Overview/summary

I want to pass my admin rest or graphql api client in a seperate server file in remix js. But the types are not exposed.

export const loader = async ({ request }: LoaderFunctionArgs) => {
  const { session, admin } = await authenticate.admin(request);

  const themes = await getThemes(session, admin.rest);

  return json({ themes });
};

I want to do something like this in another file but I do not see any export from the library for RestClient or GraphqlClients

export async function getThemes(session: Session, rest: RemixRestClient) {

   const themes = await rest.resources.Theme.all({ session: session });

  return themes;
}

Note

If this is a generic type which is generated when running shopifyApp({..}) It will be also great if this can be accessed through the returned object so I can reexport from the shopify.server.ts file

[matteodepalo]

Hi @geongeorge, thank you for opening this issue. I've put it in the backlog so that my team can consider it.

[geongeorge]

Hi @matteodepalo Because module resolution is not node in the remix app, I'm not able to import types for shopify resources as well from the api. I cannot get the Theme, Product, Etc type from this package as well.

export async function getJobs(shopName: string, themes: Theme) {
  ...
}

[geongeorge]

I managed to extract the types from the shopify.server.ts file like so. Using it in our custom starter:

/* Getting types */
export type AdminMain = Awaited<ReturnType<typeof authenticate.admin>>;

export type AdminApiContext = AdminMain["admin"];
export type AdminApiSession = AdminMain["session"];

export type AdminGraphqlClient = AdminApiContext["graphql"];
export type AdminRestClient = AdminApiContext["rest"];

[github-actions[bot]]

We're labeling this issue as stale because there hasn't been any activity on it for 60 days. While the issue will stay open and we hope to resolve it, this helps us prioritize community requests.

You can add a comment to remove the label if it's still relevant, and we can re-evaluate it.

[RobRoseKnows]

This has been very frustrating. I was trying to adapt your starter QRCode example from JavaScript to TypeScript, and it means I need types that simply are not exposed from the package. https://shopify.dev/docs/apps/getting-started/build-qr-code-app

[Xmaster6y]

I guess #879 solved this issue as you can now do:

import type { AdminGraphqlClient, AdminRestClient } from "@shopify/shopify-app-remix/server";

export async function loader({ request }: LoaderFunctionArgs) {
  const { admin, session } = await authenticate.admin(request);
  admin.rest as AdminRestClient;
  admin.graphql as AdminGraphqlClient;
  ...
}

[mschinis]

I had a similar issue with accessing "AdminApiContext" and importing it via @shopify/shopify-app-remix/server fixed it for me.