Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Remove dependency on App Bridge React and update navigation patterns and components #203

Merged
merged 1 commit into from
May 16, 2024
Merged

Remove dependency on App Bridge React and update navigation patterns and components #203

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 11 additions & 0 deletions .changeset/light-gifts-relate.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
---
'@shopify/discount-app-components': major
---

Support App Bridge React V4

- Remove dependency on App Bridge React V4.
- Update readme to explain how to use discount-app-components with App Bridge React V4.
- Removed navigation utilities included in this library in favor of App Bridge React patterns to be used in App.
- Updated the CombinationCard to remove the ability to open the DiscountCombinationModal. This is no longer supported in App Bridge React.
- Removed HelpText component.
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,4 @@ node_modules
.idea
.vscode/*
coverage
yalc.lock
32 changes: 6 additions & 26 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
[![npm Package Version](https://img.shields.io/npm/v/@shopify/discount-app-components)](https://www.npmjs.com/package/@shopify/discount-app-components)
[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](LICENSE.md)

`@shopify/discount-app-components` provides a set of stateless discount components to help 3p app developers create [AppBridge](https://shopify.dev/apps/tools/app-bridge)-powered discounts apps.
`@shopify/discount-app-components` provides a set of stateless discount components to help 3p app developers create discounts apps.

## Note on updates

Expand Down Expand Up @@ -31,7 +31,7 @@ If you prefer [Yarn](https://yarnpkg.com/en/), use the following command instead
yarn add @shopify/discount-app-components
```

> 🛑 The project has `peerDependencies` of `@shopify/app-bridge`, `@shopify/app-bridge-react`, and `@shopify/polaris` which must also be installed in your app.
> 🛑 The project has `peerDependencies` of `@shopify/app-bridge`, and `@shopify/polaris` which must also be installed in your app.

### Usage

Expand All @@ -55,12 +55,11 @@ yarn add @shopify/discount-app-components
/>
```

2. This library contains a number of locale-specific components, and you will be required to pass a `locale` and a `ianaTimezone` to the discounts AppProvider. Also, this library will require you to wrap your app in a [Polaris AppProvider](https://polaris.shopify.com/components/utilities/app-provider) and an [AppBridge AppProvider](https://shopify.dev/apps/tools/app-bridge/getting-started/using-react#provider). A full example of an app root can be found below:
2. This library contains a number of locale-specific components, and you will be required to pass a `locale` and a `ianaTimezone` to the discounts AppProvider.

```js
import {Page, AppProvider as PolarisAppProvider} from '@shopify/polaris';
import {Provider as AppBridgeProvider} from '@shopify/app-bridge-react';
import {AppProvider} from '@shopify/discount-app-components';
import {AppProvider as DiscountsProvider} from '@shopify/discount-app-components';

// See [Polaris AppProvider documentation](https://github.com/Shopify/polaris/blob/main/polaris-react/src/components/AppProvider/README.md#using-translations) for more details on using Polaris translations
import enPolarisTranslations from '@shopify/polaris/locales/en.json';
Expand All @@ -76,39 +75,20 @@ yarn add @shopify/discount-app-components
...

return (
<AppBridgeProvider config={/* pass your app bridge config here */}>
<PolarisAppProvider i18n={enPolarisTranslations}>
{/* discount-app-component specific AppProvider */}
<AppProvider locale="en-US" ianaTimezone="America/Los_Angeles">
<DiscountsProvider locale="en-US" ianaTimezone="America/Los_Angeles">
<Page title="Example app">
{/* Add your discount components here */}
</Page>
</AppProvider>
</DiscountsProvider>
</PolarisAppProvider>
</AppBridgeProvider>
);
}
```

_**Note**: you may need to rename the discounts AppProvider to avoid clashing with another AppProvider component:_

```js
import {AppProvider as DiscountAppComponentsProvider} from '@shopify/discount-app-components';
```

_And in your app root:_

```js
<DiscountAppComponentsProvider
locale="en-US"
ianaTimezone="America/Los_Angeles"
>
<Page title="Example app">{/* Add your discount components here */}</Page>
</DiscountAppComponentsProvider>
```

---

## Development

### Testing local changes in a consuming project
Expand Down
58 changes: 0 additions & 58 deletions locales/cs.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,64 +81,6 @@
"shippingLabel": "Slevy na dopravu"
},
"newBadge": "Nové",
"HelpText": {
"emptyState": {
"product": {
"title": "Nejsou nastaveny žádné slevy na produkty, které by bylo možné kombinovat.",
"warning": {
"withproduct": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na produkt, kterou bude možné kombinovat se slevami na produkty.",
"withorder": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na produkt, kterou bude možné kombinovat se slevami na objednávku.",
"withshipping": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na produkt, kterou bude možné kombinovat se slevami na dopravu."
}
},
"order": {
"title": "Nejsou nastaveny žádné slevy na objednávku, které by bylo možné kombinovat.",
"warning": {
"withproduct": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na objednávku, kterou bude možné kombinovat se slevami na produkty.",
"withorder": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na objednávku, kterou bude možné kombinovat se slevami na objednávky.",
"withshipping": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na objednávku, kterou bude možné kombinovat se slevami na dopravu."
}
},
"shipping": {
"title": "Nejsou nastaveny žádné slevy na dopravu, které by bylo možné kombinovat.",
"warning": {
"withproduct": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na dopravu, kterou bude možné kombinovat se slevami na produkty.",
"withorder": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na dopravu, kterou bude možné kombinovat se slevami na objednávku.",
"withshipping": "Pokud chcete zákazníkům umožnit uplatnění více než jedné slevy, nastavte alespoň jednu slevu na dopravu, kterou bude možné kombinovat se slevami na dopravu."
}
},
"link": "Zjistit více"
},
"combinations": {
"counts": {
"product": {
"one": "{count} slevu na produkt",
"other": "{count} slev(y) na produkty",
"few": "{count} slev(y) na produkty",
"many": "{count} slev(y) na produkty"
},
"order": {
"one": "{count} slevu na objednávku",
"other": "{count} slev(y) na objednávku",
"few": "{count} slev(y) na objednávku",
"many": "{count} slev(y) na objednávku"
},
"shipping": {
"one": "{count} slevu na dopravu",
"other": "{count} slev(y) na dopravu",
"few": "{count} slev(y) na dopravu",
"many": "{count} slev(y) na dopravu"
}
},
"info": {
"one": "Je nastavena {discountCountLink}, kterou je možné kombinovat.",
"other": "Jsou nastaveny {discountCountLink}, které je možné kombinovat.",
"few": "Jsou nastaveny {discountCountLink}, které je možné kombinovat.",
"many": "Jsou nastaveny {discountCountLink}, které je možné kombinovat."
},
"multipleEligibleDiscounts": "Pokud se na položku vztahuje více slev, uplatní se pouze ta nejvyšší."
}
},
"discountClass": {
"product": "produkt",
"order": "objednávku",
Expand Down
50 changes: 0 additions & 50 deletions locales/da.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,56 +81,6 @@
"shippingLabel": "Leveringsrabatter"
},
"newBadge": "Ny",
"HelpText": {
"emptyState": {
"product": {
"title": "Ingen produktrabatter er indstillet til at blive kombineret.",
"warning": {
"withproduct": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én produktrabat, der kan kombineres med produktrabatter.",
"withorder": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én produktrabat, der kan kombineres med ordrerabatter.",
"withshipping": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én produktrabat, der kan kombineres med leveringsrabatter."
}
},
"order": {
"title": "Ingen bestillingsrabatter er indstillet til at blive kombineret.",
"warning": {
"withproduct": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én ordrerabat, der kan kombineres med produktrabatter.",
"withorder": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én ordrerabat, der kan kombineres med ordrerabatter.",
"withshipping": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én ordrerabat, der kan kombineres med leveringsrabatter."
}
},
"shipping": {
"title": "Ingen forsendelsesrabatter er indstillet til at blive kombineret.",
"warning": {
"withproduct": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én leveringsrabat, der kan kombineres med produktrabatter.",
"withorder": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én leveringsrabat, der kan kombineres med ordrerabatter.",
"withshipping": "Hvis du vil give dine kunder mulighed for at bruge mere end én rabat, skal du opsætte mindst én leveringsrabat, der kan kombineres med leveringsrabatter."
}
},
"link": "Få mere at vide"
},
"combinations": {
"counts": {
"product": {
"one": "{count} produktrabat",
"other": "{count} produktrabatter"
},
"order": {
"one": "{count} ordrerabat",
"other": "{count} ordrerabatter"
},
"shipping": {
"one": "{count} leveringsrabat",
"other": "{count} leveringsrabatter"
}
},
"info": {
"one": "{discountCountLink} er indstillet til at blive kombineret.",
"other": "{discountCountLink} er indstillet til at blive kombineret."
},
"multipleEligibleDiscounts": "Hvis en vare er kvalificeret til flere rabatter, anvendes kun den største rabat."
}
},
"discountClass": {
"product": "produkt",
"order": "ordre",
Expand Down
50 changes: 0 additions & 50 deletions locales/de.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,56 +81,6 @@
"shippingLabel": "Versandrabatte"
},
"newBadge": "Neu",
"HelpText": {
"emptyState": {
"product": {
"title": "Es wurden keine kombinierbaren Produktrabatte eingerichtet.",
"warning": {
"withproduct": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Produktrabatt fest, der mit Produktrabatten kombinierbar ist.",
"withorder": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Produktrabatt fest, der mit Bestellrabatten kombinierbar ist.",
"withshipping": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Produktrabatt fest, der mit Versandrabatten kombinierbar ist."
}
},
"order": {
"title": "Es wurden keine kombinierbaren Bestellrabatte eingerichtet.",
"warning": {
"withproduct": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Bestellrabatt fest, der mit Produktrabatten kombinierbar ist.",
"withorder": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Bestellrabatt fest, der mit Bestellrabatten kombinierbar ist.",
"withshipping": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Bestellrabatt fest, der mit Versandrabatten kombinierbar ist."
}
},
"shipping": {
"title": "Es wurden keine kombinierbaren Versandrabatte eingerichtet.",
"warning": {
"withproduct": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Versandrabatt fest, der mit Produktrabatten kombinierbar ist.",
"withorder": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Versandrabatt fest, der mit Bestellrabatten kombinierbar ist.",
"withshipping": "Damit Kunden mehr als einen Rabatt nutzen können, lege mindestens einen Versandrabatt fest, der mit Versandrabatten kombinierbar ist."
}
},
"link": "Weitere Informationen"
},
"combinations": {
"counts": {
"product": {
"one": "{count} Produktrabatt",
"other": "{count} Produktrabatte"
},
"order": {
"one": "{count} Bestellrabatt",
"other": "{count} Bestellrabatte"
},
"shipping": {
"one": "{count} Versandrabatt",
"other": "{count} Versandrabatte"
}
},
"info": {
"one": "{discountCountLink} ist kombinierbar.",
"other": "{discountCountLink} sind kombinierbar."
},
"multipleEligibleDiscounts": "Wenn ein Artikel für mehrere Rabatte qualifiziert ist, wird nur der höchste Rabatt angewendet."
}
},
"discountClass": {
"product": "Produkt",
"order": "Bestellung",
Expand Down
50 changes: 0 additions & 50 deletions locales/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,56 +117,6 @@
"title": "Some combinations can result in large discounts",
"description": "Test a few combinations. If the total discount is too large, adjust which discounts can combine.",
"link": "Learn more"
},
"HelpText": {
"emptyState": {
"product": {
"title": "No product discounts are set to combine.",
"warning": {
"withproduct": "To let customers use more than one discount, set up at least one product discount that combines with product discounts.",
"withorder": "To let customers use more than one discount, set up at least one product discount that combines with order discounts.",
"withshipping": "To let customers use more than one discount, set up at least one product discount that combines with shipping discounts."
}
},
"order": {
"title": "No order discounts are set to combine.",
"warning": {
"withproduct": "To let customers use more than one discount, set up at least one order discount that combines with product discounts.",
"withorder": "To let customers use more than one discount, set up at least one order discount that combines with order discounts.",
"withshipping": "To let customers use more than one discount, set up at least one order discount that combines with shipping discounts."
}
},
"shipping": {
"title": "No shipping discounts are set to combine.",
"warning": {
"withproduct": "To let customers use more than one discount, set up at least one shipping discount that combines with product discounts.",
"withorder": "To let customers use more than one discount, set up at least one shipping discount that combines with order discounts.",
"withshipping": "To let customers use more than one discount, set up at least one shipping discount that combines with shipping discounts."
}
},
"link": "Learn more"
},
"combinations": {
"info": {
"one": "{discountCountLink} is set to combine.",
"other": "{discountCountLink} are set to combine."
},
"multipleEligibleDiscounts": "If an item is eligible for multiple discounts, only the largest will apply.",
"counts": {
"product": {
"one": "{count} product discount",
"other": "{count} product discounts"
},
"order": {
"one": "{count} order discount",
"other": "{count} order discounts"
},
"shipping": {
"one": "{count} shipping discount",
"other": "{count} shipping discounts"
}
}
}
}
},
"AppliesToCard": {
Expand Down
Loading
Loading