Separate visual and app layer in drafts

src/orders/components/OrderDraftListPage/OrderDraftListPage.tsx

@@ -15,14 +15,14 @@ import {
   FilterPageProps
 } from "@saleor/types";
 import { OrderDraftListUrlSortField } from "@saleor/orders/urls";
-import {
-  OrderDraftFilterKeys,
-  createFilterStructure
-} from "@saleor/orders/views/OrderDraftList/filter";
-import { OrderDraftListFilterOpts } from "@saleor/orders/types";
 import FilterBar from "@saleor/components/FilterBar";
 import OrderDraftList from "../OrderDraftList";
 import { OrderDraftList_draftOrders_edges_node } from "../../types/OrderDraftList";
+import {
+  OrderDraftListFilterOpts,
+  OrderDraftFilterKeys,
+  createFilterStructure
+} from "./filters";
 
 export interface OrderDraftListPageProps
   extends PageListProps,

src/orders/components/OrderDraftListPage/filters.ts

@@ -0,0 +1,50 @@
+import { IntlShape, defineMessages } from "react-intl";
+
+import { FilterOpts, MinMax } from "@saleor/types";
+import { createDateField, createTextField } from "@saleor/utils/filters/fields";
+import { IFilter } from "@saleor/components/Filter";
+
+export enum OrderDraftFilterKeys {
+  created = "created",
+  customer = "customer"
+}
+
+export interface OrderDraftListFilterOpts {
+  created: FilterOpts<MinMax>;
+  customer: FilterOpts<string>;
+}
+
+const messages = defineMessages({
+  created: {
+    defaultMessage: "Created",
+    description: "draft order"
+  },
+  customer: {
+    defaultMessage: "Customer",
+    description: "draft order"
+  }
+});
+
+export function createFilterStructure(
+  intl: IntlShape,
+  opts: OrderDraftListFilterOpts
+): IFilter<OrderDraftFilterKeys> {
+  return [
+    {
+      ...createDateField(
+        OrderDraftFilterKeys.created,
+        intl.formatMessage(messages.created),
+        opts.created.value
+      ),
+      active: opts.created.active
+    },
+    {
+      ...createTextField(
+        OrderDraftFilterKeys.customer,
+        intl.formatMessage(messages.customer),
+        opts.customer.value
+      ),
+      active: opts.customer.active
+    }
+  ];
+}

src/orders/components/OrderDraftListPage/index.ts

@@ -1,2 +1,3 @@
 export { default } from "./OrderDraftListPage";
 export * from "./OrderDraftListPage";
+export * from "./filters";

src/orders/types.ts

@@ -1,6 +0,0 @@
-import { FilterOpts, MinMax } from "@saleor/types";
-
-export interface OrderDraftListFilterOpts {
-  created: FilterOpts<MinMax>;
-  customer: FilterOpts<string>;
-}

src/orders/views/OrderDraftList/OrderDraftList.tsx

@@ -46,7 +46,7 @@ import {
   saveFilterTab,
   getFilterQueryParam,
   getFilterOpts
-} from "./filter";
+} from "./filters";
 import { getSortQueryVariables } from "./sort";
 
 interface OrderDraftListProps {

src/orders/views/OrderDraftList/filters.ts

@@ -1,10 +1,10 @@
-import { IntlShape } from "react-intl";
-
 import { OrderDraftFilterInput } from "@saleor/types/globalTypes";
 import { maybe } from "@saleor/misc";
-import { OrderDraftListFilterOpts } from "@saleor/orders/types";
+import { IFilterElement } from "@saleor/components/Filter";
-import { IFilter, IFilterElement } from "@saleor/components/Filter";
+import {
-import { createTextField, createDateField } from "@saleor/utils/filters/fields";
+  OrderDraftFilterKeys,
+  OrderDraftListFilterOpts
+} from "@saleor/orders/components/OrderDraftListPage";
 import {
   OrderDraftListUrlFilters,
   OrderDraftListUrlFiltersEnum,
@@ -14,15 +14,9 @@ import {
   createFilterTabUtils,
   createFilterUtils
 } from "../../../utils/filters";
-import messages from "./messages";
 
 export const ORDER_DRAFT_FILTERS_KEY = "orderDraftFilters";
 
-export enum OrderDraftFilterKeys {
-  created = "created",
-  customer = "customer"
-}
-
 export function getFilterOpts(
   params: OrderDraftListUrlFilters
 ): OrderDraftListFilterOpts {
@@ -47,30 +41,6 @@ export function getFilterOpts(
   };
 }
 
-export function createFilterStructure(
-  intl: IntlShape,
-  opts: OrderDraftListFilterOpts
-): IFilter<OrderDraftFilterKeys> {
-  return [
-    {
-      ...createDateField(
-        OrderDraftFilterKeys.created,
-        intl.formatMessage(messages.created),
-        opts.created.value
-      ),
-      active: opts.created.active
-    },
-    {
-      ...createTextField(
-        OrderDraftFilterKeys.customer,
-        intl.formatMessage(messages.customer),
-        opts.customer.value
-      ),
-      active: opts.customer.active
-    }
-  ];
-}
-
 export function getFilterVariables(
   params: OrderDraftListUrlFilters
 ): OrderDraftFilterInput {

src/orders/views/OrderDraftList/messages.ts

@@ -1,14 +0,0 @@
-import { defineMessages } from "react-intl";
-
-const messages = defineMessages({
-  customer: {
-    defaultMessage: "Customer",
-    description: "draft order"
-  },
-  created: {
-    defaultMessage: "Created",
-    description: "draft order"
-  }
-});
-
-export default messages;