diff --git a/locale/defaultMessages.json b/locale/defaultMessages.json index edc7ef638..b3fb24d30 100644 --- a/locale/defaultMessages.json +++ b/locale/defaultMessages.json @@ -1524,6 +1524,9 @@ "context": "button", "string": "SETUP END DATE" }, + "9MGrEp": { + "string": "Is available" + }, "9Mro3c": { "context": "Transaction event status - pending", "string": "Pending" @@ -2290,6 +2293,9 @@ "context": "change warehouse dialog warehouse list label", "string": "Warehouses A to Z" }, + "Eq3GFh": { + "string": "Is giftcard" + }, "ErNH3D": { "string": "Define where this attribute should be used in Saleor system" }, @@ -3970,6 +3976,9 @@ "context": "table header name col label", "string": "Name" }, + "QHDtwH": { + "string": "Has category" + }, "QJG+d/": { "context": "staff added type order discount", "string": "Staff added" @@ -4057,6 +4066,9 @@ "context": "dialog content", "string": "Add a new address:" }, + "QqnNUm": { + "string": "Visible in listing" + }, "QzseV7": { "context": "dialog header", "string": "Delete Menu" @@ -5896,6 +5908,9 @@ "dWK/Ck": { "string": "Choose countries, you want voucher to be limited to, from the list below" }, + "da1ebU": { + "string": "Product type" + }, "dc5KWn": { "context": "products export type label", "string": "products" @@ -7022,6 +7037,9 @@ "context": "modal button upload", "string": "Upload" }, + "mIRBuW": { + "string": "Is published" + }, "mIUNgR": { "context": "button", "string": "Create shipping zone" diff --git a/src/components/ConditionalFilter/FilterElement/FilterElement.ts b/src/components/ConditionalFilter/FilterElement/FilterElement.ts index b1e7d1960..4a9856cfe 100644 --- a/src/components/ConditionalFilter/FilterElement/FilterElement.ts +++ b/src/components/ConditionalFilter/FilterElement/FilterElement.ts @@ -19,6 +19,10 @@ export class ExpressionValue { public type: string, ) {} + public setLabel(label: string) { + this.label = label; + } + public isEmpty() { return this.value.length === 0 || this.label.length === 0; } diff --git a/src/components/ConditionalFilter/FiltersArea.tsx b/src/components/ConditionalFilter/FiltersArea.tsx index 9a3337bca..e1a89a3f1 100644 --- a/src/components/ConditionalFilter/FiltersArea.tsx +++ b/src/components/ConditionalFilter/FiltersArea.tsx @@ -11,6 +11,7 @@ import { FilterContainer } from "./FilterElement"; import { LeftOperand } from "./LeftOperandsProvider"; import { useFiltersAreaTranslations } from "./messages"; import { useFilterContainer } from "./useFilterContainer"; +import { useTranslate } from "./useTranslate"; import { ErrorEntry } from "./Validation"; interface FiltersAreaProps { @@ -28,6 +29,7 @@ export const FiltersArea: FC = ({ }) => { const { apiProvider, leftOperandsProvider } = useConditionalFilterContext(); const translations = useFiltersAreaTranslations(); + const { translateOperandOptions, translateSelectedOperands } = useTranslate(); const { value, @@ -79,8 +81,8 @@ export const FiltersArea: FC = ({ return ( <_ExperimentalFilters - leftOptions={leftOperandsProvider.operands} - value={value as Array} + leftOptions={translateOperandOptions(leftOperandsProvider.operands)} + value={translateSelectedOperands(value) as Array} onChange={handleStateChange} error={errors} locale={translations.locale} diff --git a/src/components/ConditionalFilter/constants.ts b/src/components/ConditionalFilter/constants.ts index 092e8c69b..daae54ec2 100644 --- a/src/components/ConditionalFilter/constants.ts +++ b/src/components/ConditionalFilter/constants.ts @@ -46,37 +46,37 @@ export const STATIC_OPTIONS: LeftOperand[] = [ { value: "channel", label: "Channel", type: "channel", slug: "channel" }, { value: "productType", - label: "Product Type", + label: "ProductType", type: "productType", slug: "productType", }, { value: "isAvailable", - label: "Is available", + label: "IsAvailable", type: "isAvailable", slug: "isAvailable", }, { value: "isPublished", - label: "Is published", + label: "IsPublished", type: "isPublished", slug: "isPublished", }, { value: "isVisibleInListing", - label: "Visible in listing", + label: "VisibleInListing", type: "isVisibleInListing", slug: "isVisibleInListing", }, { value: "hasCategory", - label: "Has category", + label: "HasCategory", type: "hasCategory", slug: "hasCategory", }, { value: "giftCard", - label: "Is giftcard", + label: "IsGiftcard", type: "giftCard", slug: "giftCard", }, diff --git a/src/components/ConditionalFilter/intl.ts b/src/components/ConditionalFilter/intl.ts new file mode 100644 index 000000000..99e98ee98 --- /dev/null +++ b/src/components/ConditionalFilter/intl.ts @@ -0,0 +1,44 @@ +import { defineMessages } from "react-intl"; + +export const leftOperatorsMessages = defineMessages({ + Price: { + id: "b1zuN9", + defaultMessage: "Price", + }, + Category: { + id: "ccXLVi", + defaultMessage: "Category", + }, + Channel: { + id: "KeO51o", + defaultMessage: "Channel", + }, + Collection: { + id: "phAZoj", + defaultMessage: "Collection", + }, + ProductType: { + id: "da1ebU", + defaultMessage: "Product type", + }, + IsAvailable: { + id: "9MGrEp", + defaultMessage: "Is available", + }, + IsPublished: { + id: "mIRBuW", + defaultMessage: "Is published", + }, + VisibleInListing: { + id: "QqnNUm", + defaultMessage: "Visible in listing", + }, + HasCategory: { + id: "QHDtwH", + defaultMessage: "Has category", + }, + IsGiftcard: { + id: "Eq3GFh", + defaultMessage: "Is giftcard", + }, +}); diff --git a/src/components/ConditionalFilter/useTranslate.ts b/src/components/ConditionalFilter/useTranslate.ts new file mode 100644 index 000000000..d89ed5d0f --- /dev/null +++ b/src/components/ConditionalFilter/useTranslate.ts @@ -0,0 +1,33 @@ +import { useIntl } from "react-intl"; + +import { FilterContainer, FilterElement } from "./FilterElement"; +import { leftOperatorsMessages } from "./intl"; +import { LeftOperand } from "./LeftOperandsProvider"; + +type TranslationKeys = keyof typeof leftOperatorsMessages; + +export const useTranslate = () => { + const intl = useIntl(); + + return { + translateOperandOptions: (operands: LeftOperand[]) => + operands.map(el => ({ + ...el, + label: intl.formatMessage( + leftOperatorsMessages[el.label as TranslationKeys], + ), + })), + translateSelectedOperands: (container: FilterContainer) => + container.map(el => { + if (FilterElement.isCompatible(el)) { + el.value.setLabel( + intl.formatMessage( + leftOperatorsMessages[el.value.label as TranslationKeys], + ), + ); + } + + return el; + }), + }; +};