From c90c58473fc450d9af1437ecdd6df0bf87490b58 Mon Sep 17 00:00:00 2001 From: dominik-zeglen Date: Fri, 10 Jan 2020 15:27:44 +0100 Subject: [PATCH] Move filter structure to page component --- .../AttributeListPage/AttributeListPage.tsx | 8 +- .../components/AttributeListPage/filters.ts | 131 ++++++++++++++++++ .../components/AttributeListPage/index.ts | 1 + src/attributes/types.ts | 10 -- src/attributes/views/AttributeList/filters.ts | 101 +------------- .../views/AttributeList/messages.ts | 30 ---- 6 files changed, 142 insertions(+), 139 deletions(-) create mode 100644 src/attributes/components/AttributeListPage/filters.ts delete mode 100644 src/attributes/types.ts delete mode 100644 src/attributes/views/AttributeList/messages.ts diff --git a/src/attributes/components/AttributeListPage/AttributeListPage.tsx b/src/attributes/components/AttributeListPage/AttributeListPage.tsx index 57e2c97fa..70f8733c2 100644 --- a/src/attributes/components/AttributeListPage/AttributeListPage.tsx +++ b/src/attributes/components/AttributeListPage/AttributeListPage.tsx @@ -7,8 +7,6 @@ import AppHeader from "@saleor/components/AppHeader"; import FilterBar from "@saleor/components/FilterBar"; import { sectionNames } from "@saleor/intl"; import { AttributeListUrlSortField } from "@saleor/attributes/urls"; -import { AttributeFilterKeys } from "@saleor/attributes/views/AttributeList/filters"; -import { AttributeListFilterOpts } from "@saleor/attributes/types"; import Container from "../../../components/Container"; import PageHeader from "../../../components/PageHeader"; import { @@ -20,7 +18,11 @@ import { } from "../../../types"; import { AttributeList_attributes_edges_node } from "../../types/AttributeList"; import AttributeList from "../AttributeList/AttributeList"; -import { createFilterStructure } from "../../views/AttributeList/filters"; +import { + createFilterStructure, + AttributeListFilterOpts, + AttributeFilterKeys +} from "./filters"; export interface AttributeListPageProps extends PageListProps, diff --git a/src/attributes/components/AttributeListPage/filters.ts b/src/attributes/components/AttributeListPage/filters.ts new file mode 100644 index 000000000..30acfd23a --- /dev/null +++ b/src/attributes/components/AttributeListPage/filters.ts @@ -0,0 +1,131 @@ +import { defineMessages, IntlShape } from "react-intl"; + +import { FilterOpts } from "@saleor/types"; +import { commonMessages } from "@saleor/intl"; +import { IFilter } from "@saleor/components/Filter"; +import { createBooleanField } from "@saleor/utils/filters/fields"; + +export enum AttributeFilterKeys { + availableInGrid = "availableInGrud", + filterableInDashboard = "filterableInDashboard", + filterableInStorefront = "filterableInStorefront", + isVariantOnly = "isVariantOnly", + valueRequired = "valueRequired", + visibleInStorefront = "visibleInStorefront" +} + +export interface AttributeListFilterOpts { + availableInGrid: FilterOpts; + filterableInDashboard: FilterOpts; + filterableInStorefront: FilterOpts; + isVariantOnly: FilterOpts; + valueRequired: FilterOpts; + visibleInStorefront: FilterOpts; +} + +const messages = defineMessages({ + availableInGrid: { + defaultMessage: "Can be used as column", + description: "attribute can be column in product list table" + }, + filterableInDashboard: { + defaultMessage: "Filterable in Dashboard", + description: "use attribute in filtering" + }, + filterableInStorefront: { + defaultMessage: "Filterable in Storefront", + description: "use attribute in filtering" + }, + isVariantOnly: { + defaultMessage: "Variant Only", + description: "attribute can be used only in variants" + }, + valueRequired: { + defaultMessage: "Value Required", + description: "attribute value is required" + }, + visibleInStorefront: { + defaultMessage: "Visible on Product Page in Storefront", + description: "attribute" + } +}); + +export function createFilterStructure( + intl: IntlShape, + opts: AttributeListFilterOpts +): IFilter { + return [ + { + ...createBooleanField( + AttributeFilterKeys.availableInGrid, + intl.formatMessage(messages.availableInGrid), + opts.availableInGrid.value, + { + negative: intl.formatMessage(commonMessages.no), + positive: intl.formatMessage(commonMessages.yes) + } + ), + active: opts.availableInGrid.active + }, + { + ...createBooleanField( + AttributeFilterKeys.filterableInDashboard, + intl.formatMessage(messages.filterableInDashboard), + opts.filterableInDashboard.value, + { + negative: intl.formatMessage(commonMessages.no), + positive: intl.formatMessage(commonMessages.yes) + } + ), + active: opts.filterableInDashboard.active + }, + { + ...createBooleanField( + AttributeFilterKeys.filterableInStorefront, + intl.formatMessage(messages.filterableInStorefront), + opts.filterableInStorefront.value, + { + negative: intl.formatMessage(commonMessages.no), + positive: intl.formatMessage(commonMessages.yes) + } + ), + active: opts.filterableInStorefront.active + }, + { + ...createBooleanField( + AttributeFilterKeys.isVariantOnly, + intl.formatMessage(messages.isVariantOnly), + opts.isVariantOnly.value, + { + negative: intl.formatMessage(commonMessages.no), + positive: intl.formatMessage(commonMessages.yes) + } + ), + active: opts.isVariantOnly.active + }, + { + ...createBooleanField( + AttributeFilterKeys.valueRequired, + intl.formatMessage(messages.valueRequired), + opts.valueRequired.value, + { + negative: intl.formatMessage(commonMessages.no), + positive: intl.formatMessage(commonMessages.yes) + } + ), + active: opts.valueRequired.active + }, + { + ...createBooleanField( + AttributeFilterKeys.visibleInStorefront, + intl.formatMessage(messages.visibleInStorefront), + opts.visibleInStorefront.value, + { + negative: intl.formatMessage(commonMessages.no), + positive: intl.formatMessage(commonMessages.yes) + } + ), + active: opts.visibleInStorefront.active + } + ]; +} diff --git a/src/attributes/components/AttributeListPage/index.ts b/src/attributes/components/AttributeListPage/index.ts index 2633c7769..dea1bb374 100644 --- a/src/attributes/components/AttributeListPage/index.ts +++ b/src/attributes/components/AttributeListPage/index.ts @@ -1,2 +1,3 @@ export { default } from "./AttributeListPage"; export * from "./AttributeListPage"; +export * from "./filters"; diff --git a/src/attributes/types.ts b/src/attributes/types.ts deleted file mode 100644 index 2ac48786c..000000000 --- a/src/attributes/types.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { FilterOpts } from "@saleor/types"; - -export interface AttributeListFilterOpts { - availableInGrid: FilterOpts; - filterableInDashboard: FilterOpts; - filterableInStorefront: FilterOpts; - isVariantOnly: FilterOpts; - valueRequired: FilterOpts; - visibleInStorefront: FilterOpts; -} diff --git a/src/attributes/views/AttributeList/filters.ts b/src/attributes/views/AttributeList/filters.ts index 48a2772b1..96c1ac929 100644 --- a/src/attributes/views/AttributeList/filters.ts +++ b/src/attributes/views/AttributeList/filters.ts @@ -1,10 +1,10 @@ -import { IntlShape } from "react-intl"; - import { AttributeFilterInput } from "@saleor/types/globalTypes"; import { maybe, parseBoolean } from "@saleor/misc"; -import { createBooleanField } from "@saleor/utils/filters/fields"; -import { commonMessages } from "@saleor/intl"; -import { IFilter, IFilterElement } from "@saleor/components/Filter"; +import { IFilterElement } from "@saleor/components/Filter"; +import { + AttributeListFilterOpts, + AttributeFilterKeys +} from "@saleor/attributes/components/AttributeListPage"; import { createFilterTabUtils, createFilterUtils @@ -14,20 +14,9 @@ import { AttributeListUrlFiltersEnum, AttributeListUrlQueryParams } from "../../urls"; -import { AttributeListFilterOpts } from "../../types"; -import messages from "./messages"; export const PRODUCT_FILTERS_KEY = "productFilters"; -export enum AttributeFilterKeys { - availableInGrid = "availableInGrud", - filterableInDashboard = "filterableInDashboard", - filterableInStorefront = "filterableInStorefront", - isVariantOnly = "isVariantOnly", - valueRequired = "valueRequired", - visibleInStorefront = "visibleInStorefront" -} - export function getFilterOpts( params: AttributeListUrlFilters ): AttributeListFilterOpts { @@ -59,86 +48,6 @@ export function getFilterOpts( }; } -export function createFilterStructure( - intl: IntlShape, - opts: AttributeListFilterOpts -): IFilter { - return [ - { - ...createBooleanField( - AttributeFilterKeys.availableInGrid, - intl.formatMessage(messages.availableInGrid), - opts.availableInGrid.value, - { - negative: intl.formatMessage(commonMessages.no), - positive: intl.formatMessage(commonMessages.yes) - } - ), - active: opts.availableInGrid.active - }, - { - ...createBooleanField( - AttributeFilterKeys.filterableInDashboard, - intl.formatMessage(messages.filterableInDashboard), - opts.filterableInDashboard.value, - { - negative: intl.formatMessage(commonMessages.no), - positive: intl.formatMessage(commonMessages.yes) - } - ), - active: opts.filterableInDashboard.active - }, - { - ...createBooleanField( - AttributeFilterKeys.filterableInStorefront, - intl.formatMessage(messages.filterableInStorefront), - opts.filterableInStorefront.value, - { - negative: intl.formatMessage(commonMessages.no), - positive: intl.formatMessage(commonMessages.yes) - } - ), - active: opts.filterableInStorefront.active - }, - { - ...createBooleanField( - AttributeFilterKeys.isVariantOnly, - intl.formatMessage(messages.isVariantOnly), - opts.isVariantOnly.value, - { - negative: intl.formatMessage(commonMessages.no), - positive: intl.formatMessage(commonMessages.yes) - } - ), - active: opts.isVariantOnly.active - }, - { - ...createBooleanField( - AttributeFilterKeys.valueRequired, - intl.formatMessage(messages.valueRequired), - opts.valueRequired.value, - { - negative: intl.formatMessage(commonMessages.no), - positive: intl.formatMessage(commonMessages.yes) - } - ), - active: opts.valueRequired.active - }, - { - ...createBooleanField( - AttributeFilterKeys.visibleInStorefront, - intl.formatMessage(messages.visibleInStorefront), - opts.visibleInStorefront.value, - { - negative: intl.formatMessage(commonMessages.no), - positive: intl.formatMessage(commonMessages.yes) - } - ), - active: opts.visibleInStorefront.active - } - ]; -} - export function getFilterVariables( params: AttributeListUrlFilters ): AttributeFilterInput { diff --git a/src/attributes/views/AttributeList/messages.ts b/src/attributes/views/AttributeList/messages.ts deleted file mode 100644 index be243a9a3..000000000 --- a/src/attributes/views/AttributeList/messages.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { defineMessages } from "react-intl"; - -const messages = defineMessages({ - availableInGrid: { - defaultMessage: "Can be used as column", - description: "attribute can be column in product list table" - }, - filterableInDashboard: { - defaultMessage: "Filterable in Dashboard", - description: "use attribute in filtering" - }, - filterableInStorefront: { - defaultMessage: "Filterable in Storefront", - description: "use attribute in filtering" - }, - isVariantOnly: { - defaultMessage: "Variant Only", - description: "attribute can be used only in variants" - }, - valueRequired: { - defaultMessage: "Value Required", - description: "attribute value is required" - }, - visibleInStorefront: { - defaultMessage: "Visible on Product Page in Storefront", - description: "attribute" - } -}); - -export default messages;