diff --git a/src/channels/pages/ChannelsListPage/ChannelsListPage.tsx b/src/channels/pages/ChannelsListPage/ChannelsListPage.tsx index e5ed9cd28..09452eae6 100644 --- a/src/channels/pages/ChannelsListPage/ChannelsListPage.tsx +++ b/src/channels/pages/ChannelsListPage/ChannelsListPage.tsx @@ -56,12 +56,18 @@ export const ChannelsListPage: React.FC = ({ + {limitsReached && } { + const intl = useIntl(); + + return ( + + + + ); +}; + +OrderLimitReached.displayName = "OrderLimitReached"; +export default OrderLimitReached; diff --git a/src/orders/components/OrderListPage/OrderListPage.tsx b/src/orders/components/OrderListPage/OrderListPage.tsx index ac8a1dfe0..38d280147 100644 --- a/src/orders/components/OrderListPage/OrderListPage.tsx +++ b/src/orders/components/OrderListPage/OrderListPage.tsx @@ -2,18 +2,18 @@ import { Button, Card } from "@material-ui/core"; import CardMenu from "@saleor/components/CardMenu"; import Container from "@saleor/components/Container"; import FilterBar from "@saleor/components/FilterBar"; -import LimitReachedAlert from "@saleor/components/LimitReachedAlert"; import PageHeader from "@saleor/components/PageHeader"; import { RefreshLimits_shop_limits } from "@saleor/components/Shop/types/RefreshLimits"; import { sectionNames } from "@saleor/intl"; import { makeStyles } from "@saleor/macaw-ui"; import { OrderListUrlSortField } from "@saleor/orders/urls"; import { FilterPageProps, PageListProps, SortPage } from "@saleor/types"; -import { isLimitReached } from "@saleor/utils/limits"; +import { hasLimits, isLimitReached } from "@saleor/utils/limits"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; import { OrderList_orders_edges_node } from "../../types/OrderList"; +import OrderLimitReached from "../OrderLimitReached"; import OrderList from "../OrderList"; import { createFilterStructure, @@ -58,10 +58,26 @@ const OrderListPage: React.FC = ({ const intl = useIntl(); const classes = useStyles({}); const filterStructure = createFilterStructure(intl, filterOpts); + const limitsReached = isLimitReached(limits, "orders"); return ( - + {!!onSettingsOpen && ( = ({ /> )} - {isLimitReached(limits, "orders") && ( - - - - )} + {limitsReached && } = ({ params }) => { }); const { channel, availableChannels } = useAppChannel(); + const limitOpts = useShopLimitsQuery({ + variables: { + orders: true + } + }); const tabs = getFilterTabs(); @@ -183,6 +189,7 @@ export const OrderDraftList: React.FC = ({ params }) => { = props => { = ({ + + + +
+
+
+
+
+
+
+ Order limit reached +
+ +
+ You have reached your order limit, you will be billed extra for orders above limit. If you would like to up your limit, contact your administration staff about raising your limits. +
+
+
+
+
+
+
+
+ + +
+
+
+
+
+ +
+
+
+ + +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + +
+
+ No. of Order +
+ +
+
+
+
+ Date +
+
+
+
+
+ Customer +
+
+
+
+
+ Total +
+
+
+
+
+
+ +`; + exports[`Storyshots Views / Orders / Draft order list loading 1`] = `
+
+ 230/500 orders +