diff --git a/CHANGELOG.md b/CHANGELOG.md index 8fbec4ec9..e54f4c257 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -31,6 +31,7 @@ All notable, unreleased changes to this project will be documented in this file. - Fix crash when one product is selected - #391 by @dominik-zeglen - Improve product update form error handling - #392 by @dominik-zeglen - Fix column picker errors - #393 by @dominik-zeglen +- Improve order filters - #396 by @dominik-zeglen ## 2.0.0 diff --git a/locale/messages.pot b/locale/messages.pot index 16ddf2c07..77f188ee9 100644 --- a/locale/messages.pot +++ b/locale/messages.pot @@ -1,6 +1,6 @@ msgid "" msgstr "" -"POT-Creation-Date: 2020-01-20T16:06:58.433Z\n" +"POT-Creation-Date: 2020-02-03T11:54:24.949Z\n" "Content-Type: text/plain; charset=UTF-8\n" "Content-Transfer-Encoding: 8bit\n" "MIME-Version: 1.0\n" @@ -2803,6 +2803,14 @@ msgctxt "draft order" msgid "Created" msgstr "" +#: build/locale/src/orders/components/OrderListPage/filters.json +#. [src.orders.components.OrderListPage.placed] - order +#. defaultMessage is: +#. Created +msgctxt "order" +msgid "Created" +msgstr "" + #: build/locale/src/collections/views/CollectionCreate.json #. [src.collections.views.1597339737] #. defaultMessage is: @@ -2883,6 +2891,14 @@ msgctxt "e-mail or full name" msgid "Customer" msgstr "" +#: build/locale/src/orders/components/OrderListPage/filters.json +#. [src.orders.components.OrderListPage.customer] - order +#. defaultMessage is: +#. Customer +msgctxt "order" +msgid "Customer" +msgstr "" + #: build/locale/src/customers/components/CustomerList/CustomerList.json #. [src.customers.components.CustomerList.2339105195] #. defaultMessage is: @@ -6275,14 +6291,6 @@ msgctxt "product type" msgid "Physical" msgstr "" -#: build/locale/src/orders/components/OrderListPage/filters.json -#. [src.orders.components.OrderListPage.placed] - order -#. defaultMessage is: -#. Placed -msgctxt "order" -msgid "Placed" -msgstr "" - #: build/locale/src/staff/components/StaffPreferences/StaffPreferences.json #. [src.staff.components.StaffPreferences.2162129531] #. defaultMessage is: diff --git a/src/customers/views/CustomerDetails.tsx b/src/customers/views/CustomerDetails.tsx index 07c49aa2e..d2269f8fc 100644 --- a/src/customers/views/CustomerDetails.tsx +++ b/src/customers/views/CustomerDetails.tsx @@ -112,7 +112,7 @@ export const CustomerDetailsView: React.FC = ({ onViewAllOrdersClick={() => navigate( orderListUrl({ - email: maybe(() => customerDetails.data.user.email) + customer: maybe(() => customerDetails.data.user.email) }) ) } diff --git a/src/orders/components/OrderListPage/filters.ts b/src/orders/components/OrderListPage/filters.ts index 9e05c75d9..fa50e0eb9 100644 --- a/src/orders/components/OrderListPage/filters.ts +++ b/src/orders/components/OrderListPage/filters.ts @@ -4,7 +4,8 @@ import { FilterOpts, MinMax } from "@saleor/types"; import { OrderStatusFilter } from "@saleor/types/globalTypes"; import { createDateField, - createOptionsField + createOptionsField, + createTextField } from "@saleor/utils/filters/fields"; import { IFilter } from "@saleor/components/Filter"; import { orderStatusMessages } from "@saleor/misc"; @@ -12,17 +13,23 @@ import { commonMessages } from "@saleor/intl"; export enum OrderFilterKeys { created = "created", + customer = "customer", status = "status" } export interface OrderListFilterOpts { created: FilterOpts; + customer: FilterOpts; status: FilterOpts; } const messages = defineMessages({ + customer: { + defaultMessage: "Customer", + description: "order" + }, placed: { - defaultMessage: "Placed", + defaultMessage: "Created", description: "order" } }); @@ -32,6 +39,14 @@ export function createFilterStructure( opts: OrderListFilterOpts ): IFilter { return [ + { + ...createTextField( + OrderFilterKeys.customer, + intl.formatMessage(messages.customer), + opts.customer.value + ), + active: opts.customer.active + }, { ...createDateField( OrderFilterKeys.created, diff --git a/src/orders/urls.ts b/src/orders/urls.ts index 2dbfb6dfb..c8e7e3af7 100644 --- a/src/orders/urls.ts +++ b/src/orders/urls.ts @@ -19,7 +19,7 @@ export const orderListPath = orderSectionUrl; export enum OrderListUrlFiltersEnum { createdFrom = "createdFrom", createdTo = "createdTo", - email = "email", + customer = "customer", payment = "payment", query = "query" } diff --git a/src/orders/views/OrderList/__snapshots__/filters.test.ts.snap b/src/orders/views/OrderList/__snapshots__/filters.test.ts.snap index 2983d5df4..e7163da40 100644 --- a/src/orders/views/OrderList/__snapshots__/filters.test.ts.snap +++ b/src/orders/views/OrderList/__snapshots__/filters.test.ts.snap @@ -4,6 +4,7 @@ exports[`Filtering URL params should not be empty if active filters are present Object { "createdFrom": "2019-12-09", "createdTo": "2019-12-38", + "customer": "email@example.com", "status": Array [ "FULFILLED", "PARTIALLY_FULFILLED", @@ -11,4 +12,4 @@ Object { } `; -exports[`Filtering URL params should not be empty if active filters are present 2`] = `"createdFrom=2019-12-09&createdTo=2019-12-38&status%5B0%5D=FULFILLED&status%5B1%5D=PARTIALLY_FULFILLED"`; +exports[`Filtering URL params should not be empty if active filters are present 2`] = `"customer=email%40example.com&createdFrom=2019-12-09&createdTo=2019-12-38&status%5B0%5D=FULFILLED&status%5B1%5D=PARTIALLY_FULFILLED"`; diff --git a/src/orders/views/OrderList/filters.test.ts b/src/orders/views/OrderList/filters.test.ts index df4122e2a..b737c70b0 100644 --- a/src/orders/views/OrderList/filters.test.ts +++ b/src/orders/views/OrderList/filters.test.ts @@ -22,7 +22,7 @@ describe("Filtering query params", () => { const params: OrderListUrlFilters = { createdFrom: date.from, createdTo: date.to, - email: "email@example.com", + customer: "email@example.com", status: [ OrderStatusFilter.FULFILLED, OrderStatusFilter.PARTIALLY_FULFILLED @@ -45,6 +45,10 @@ describe("Filtering URL params", () => { min: date.from } }, + customer: { + active: false, + value: "email@example.com" + }, status: { active: false, value: [ diff --git a/src/orders/views/OrderList/filters.ts b/src/orders/views/OrderList/filters.ts index db3bfec82..8a58feed5 100644 --- a/src/orders/views/OrderList/filters.ts +++ b/src/orders/views/OrderList/filters.ts @@ -15,7 +15,8 @@ import { dedupeFilter, getGteLteVariables, getMinMaxQueryParam, - getMultipleEnumValueQueryParam + getMultipleEnumValueQueryParam, + getSingleValueQueryParam } from "../../../utils/filters"; import { OrderListUrlFilters, @@ -43,6 +44,10 @@ export function getFilterOpts( min: maybe(() => params.createdFrom, "") } }, + customer: { + active: !!maybe(() => params.customer), + value: params.customer + }, status: { active: maybe(() => params.status !== undefined, false), value: maybe( @@ -66,7 +71,7 @@ export function getFilterVariables( gte: params.createdFrom, lte: params.createdTo }), - customer: params.email, + customer: params.customer, search: params.query, status: maybe(() => params.status.map(status => findInEnum(status, OrderStatusFilter)) @@ -93,6 +98,9 @@ export function getFilterQueryParam( OrderListUrlFiltersWithMultipleValuesEnum.status, OrderStatus ); + + case OrderFilterKeys.customer: + return getSingleValueQueryParam(filter, OrderListUrlFiltersEnum.customer); } } diff --git a/src/storybook/stories/orders/OrderListPage.tsx b/src/storybook/stories/orders/OrderListPage.tsx index 5fb565871..2edfc0a6d 100644 --- a/src/storybook/stories/orders/OrderListPage.tsx +++ b/src/storybook/stories/orders/OrderListPage.tsx @@ -28,6 +28,10 @@ const props: OrderListPageProps = { min: "50" } }, + customer: { + active: false, + value: "Jesse" + }, status: { active: false, value: [OrderStatusFilter.CANCELED, OrderStatusFilter.FULFILLED]