AppBridgeError: APP::ERROR::INVALID_CONFIG: host must be provided

 6  pages/_app.js 

		@@ -51,13 +51,13 @@ function MyProvider(props) {
		class MyApp extends App {
		render() {
		const { Component, pageProps, shopOrigin } = this.props;//add
		const { Component, pageProps, host } = this.props;
		return (
		<AppProvider i18n={translations}>
		<Provider
		config={{
		apiKey: API_KEY,
		shopOrigin: shopOrigin,
		host: host,
		forceRedirect: true,
		}}
		>
		@@ -70,7 +70,7 @@ class MyApp extends App {
		MyApp.getInitialProps = async ({ ctx }) => {
		return {
		shopOrigin: ctx.query.shop,//add
		host: ctx.query.host,
		};
		};

 3  server/server.js 

		@@ -39,6 +39,7 @@ app.prepare().then(async () => {
		async afterAuth(ctx) {
		// Access token and shop available in ctx.state.shopify
		const { shop, accessToken, scope } = ctx.state.shopify;
		const host = ctx.query.host;
		ACTIVE_SHOPIFY_SHOPS[shop] = scope;
		const response = await Shopify.Webhooks.Registry.register({
		@@ -57,7 +58,7 @@ app.prepare().then(async () => {
		}
		// Redirect to app with shop parameter upon auth
		ctx.redirect(`/?shop=${shop}`);//add
		ctx.redirect(`/?shop=${shop}&host=${host}`);
		},
		})
		);