🐛[Bug] Support for `@shopify/app-bridge-react` V4 about discount-app-components HOT 19 CLOSED

@devisscher
When will this be addressed? It will be involved in the release of our app.

from discount-app-components.

Hey team/ @devisscher!

Just checking in for an update on this as it has been three weeks without an update. Can we please get an outline of where we are at with this?

from discount-app-components.

Running into the same issue too, which is preventing us from building a critical discount bundle app. Following the latest official guide to a tee does not help either.

Tried downgrading to V3, but that either fails with

[vite] Named export 'Provider' not found. The requested module '@shopify/app-bridge-react' is a CommonJS module, which may not support all module.exports as named exports.

or, when following the default export suggestion, does compile, but then clicks and other events stop working entirely.

from discount-app-components.

We are facing this issue too. An update would be good please. Thanks.

from discount-app-components.

Running into the same issue too, which is preventing us from building a critical discount bundle app. Following the latest official guide to a tee does not help either.

Tried downgrading to V3, but that either fails with

[vite] Named export 'Provider' not found. The requested module '@shopify/app-bridge-react' is a CommonJS module, which may not support all module.exports as named exports.

or, when following the default export suggestion, does compile, but then clicks and other events stop working entirely.

@echocrow

I was having the same issue, whereby even after downgrading, the commonJs error was being throw.

It turns out the issue is with the new vite + remix integration.

I was able to fix the issue by following this guide, specifically by using the vite-plugin-cjs-interop plugin plugin.

// vite.config.js
cjsInterop({
      // List of CJS dependencies that require interop
      dependencies: ["@shopify/app-bridge-react"],
}),

from discount-app-components.

@polymorphtech

I believe this is an issue with vite remix.

You can import the polarisStyles directly into your base component and can remove the link export.

(Note: I am not the best to listen to here and would love someone to add more technical context. I'm 🤠ing it)

import "@shopify/polaris/build/esm/styles.css";

// export const links = () => [{ rel: "stylesheet", href: polarisStyles }];

from discount-app-components.

@devisscher I see there is now a PR in for the fix. Any news on when that might get reviewed and merged please?

from discount-app-components.

I'm facing this issue while following the official guide: https://shopify.dev/docs/apps/selling-strategies/discounts/experience/ui

The lack of documentation versioning and package version specs in the documentation has been a challenge.

from discount-app-components.

I created a fork of this repository to fix the issue and successfully built my remix app using @shopify/app-bridge-react V4 https://github.com/Alpha-Omega-Agency/discount-app-components.
I didn't open the PR because there is an error with const redirect = Redirect.create(app); that I'm not sure how to fix, so I just ignored it because it isn't impacting my code.

from discount-app-components.

The CJS Interop plugin removes the vite error. But in the browser console, we now observe

Uncaught SyntaxError: The requested module '/node_modules/@shopify/polaris/build/esm/styles.css?t=1713557476064' does not provide an export named 'default' (at app.tsx:4:1)

from discount-app-components.

Could you provide an update on this issue? I would appreciate it if you could update it if possible.

from discount-app-components.

@devisscher Can you share any updates on this issue? Thanks!

from discount-app-components.

I didn't open the PR because there is an error with const redirect = Redirect.create(app); that I'm not sure how to fix, so I just ignored it because it isn't impacting my code.

@paulomenezes I believe all uses of redirect can be replaced with e.g. open('/settings', '_self'); see https://shopify.dev/docs/api/app-bridge-library/apis/navigation tap Javascript tab for each example.

Have you come across any other issues using your fork? I haven't reviewed your fork yet, but am concerned that this packages use of localization maybe affected.

from discount-app-components.

Hi @devisscher, is there a status update on this bug? Waiting on resolution and cannot continue our development.

from discount-app-components.

I think its faster to make changes in lib manually and use patch-package. Just need to re-develop Picker component.

from discount-app-components.

@devisscher @mathiusj
I hope this issue will be resolved and released soon. We are looking forward to the update of app-bridge as soon as possible.

from discount-app-components.

I just created a new app and wanted to add this discount-app-components, which of course fails

npm ERR! Found: @shopify/[email protected]
npm ERR! node_modules/@shopify/app-bridge-react
npm ERR!   @shopify/app-bridge-react@"^4.1.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @shopify/app-bridge-react@"^3.7.7" from @shopify/[email protected]
npm ERR! node_modules/@shopify/discount-app-components
npm ERR!   dev @shopify/discount-app-components@"*" from the root project

Now I see that you might be close to merge the PR, looking forward to that.
Any est about when this would be available as a release, even if its just a beta or dev?
This would help in making decisions, about my own deadlines :)

Wondering if I could just workaround somehow for the moment, downgrade to v3 or something else.
Maybe it would be even possible to use npm aliases to install both packages at the moment?

from discount-app-components.

I used @paulomenezes fork of the repo in our app, which is being used in production, instead of the default one, and am having good success with.
I am still hopeful we will get an official update soon though, as I don't like being dependent on the fork.

from discount-app-components.

Hi @devisscher ! I see this closed, but there is no release yet.
Is someone going to deal with the release PR? :) Or any plans when you are going to do that?
Thx!

from discount-app-components.