Installing custom app

[Tiwa_Ojo]

Hey @Paige-Shopify, Thanks for the reply. I have tried both approaches(setting use_legacy_install_flow=true/false), neither have worked. Attached below is a sample of my code

import '@shopify/shopify-api/adapters/cf-worker';
import { shopifyApi } from '@shopify/shopify-api';

export default {
  async fetch(request: Request, env: Env, ctx: ExecutionContext): Promise<Response> {
    // extract the pathname from the request URL
    const url = new URL(request.url);
    const params = new URLSearchParams(url.search);

    const api = shopifyApi({
      apiKey: env.SHOPIFY_API_KEY,
      apiSecretKey: env.SHOPIFY_API_SECRET,
      scopes: env.SHOPIFY_SCOPES,
      hostScheme: "https", //url.protocol.includes('https') ? 'https' : 'http',
      // ...other configurations like hostName, sessionStorage, etc.
    });

    let shopifyGraphqlClient;

    switch (url.pathname) {
      case "/auth":
        const shop =
          api.utils.sanitizeShop(`${params.get("shop")}.myshopify.com`, true) ||
          "";

        // Reference: https://github.com/Shopify/shopify-app-js/blob/main/packages/apps/shopify-api/docs/reference/auth/begin.md
        const res = await api.auth.begin({
          isOnline: false,
          rawRequest: request,
          // This should be the same as the "Redirect URL" in your app setup in the Partner Dashboard
          callbackPath: "/auth/callback", // `${url.origin}/auth/callback`,
          shop: shop,
        });

        return res;
      case "/auth/callback":
        // Reference: https://github.com/Shopify/shopify-app-js/blob/main/packages/apps/shopify-api/docs/reference/auth/callback.md
        const callback =
          (await api.auth.callback) <
          Headers >
          {
            rawRequest: request,
          };

        console.debug(callback.session);

        // TODO: Create GraphqlClient, add session token to KV storage, and create/update the metafield with the session info
        shopifyGraphqlClient = new api.clients.Graphql({
          session: callback.session,
        });

        // The callback returns some HTTP headers, but you can redirect to any route here
        return new Response("", {
          status: 302,
          headers: [...callback.headers, ["Location", "/"]],
        });
    }

    // Example GraphQL query using the shopifyGraphqlClient
    const ProductVariantsListDocument = /* GraphQL */ `
      query ProductVariantsList(
        $first: Int!
        $after: String
        $query: String
        $sortKey: ProductVariantSortKeys
        $reverse: Boolean
      ) {
        productVariants(
          first: $first
          after: $after
          query: $query
          sortKey: $sortKey
          reverse: $reverse
        ) {
          edges {
            cursor
            node {
              id
              title
              sku
            }
          }
          pageInfo {
            hasNextPage
          }
        }
      }
    `;
    const response =
      (await shopifyGraphqlClient.request) <
      ProductVariantsListQuery >
      (ProductVariantsListDocument,
      {
        variables: {
          first,
          after,
          query,
          sortKey,
          reverse,
        },
      });

    console.log(response);
  },
};

The results I get is below

Furthermore, I have tried installing via incognito mode and on a different browser(Edge & Firefox)

I am using Cloudflare Workers and developing within a docker container with a --net= host.