From 0fb8a66b9ab7e022759d007da9b65ce07cd401ae Mon Sep 17 00:00:00 2001 From: dominik-zeglen Date: Fri, 10 Jan 2020 14:34:04 +0100 Subject: [PATCH] Separate visual and app layer in product types --- .../ProductTypeListPage.tsx | 10 +-- .../components/ProductTypeListPage/filters.ts | 85 +++++++++++++++++++ .../components/ProductTypeListPage/index.ts | 1 + src/productTypes/types.ts | 10 --- .../views/ProductTypeList/ProductTypeList.tsx | 2 +- .../ProductTypeList/{filter.ts => filters.ts} | 59 +------------ .../views/ProductTypeList/messages.ts | 22 ----- 7 files changed, 94 insertions(+), 95 deletions(-) create mode 100644 src/productTypes/components/ProductTypeListPage/filters.ts delete mode 100644 src/productTypes/types.ts rename src/productTypes/views/ProductTypeList/{filter.ts => filters.ts} (59%) delete mode 100644 src/productTypes/views/ProductTypeList/messages.ts diff --git a/src/productTypes/components/ProductTypeListPage/ProductTypeListPage.tsx b/src/productTypes/components/ProductTypeListPage/ProductTypeListPage.tsx index af9996645..647ae7ada 100644 --- a/src/productTypes/components/ProductTypeListPage/ProductTypeListPage.tsx +++ b/src/productTypes/components/ProductTypeListPage/ProductTypeListPage.tsx @@ -9,11 +9,6 @@ import PageHeader from "@saleor/components/PageHeader"; import FilterBar from "@saleor/components/FilterBar"; import { sectionNames } from "@saleor/intl"; import { ProductTypeListUrlSortField } from "@saleor/productTypes/urls"; -import { - ProductTypeFilterKeys, - createFilterStructure -} from "@saleor/productTypes/views/ProductTypeList/filter"; -import { ProductTypeListFilterOpts } from "@saleor/productTypes/types"; import { ListActions, PageListProps, @@ -23,6 +18,11 @@ import { } from "../../../types"; import { ProductTypeList_productTypes_edges_node } from "../../types/ProductTypeList"; import ProductTypeList from "../ProductTypeList"; +import { + createFilterStructure, + ProductTypeFilterKeys, + ProductTypeListFilterOpts +} from "./filters"; export interface ProductTypeListPageProps extends PageListProps, diff --git a/src/productTypes/components/ProductTypeListPage/filters.ts b/src/productTypes/components/ProductTypeListPage/filters.ts new file mode 100644 index 000000000..c6664e09c --- /dev/null +++ b/src/productTypes/components/ProductTypeListPage/filters.ts @@ -0,0 +1,85 @@ +import { defineMessages, IntlShape } from "react-intl"; + +import { FilterOpts } from "@saleor/types"; +import { + ProductTypeConfigurable, + ProductTypeEnum +} from "@saleor/types/globalTypes"; +import { IFilter } from "@saleor/components/Filter"; +import { commonMessages } from "@saleor/intl"; +import { createOptionsField } from "@saleor/utils/filters/fields"; + +export enum ProductTypeFilterKeys { + configurable = "configurable", + type = "type" +} + +export interface ProductTypeListFilterOpts { + configurable: FilterOpts; + type: FilterOpts; +} + +const messages = defineMessages({ + configurable: { + defaultMessage: "Configurable", + description: "product type" + }, + digital: { + defaultMessage: "Digital", + description: "product" + }, + shippable: { + defaultMessage: "Shippable", + description: "product" + }, + type: { + defaultMessage: "Type", + description: "product type is digital or physical" + } +}); + +export function createFilterStructure( + intl: IntlShape, + opts: ProductTypeListFilterOpts +): IFilter { + return [ + { + ...createOptionsField( + ProductTypeFilterKeys.configurable, + intl.formatMessage(messages.configurable), + [opts.configurable.value], + false, + [ + { + label: intl.formatMessage(commonMessages.yes), + value: ProductTypeConfigurable.CONFIGURABLE + }, + { + label: intl.formatMessage(commonMessages.no), + value: ProductTypeConfigurable.SIMPLE + } + ] + ), + active: opts.configurable.active + }, + { + ...createOptionsField( + ProductTypeFilterKeys.type, + intl.formatMessage(messages.type), + [opts.type.value], + false, + [ + { + label: intl.formatMessage(messages.digital), + value: ProductTypeEnum.DIGITAL + }, + { + label: intl.formatMessage(messages.shippable), + value: ProductTypeEnum.SHIPPABLE + } + ] + ), + active: opts.type.active + } + ]; +} diff --git a/src/productTypes/components/ProductTypeListPage/index.ts b/src/productTypes/components/ProductTypeListPage/index.ts index 55c8646cc..0e7b89ba0 100644 --- a/src/productTypes/components/ProductTypeListPage/index.ts +++ b/src/productTypes/components/ProductTypeListPage/index.ts @@ -1,2 +1,3 @@ export { default } from "./ProductTypeListPage"; export * from "./ProductTypeListPage"; +export * from "./filters"; diff --git a/src/productTypes/types.ts b/src/productTypes/types.ts deleted file mode 100644 index 5ecaf8b51..000000000 --- a/src/productTypes/types.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { FilterOpts } from "@saleor/types"; -import { - ProductTypeConfigurable, - ProductTypeEnum -} from "@saleor/types/globalTypes"; - -export interface ProductTypeListFilterOpts { - configurable: FilterOpts; - type: FilterOpts; -} diff --git a/src/productTypes/views/ProductTypeList/ProductTypeList.tsx b/src/productTypes/views/ProductTypeList/ProductTypeList.tsx index 0e088818b..1de7f7498 100644 --- a/src/productTypes/views/ProductTypeList/ProductTypeList.tsx +++ b/src/productTypes/views/ProductTypeList/ProductTypeList.tsx @@ -45,7 +45,7 @@ import { saveFilterTab, getFilterQueryParam, getFilterOpts -} from "./filter"; +} from "./filters"; import { getSortQueryVariables } from "./sort"; interface ProductTypeListProps { diff --git a/src/productTypes/views/ProductTypeList/filter.ts b/src/productTypes/views/ProductTypeList/filters.ts similarity index 59% rename from src/productTypes/views/ProductTypeList/filter.ts rename to src/productTypes/views/ProductTypeList/filters.ts index 8d542c374..096f146ca 100644 --- a/src/productTypes/views/ProductTypeList/filter.ts +++ b/src/productTypes/views/ProductTypeList/filters.ts @@ -1,14 +1,11 @@ -import { IntlShape } from "react-intl"; - import { ProductTypeFilterInput, ProductTypeConfigurable, ProductTypeEnum } from "@saleor/types/globalTypes"; -import { IFilterElement, IFilter } from "@saleor/components/Filter"; +import { IFilterElement } from "@saleor/components/Filter"; import { maybe, findValueInEnum } from "@saleor/misc"; -import { createOptionsField } from "@saleor/utils/filters/fields"; -import { commonMessages } from "@saleor/intl"; +import { ProductTypeFilterKeys } from "@saleor/productTypes/components/ProductTypeListPage"; import { createFilterTabUtils, createFilterUtils @@ -19,15 +16,9 @@ import { ProductTypeListUrlQueryParams } from "../../urls"; import { ProductTypeListFilterOpts } from "../../types"; -import messages from "./messages"; export const PRODUCT_TYPE_FILTERS_KEY = "productTypeFilters"; -export enum ProductTypeFilterKeys { - configurable = "configurable", - type = "type" -} - export function getFilterOpts( params: ProductTypeListUrlFilters ): ProductTypeListFilterOpts { @@ -45,52 +36,6 @@ export function getFilterOpts( }; } -export function createFilterStructure( - intl: IntlShape, - opts: ProductTypeListFilterOpts -): IFilter { - return [ - { - ...createOptionsField( - ProductTypeFilterKeys.configurable, - intl.formatMessage(messages.configurable), - [opts.configurable.value], - false, - [ - { - label: intl.formatMessage(commonMessages.yes), - value: ProductTypeConfigurable.CONFIGURABLE - }, - { - label: intl.formatMessage(commonMessages.no), - value: ProductTypeConfigurable.SIMPLE - } - ] - ), - active: opts.configurable.active - }, - { - ...createOptionsField( - ProductTypeFilterKeys.type, - intl.formatMessage(messages.type), - [opts.type.value], - false, - [ - { - label: intl.formatMessage(messages.digital), - value: ProductTypeEnum.DIGITAL - }, - { - label: intl.formatMessage(messages.shippable), - value: ProductTypeEnum.SHIPPABLE - } - ] - ), - active: opts.type.active - } - ]; -} - export function getFilterVariables( params: ProductTypeListUrlFilters ): ProductTypeFilterInput { diff --git a/src/productTypes/views/ProductTypeList/messages.ts b/src/productTypes/views/ProductTypeList/messages.ts deleted file mode 100644 index e5b3e3744..000000000 --- a/src/productTypes/views/ProductTypeList/messages.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { defineMessages } from "react-intl"; - -const messages = defineMessages({ - configurable: { - defaultMessage: "Configurable", - description: "product type" - }, - digital: { - defaultMessage: "Digital", - description: "product" - }, - shippable: { - defaultMessage: "Shippable", - description: "product" - }, - type: { - defaultMessage: "Type", - description: "product type is digital or physical" - } -}); - -export default messages;