Hi,

first of all: great baseline work! I forked this to have a base for my embedded apps.

I noticed a few missing parts to make this usable as a general base.

1. Dependencies

• The project had a lot of duplicate and outdated dependencies. I cleaned things up and bumped all dependencies to the latest version, excluding React.
• All Shopify packages are now up to date, including Polaris
• Apollo packages have been removed in favor of the new @apollo packages.

I replaced all mentions of other apollo packages with the new Apollo package, and fixed all loose ends regarding the ApolloClient

I added husky for precommit linting of the project.

Speaking of linting, using the next recommended base I fixed all open errors and warnings.

I also added a dockerfile and a docker compose file. This enables hot-reload development inside the container. No need to use vercel or a redis service provider, as this container setup includes redis.

TLDR: Now the project is usable out of the box.

Open issue: Session tokens do not get refreshed (like in the open issues)

Greetings,

I am currently modifying this on a fork. I got an error when trying to access your sample page.

nextjs-shopify-app-base-nextjs-1 | error - (api)/pages/api/products.js (10:53) @ WEBPACK_DEFAULT_EXPORT TypeError: Cannot read properties of undefined (reading 'shop') nextjs-shopify-app-base-nextjs-1 | 8 | nextjs-shopify-app-base-nextjs-1 | 9 | const session = await Shopify.Utils.loadCurrentSession(req, res, true); nextjs-shopify-app-base-nextjs-1 | > 10 | const client = new Shopify.Clients.Graphql(session.shop, session.accessToken); nextjs-shopify-app-base-nextjs-1 | | ^ nextjs-shopify-app-base-nextjs-1 | 11 | // Use client.get to request the specified Shopify GraphQL API endpoint, in this case products. nextjs-shopify-app-base-nextjs-1 | 12 | const products = await client.query({ nextjs-shopify-app-base-nextjs-1 | 13 | data: `{ nextjs-shopify-app-base-nextjs-1 | wait - compiling /_error (client and server)...

Redis is working correctly (seemingly), and it says there is one key in the database after installation.

nextjs-shopify-app-base-nextjs-1 | token record from redis: { nextjs-shopify-app-base-nextjs-1 | id: 'offline_REDACTED-development.myshopify.com', nextjs-shopify-app-base-nextjs-1 | shop: 'REDACTED-development.myshopify.com', nextjs-shopify-app-base-nextjs-1 | state: '628137656797721', nextjs-shopify-app-base-nextjs-1 | isOnline: false, nextjs-shopify-app-base-nextjs-1 | accessToken: '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', nextjs-shopify-app-base-nextjs-1 | scope: 'write_products,write_customers,write_draft_orders,write_files' nextjs-shopify-app-base-nextjs-1 | }

Do you have any idea what could be the problem? I changed the Redis loglevel to "Debug" and it does affirm one key in the database. I used the CLI to retrieve it and it looks okay ( i guess)

I am both new to Shopify aswell as Redis. My other sample app just used the InMemory storage, but since your project depends on having Redis, I am bumping into this issue. If you have any idea what could be the issue here I would be very thankful

The redirects work great on desktop, but on mobile it tries to take you to the app instead of the install page, which results in a "page not found" error on Shopify.

I can’t figure out what the issue is that it doesn’t want to redirect properly on mobile. Any ideas?

just to clarify, this is the redirect that happens when clicking "add app" from the listing page.

On a local env, it runs into trouble when it tries to fetch products. It appears that it's not able to get an online session

event - compiled client and server successfully in 438 ms (1421 modules)
error - (api)/pages/api/products.js (10:53) @ __WEBPACK_DEFAULT_EXPORT__
TypeError: Cannot read properties of undefined (reading 'shop')
   8 | 
   9 |   const session = await Shopify.Utils.loadCurrentSession(req, res);
> 10 |   const client = new Shopify.Clients.Graphql(session.shop, session.accessToken);