9a7c9a3bc3
* Update customer queries - add permissions * Filter the customer filter by permissions * Code refactor + optionally render components based on permissions * Update stories * Minor code refactor * Move useUserPermissions to RequirePermissions component * Change user provider component name * Change macaw-ui version
73 lines
2.3 KiB
TypeScript
73 lines
2.3 KiB
TypeScript
import { useUser } from "@saleor/auth";
|
|
import { channelsListUrl } from "@saleor/channels/urls";
|
|
import useAppChannel from "@saleor/components/AppLayout/AppChannelContext";
|
|
import useNavigator from "@saleor/hooks/useNavigator";
|
|
import { mapEdgesToItems } from "@saleor/utils/maps";
|
|
import React from "react";
|
|
|
|
import { getDatePeriod, getUserName } from "../../misc";
|
|
import { orderListUrl } from "../../orders/urls";
|
|
import { productListUrl, productVariantEditUrl } from "../../products/urls";
|
|
import { OrderStatusFilter, StockAvailability } from "../../types/globalTypes";
|
|
import HomePage from "../components/HomePage";
|
|
import { useHomePage } from "../queries";
|
|
|
|
const HomeSection = () => {
|
|
const navigate = useNavigator();
|
|
const { user } = useUser();
|
|
const { channel } = useAppChannel();
|
|
|
|
const noChannel = !channel && typeof channel !== "undefined";
|
|
|
|
const { data } = useHomePage({
|
|
displayLoader: true,
|
|
skip: noChannel,
|
|
variables: { channel: channel?.slug, datePeriod: getDatePeriod(1) }
|
|
});
|
|
|
|
return (
|
|
<HomePage
|
|
activities={mapEdgesToItems(data?.activities)?.reverse()}
|
|
orders={data?.ordersToday?.totalCount}
|
|
sales={data?.salesToday?.gross}
|
|
topProducts={mapEdgesToItems(data?.productTopToday)}
|
|
onProductClick={(productId, variantId) =>
|
|
navigate(productVariantEditUrl(productId, variantId))
|
|
}
|
|
onCreateNewChannelClick={() => {
|
|
navigate(channelsListUrl());
|
|
}}
|
|
onOrdersToCaptureClick={() =>
|
|
navigate(
|
|
orderListUrl({
|
|
status: [OrderStatusFilter.READY_TO_CAPTURE],
|
|
channel: [channel?.id]
|
|
})
|
|
)
|
|
}
|
|
onOrdersToFulfillClick={() =>
|
|
navigate(
|
|
orderListUrl({
|
|
status: [OrderStatusFilter.READY_TO_FULFILL],
|
|
channel: [channel?.id]
|
|
})
|
|
)
|
|
}
|
|
onProductsOutOfStockClick={() =>
|
|
navigate(
|
|
productListUrl({
|
|
stockStatus: StockAvailability.OUT_OF_STOCK,
|
|
channel: channel?.slug
|
|
})
|
|
)
|
|
}
|
|
ordersToCapture={data?.ordersToCapture?.totalCount}
|
|
ordersToFulfill={data?.ordersToFulfill?.totalCount}
|
|
productsOutOfStock={data?.productsOutOfStock.totalCount}
|
|
userName={getUserName(user, true)}
|
|
noChannel={noChannel}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default HomeSection;
|