Skip to content

Commit

Permalink
Remove dependency on App Bridge React and update components and navig…
Browse files Browse the repository at this point in the history 
…ation patterns
  • Loading branch information
@devisscher
devisscher committed Apr 18, 2024
1 parent f7d121b commit 0f24cf5
Show file tree
Hide file tree
Showing 51 changed files with 68 additions and 1,980 deletions.
11 changes: 11 additions & 0 deletions .changeset/light-gifts-relate.md
View file
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.
32 changes: 6 additions & 26 deletions README.md
View file
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
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
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
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
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

0 comments on commit 0f24cf5

Please sign in to comment.