🐛[Bug] about discount-app-components

[knames]

Hi there, @Martin86Ec!

After replacing the <AppProvider> tag in Volumes/new.jsx with a <div> tag, the error stops.

I think the issue you are having is a result of having <AppProvider> in Volumes/new.jsx.

I followed along the steps from https://shopify.dev/apps/discounts/create up to the end of Step 2 and didn't see any issues.

You should have a DiscountProvider.jsx in frontend/components/providers

import { AppProvider } from '@shopify/discount-app-components'
import '@shopify/discount-app-components/build/esm/styles.css'
export function DiscountProvider({ children }) {
  return <AppProvider locale="en-US" ianaTimezone="America/Toronto">{children}</AppProvider>
}

as well as this line in frontend/components/providers/index.js after the other exports

export { DiscountProvider } from './DiscountProvider'

and then you should have

import {
  AppBridgeProvider,
  QueryProvider,
  PolarisProvider,
  DiscountProvider
} from "./components";

in frontend/App.jsx

and then you will want that provider you created to wrap the children there, so it might look like:

 return (
    <PolarisProvider>
      <BrowserRouter>
        <AppBridgeProvider>
          <DiscountProvider>  {/** here*/}
            <QueryProvider>
              <NavigationMenu
                navigationLinks={[
                  {
                    label: "Page name",
                    destination: "/pagename",
                  },
                ]}
              />
              <Routes pages={pages} />
            </QueryProvider>
          </DiscountProvider> {/** here*/}
        </AppBridgeProvider>
      </BrowserRouter>
    </PolarisProvider>
  );

Following step 2 in the Volumes/new.jsx will get you the new discount page, you shouldn't have any AppProviders in there. If you just copy the code from that page as is, it should display everything without issue.

I ran through this with the same npm/node/yarn versions as you and everything seemed to work.

Please feel free to reach out again if you have further issues!