djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add mapEdgesToItems util function and replace all usages

Browse source
This commit is contained in:
Magdalena Markusik 2021-05-10 17:25:54 +02:00
parent 5a439176b7
commit d1ae1559d0
50 changed files with 156 additions and 191 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/attributes/views/AttributeList/AttributeList.tsx
View file

@ -22,6 +22,7 @@ import usePaginator, {
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { useIntl } from "react-intl";
@ -147,7 +148,7 @@ const AttributeList: React.FC<AttributeListProps> = ({ params }) => {
return (
<>
<AttributeListPage
attributes={maybe(() => data.attributes.edges.map(edge => edge.node))}
attributes={mapEdgesToItems(data?.attributes)}
currentTab={currentTab}
disabled={loading || attributeBulkDeleteOpts.loading}
filterOpts={getFilterOpts(params)}

10
src/categories/views/CategoryDetails.tsx
View file

@ -15,7 +15,7 @@ import usePaginator, {
import { commonMessages } from "@saleor/intl";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapNodeToChoice } from "@saleor/utils/maps";
import { mapEdgesToItems, mapNodeToChoice } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -258,14 +258,10 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
pageInfo={pageInfo}
onProductClick={id => () => navigate(productUrl(id))}
onSubmit={handleSubmit}
products={maybe(() =>
data.category.products.edges.map(edge => edge.node)
)}
products={mapEdgesToItems(data?.category?.products)}
saveButtonBarState={updateResult.status}
selectedChannelId={channel?.id}
subcategories={maybe(() =>
data.category.children.edges.map(edge => edge.node)
)}
subcategories={mapEdgesToItems(data?.category?.children)}
subcategoryListToolbar={
<IconButton
color="primary"

6
src/categories/views/CategoryList/CategoryList.tsx
View file

@ -16,6 +16,7 @@ import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -143,10 +144,7 @@ export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
return (
<>
<CategoryListPage
categories={maybe(
() => data.categories.edges.map(edge => edge.node),
[]
)}
categories={mapEdgesToItems(data?.categories)}
currentTab={currentTab}
initialSearch={params.query || ""}
onSearchChange={query => changeFilterField({ query })}

5
src/collections/components/CollectionProducts/CollectionProducts.tsx
View file

@ -16,6 +16,7 @@ import { AVATAR_MARGIN } from "@saleor/components/TableCellAvatar/Avatar";
import TableHead from "@saleor/components/TableHead";
import TablePagination from "@saleor/components/TablePagination";
import { makeStyles } from "@saleor/theme";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -125,7 +126,7 @@ const CollectionProducts: React.FC<CollectionProductsProps> = props => {
colSpan={numberOfColumns}
selected={selected}
disabled={disabled}
items={maybe(() => collection.products.edges.map(edge => edge.node))}
items={mapEdgesToItems(collection?.products)}
toggleAll={toggleAll}
toolbar={toolbar}
>
@ -164,7 +165,7 @@ const CollectionProducts: React.FC<CollectionProductsProps> = props => {
</TableFooter>
<TableBody>
{renderCollection(
maybe(() => collection.products.edges.map(edge => edge.node)),
mapEdgesToItems(collection?.products),
product => {
const isSelected = product ? isChecked(product.id) : false;
const channel =

3
src/collections/views/CollectionList/CollectionList.tsx
View file

@ -19,6 +19,7 @@ import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -158,7 +159,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
onTabSave={() => openModal("save-search")}
tabs={tabs.map(tab => tab.name)}
disabled={loading}
collections={maybe(() => data.collections.edges.map(edge => edge.node))}
collections={mapEdgesToItems(data?.collections)}
settings={settings}
onNextPage={loadNextPage}
onPreviousPage={loadPreviousPage}

16
src/components/Navigator/modes/catalog.ts
View file

@ -3,6 +3,7 @@ import { collectionUrl } from "@saleor/collections/urls";
import { UseNavigatorResult } from "@saleor/hooks/useNavigator";
import { maybe } from "@saleor/misc";
import { productUrl } from "@saleor/products/urls";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { score } from "fuzzaldrin";
import { IntlShape } from "react-intl";
@ -19,9 +20,8 @@ export function searchInCatalog(
navigate: UseNavigatorResult,
catalog: SearchCatalog
): QuickSearchAction[] {
const categories: QuickSearchActionInput[] = maybe(
() => catalog.categories.edges.map(edge => edge.node),
[]
const categories: QuickSearchActionInput[] = mapEdgesToItems(
catalog?.categories
)
.map<QuickSearchActionInput>(category => ({
caption: intl.formatMessage(messages.category),
@ -36,9 +36,8 @@ export function searchInCatalog(
}))
.sort(sortScores);
const collections: QuickSearchActionInput[] = maybe(
() => catalog.collections.edges.map(edge => edge.node),
[]
const collections: QuickSearchActionInput[] = mapEdgesToItems(
catalog?.collections
)
.map<QuickSearchActionInput>(collection => ({
caption: intl.formatMessage(messages.collection),
@ -53,10 +52,7 @@ export function searchInCatalog(
}))
.sort(sortScores);
const products: QuickSearchActionInput[] = maybe(
() => catalog.products.edges.map(edge => edge.node),
[]
)
const products: QuickSearchActionInput[] = mapEdgesToItems(catalog?.products)
.map<QuickSearchActionInput>(product => ({
caption: intl.formatMessage(messages.product),
extraInfo: product.category.name,

6
src/components/Navigator/useQuickSearch.ts
View file

@ -6,6 +6,7 @@ import { maybe } from "@saleor/misc";
import { useOrderDraftCreateMutation } from "@saleor/orders/mutations";
import { orderUrl } from "@saleor/orders/urls";
import useCustomerSearch from "@saleor/searches/useCustomerSearch";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { RefObject, useEffect, useState } from "react";
import { useIntl } from "react-intl";
@ -107,10 +108,7 @@ function useQuickSearch(
intl,
{
catalog,
customers: maybe(
() => customers.data.search.edges.map(edge => edge.node),
[]
),
customers: mapEdgesToItems(customers?.data?.search),
order: maybe(() => orderData.order)
},
{

6
src/customers/components/CustomerDetailsPage/CustomerDetailsPage.tsx
View file

@ -11,7 +11,7 @@ import SaveButtonBar from "@saleor/components/SaveButtonBar";
import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
import { SubmitPromise } from "@saleor/hooks/useForm";
import { sectionNames } from "@saleor/intl";
import { mapMetadataItemToInput } from "@saleor/utils/maps";
import { mapEdgesToItems, mapMetadataItemToInput } from "@saleor/utils/maps";
import useMetadataChangeTrigger from "@saleor/utils/metadata/useMetadataChangeTrigger";
import React from "react";
import { useIntl } from "react-intl";
@ -102,9 +102,7 @@ const CustomerDetailsPage: React.FC<CustomerDetailsPageProps> = ({
/>
<CardSpacer />
<CustomerOrders
orders={maybe(() =>
customer.orders.edges.map(edge => edge.node)
)}
orders={mapEdgesToItems(customer?.orders)}
onViewAllOrdersClick={onViewAllOrdersClick}
onRowClick={onRowClick}
/>

3
src/customers/views/CustomerList/CustomerList.tsx
View file

@ -19,6 +19,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -158,7 +159,7 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
onTabDelete={() => openModal("delete-search")}
onTabSave={() => openModal("save-search")}
tabs={tabs.map(tab => tab.name)}
customers={maybe(() => data.customers.edges.map(edge => edge.node))}
customers={mapEdgesToItems(data?.customers)}
settings={settings}
disabled={loading}
pageInfo={pageInfo}

5
src/discounts/components/DiscountCategories/DiscountCategories.tsx
View file

@ -13,6 +13,7 @@ import Skeleton from "@saleor/components/Skeleton";
import TableHead from "@saleor/components/TableHead";
import TablePagination from "@saleor/components/TablePagination";
import { makeStyles } from "@saleor/theme";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -98,7 +99,7 @@ const DiscountCategories: React.FC<DiscountCategoriesProps> = props => {
colSpan={numberOfColumns}
selected={selected}
disabled={disabled}
items={maybe(() => discount.categories.edges.map(edge => edge.node))}
items={mapEdgesToItems(discount?.categories)}
toggleAll={toggleAll}
toolbar={toolbar}
>
@ -130,7 +131,7 @@ const DiscountCategories: React.FC<DiscountCategoriesProps> = props => {
</TableFooter>
<TableBody>
{renderCollection(
maybe(() => discount.categories.edges.map(edge => edge.node)),
mapEdgesToItems(discount?.categories),
category => {
const isSelected = category ? isChecked(category.id) : false;

5
src/discounts/components/DiscountCollections/DiscountCollections.tsx
View file

@ -13,6 +13,7 @@ import Skeleton from "@saleor/components/Skeleton";
import TableHead from "@saleor/components/TableHead";
import TablePagination from "@saleor/components/TablePagination";
import { makeStyles } from "@saleor/theme";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -100,7 +101,7 @@ const DiscountCollections: React.FC<DiscountCollectionsProps> = props => {
colSpan={numberOfColumns}
selected={selected}
disabled={disabled}
items={maybe(() => sale.collections.edges.map(edge => edge.node))}
items={mapEdgesToItems(sale?.collections)}
toggleAll={toggleAll}
toolbar={toolbar}
>
@ -130,7 +131,7 @@ const DiscountCollections: React.FC<DiscountCollectionsProps> = props => {
</TableFooter>
<TableBody>
{renderCollection(
maybe(() => sale.collections.edges.map(edge => edge.node)),
mapEdgesToItems(sale?.collections),
collection => {
const isSelected = collection ? isChecked(collection.id) : false;
return (

5
src/discounts/components/DiscountProducts/DiscountProducts.tsx
View file

@ -16,6 +16,7 @@ import { AVATAR_MARGIN } from "@saleor/components/TableCellAvatar/Avatar";
import TableHead from "@saleor/components/TableHead";
import TablePagination from "@saleor/components/TablePagination";
import { makeStyles } from "@saleor/theme";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -121,7 +122,7 @@ const DiscountProducts: React.FC<SaleProductsProps> = props => {
colSpan={numberOfColumns}
selected={selected}
disabled={disabled}
items={maybe(() => sale.products.edges.map(edge => edge.node))}
items={mapEdgesToItems(sale?.products)}
toggleAll={toggleAll}
toolbar={toolbar}
>
@ -156,7 +157,7 @@ const DiscountProducts: React.FC<SaleProductsProps> = props => {
</TableFooter>
<TableBody>
{renderCollection(
maybe(() => sale.products.edges.map(edge => edge.node)),
mapEdgesToItems(sale?.products),
product => {
const isSelected = product ? isChecked(product.id) : false;
const channel =

3
src/discounts/views/SaleList/SaleList.tsx
View file

@ -21,6 +21,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -172,7 +173,7 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
onTabDelete={() => openModal("delete-search")}
onTabSave={() => openModal("save-search")}
tabs={tabs.map(tab => tab.name)}
sales={maybe(() => data.sales.edges.map(edge => edge.node))}
sales={mapEdgesToItems(data?.sales)}
settings={settings}
disabled={loading}
pageInfo={pageInfo}

3
src/discounts/views/VoucherList/VoucherList.tsx
View file

@ -21,6 +21,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -174,7 +175,7 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
onTabSave={() => openModal("save-search")}
tabs={tabs.map(tab => tab.name)}
settings={settings}
vouchers={maybe(() => data.vouchers.edges.map(edge => edge.node))}
vouchers={mapEdgesToItems(data?.vouchers)}
disabled={loading}
pageInfo={pageInfo}
onAdd={() => navigate(voucherAddUrl())}

5
src/home/views/index.tsx
View file

@ -2,6 +2,7 @@ import { channelsListUrl } from "@saleor/channels/urls";
import useAppChannel from "@saleor/components/AppLayout/AppChannelContext";
import useNavigator from "@saleor/hooks/useNavigator";
import useUser from "@saleor/hooks/useUser";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { getDatePeriod, getUserName } from "../../misc";
@ -26,10 +27,10 @@ const HomeSection = () => {
return (
<HomePage
activities={data?.activities?.edges.map(edge => edge.node).reverse()}
activities={mapEdgesToItems(data?.activities)}
orders={data?.ordersToday?.totalCount}
sales={data?.salesToday?.gross}
topProducts={data?.productTopToday?.edges.map(edge => edge.node)}
topProducts={mapEdgesToItems(data?.productTopToday)}
onProductClick={(productId, variantId) =>
navigate(productVariantEditUrl(productId, variantId))
}

18
src/navigation/views/MenuDetails/index.tsx
View file

@ -1,4 +1,5 @@
import DialogContentText from "@material-ui/core/DialogContentText";
import { collection } from "@saleor/collections/fixtures";
import ActionDialog from "@saleor/components/ActionDialog";
import { DEFAULT_INITIAL_SEARCH_DATA } from "@saleor/config";
import useNavigator from "@saleor/hooks/useNavigator";
@ -6,6 +7,7 @@ import useNotifier from "@saleor/hooks/useNotifier";
import useCategorySearch from "@saleor/searches/useCategorySearch";
import useCollectionSearch from "@saleor/searches/useCollectionSearch";
import usePageSearch from "@saleor/searches/usePageSearch";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -112,21 +114,15 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
pageSearch.search(query);
};
const categories = maybe(
() => categorySearch.result.data.search.edges.map(edge => edge.node),
[]
const categories = mapEdgesToItems(
categorySearch?.result?.data?.search
);
const collections = maybe(
() =>
collectionSearch.result.data.search.edges.map(edge => edge.node),
[]
const collections = mapEdgesToItems(
collectionSearch?.result?.data?.search
);
const pages = maybe(
() => pageSearch.result.data.search.edges.map(edge => edge.node),
[]
);
const pages = mapEdgesToItems(pageSearch?.result?.data?.search);
return (
<MenuDeleteMutation

3
src/navigation/views/MenuList/MenuList.tsx
View file

@ -13,6 +13,7 @@ import { buttonMessages, commonMessages } from "@saleor/intl";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -127,7 +128,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
<>
<MenuListPage
disabled={loading}
menus={maybe(() => data.menus.edges.map(edge => edge.node))}
menus={mapEdgesToItems(data?.menus)}
settings={settings}
onAdd={() =>
navigate(

3
src/orders/views/OrderDetails/OrderDraftDetails/index.tsx
View file

@ -16,6 +16,7 @@ import { OrderDetails } from "@saleor/orders/types/OrderDetails";
import { OrderDiscountProvider } from "@saleor/products/components/OrderDiscountProviders/OrderDiscountProvider";
import { OrderLineDiscountProvider } from "@saleor/products/components/OrderDiscountProviders/OrderLineDiscountProvider";
import useCustomerSearch from "@saleor/searches/useCustomerSearch";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { useIntl } from "react-intl";
@ -233,7 +234,7 @@ export const OrderDraftDetails: React.FC<OrderDraftDetailsProps> = ({
loading={variantSearchOpts.loading}
open={params.action === "add-order-line"}
hasMore={variantSearchOpts.data?.search.pageInfo.hasNextPage}
products={variantSearchOpts.data?.search.edges.map(edge => edge.node)}
products={mapEdgesToItems(variantSearchOpts?.data?.search)}
selectedChannelId={order?.channel?.id}
onClose={closeModal}
onFetch={variantSearch}

5
src/orders/views/OrderDetails/OrderNormalDetails/index.tsx
View file

@ -3,6 +3,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useUser from "@saleor/hooks/useUser";
import OrderCannotCancelOrderDialog from "@saleor/orders/components/OrderCannotCancelOrderDialog";
import OrderInvoiceEmailSendDialog from "@saleor/orders/components/OrderInvoiceEmailSendDialog";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { useWarehouseList } from "@saleor/warehouses/queries";
import React from "react";
import { useIntl } from "react-intl";
@ -224,9 +225,7 @@ export const OrderNormalDetails: React.FC<OrderNormalDetailsProps> = ({
orderFulfillmentCancel.opts.data?.orderFulfillmentCancel.errors || []
}
open={params.action === "cancel-fulfillment"}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
onConfirm={variables =>
orderFulfillmentCancel.mutate({
id: params.id,

7
src/orders/views/OrderDetails/OrderUnconfirmedDetails/index.tsx
View file

@ -6,6 +6,7 @@ import OrderCannotCancelOrderDialog from "@saleor/orders/components/OrderCannotC
import OrderInvoiceEmailSendDialog from "@saleor/orders/components/OrderInvoiceEmailSendDialog";
import { OrderDiscountProvider } from "@saleor/products/components/OrderDiscountProviders/OrderDiscountProvider";
import { OrderLineDiscountProvider } from "@saleor/products/components/OrderDiscountProviders/OrderLineDiscountProvider";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { useWarehouseList } from "@saleor/warehouses/queries";
import React from "react";
import { useIntl } from "react-intl";
@ -240,7 +241,7 @@ export const OrderUnconfirmedDetails: React.FC<OrderUnconfirmedDetailsProps> = (
loading={variantSearchOpts.loading}
open={params.action === "add-order-line"}
hasMore={variantSearchOpts.data?.search.pageInfo.hasNextPage}
products={variantSearchOpts.data?.search.edges.map(edge => edge.node)}
products={mapEdgesToItems(variantSearchOpts?.data?.search)}
selectedChannelId={order?.channel?.id}
onClose={closeModal}
onFetch={variantSearch}
@ -297,9 +298,7 @@ export const OrderUnconfirmedDetails: React.FC<OrderUnconfirmedDetailsProps> = (
orderFulfillmentCancel.opts.data?.orderFulfillmentCancel.errors || []
}
open={params.action === "cancel-fulfillment"}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
onConfirm={variables =>
orderFulfillmentCancel.mutate({
id: params.id,

6
src/orders/views/OrderDraftList/OrderDraftList.tsx
View file

@ -20,7 +20,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapNodeToChoice } from "@saleor/utils/maps";
import { mapEdgesToItems, mapNodeToChoice } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -194,9 +194,7 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
tabs={tabs.map(tab => tab.name)}
disabled={loading}
settings={settings}
orders={maybe(() =>
data.draftOrders.edges.map(edge => edge.node)
)}
orders={mapEdgesToItems(data?.draftOrders)}
pageInfo={pageInfo}
onAdd={() => openModal("create-order")}
onNextPage={loadNextPage}

3
src/orders/views/OrderFulfill/OrderFulfill.tsx
View file

@ -5,6 +5,7 @@ import OrderFulfillPage from "@saleor/orders/components/OrderFulfillPage";
import { useOrderFulfill } from "@saleor/orders/mutations";
import { useOrderFulfillData } from "@saleor/orders/queries";
import { orderUrl } from "@saleor/orders/urls";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { useWarehouseList } from "@saleor/warehouses/queries";
import React from "react";
import { useIntl } from "react-intl";
@ -86,7 +87,7 @@ const OrderFulfill: React.FC<OrderFulfillProps> = ({ orderId }) => {
}
order={data?.order}
saveButtonBar="default"
warehouses={warehouseData?.warehouses.edges.map(edge => edge.node)}
warehouses={mapEdgesToItems(warehouseData?.warehouses)}
/>
</>
);

4
src/orders/views/OrderList/OrderList.tsx
View file

@ -16,7 +16,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapNodeToChoice } from "@saleor/utils/maps";
import { mapEdgesToItems, mapNodeToChoice } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { useIntl } from "react-intl";
@ -157,7 +157,7 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
disabled={loading}
filterOpts={getFilterOpts(params, channelOpts)}
limits={limitOpts.data?.shop.limits}
orders={maybe(() => data.orders.edges.map(edge => edge.node))}
orders={mapEdgesToItems(data?.orders)}
pageInfo={pageInfo}
sort={getSortParams(params)}
onAdd={() => openModal("create-order")}

5
src/pageTypes/views/PageTypeDetails.tsx
View file

@ -22,6 +22,7 @@ import {
import { ReorderEvent } from "@saleor/types";
import getPageErrorMessage from "@saleor/utils/errors/page";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -255,8 +256,8 @@ export const PageTypeDetails: React.FC<PageTypeDetailsProps> = ({
/>
{!dataLoading && (
<AssignAttributeDialog
attributes={result.data?.pageType.availableAttributes.edges.map(
edge => edge.node
attributes={mapEdgesToItems(
result?.data?.pageType?.availableAttributes
)}
confirmButtonState={assignAttributeOpts.status}
errors={

13
src/pages/views/PageCreate.tsx
View file

@ -13,6 +13,7 @@ import usePageSearch from "@saleor/searches/usePageSearch";
import usePageTypeSearch from "@saleor/searches/usePageTypeSearch";
import useProductSearch from "@saleor/searches/useProductSearch";
import createMetadataCreateHandler from "@saleor/utils/handlers/metadataCreateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -164,9 +165,7 @@ export const PageCreate: React.FC<PageCreateProps> = ({ params }) => {
errors={pageCreateOpts.data?.pageCreate.errors || []}
saveButtonBarState={pageCreateOpts.status}
page={null}
pageTypes={searchPageTypesOpts.data?.search.edges.map(
edge => edge.node
)}
pageTypes={mapEdgesToItems(searchPageTypesOpts?.data?.search)}
onBack={() => navigate(pageListUrl())}
onRemove={() => undefined}
onSubmit={handleSubmit}
@ -176,11 +175,9 @@ export const PageCreate: React.FC<PageCreateProps> = ({ params }) => {
params.action === "assign-attribute-value" && params.id
}
onAssignReferencesClick={handleAssignAttributeReferenceClick}
referencePages={searchPagesOpts.data?.search.edges.map(
edge => edge.node
)}
referenceProducts={searchProductsOpts.data?.search.edges.map(
edge => edge.node
referencePages={mapEdgesToItems(searchPagesOpts?.data?.search)}
referenceProducts={mapEdgesToItems(
searchProductsOpts?.data?.search
)}
fetchReferencePages={searchPages}
fetchMoreReferencePages={fetchMoreReferencePages}

9
src/pages/views/PageDetails.tsx
View file

@ -24,6 +24,7 @@ import { commonMessages } from "@saleor/intl";
import usePageSearch from "@saleor/searches/usePageSearch";
import useProductSearch from "@saleor/searches/useProductSearch";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -206,12 +207,8 @@ export const PageDetails: React.FC<PageDetailsProps> = ({ id, params }) => {
params.action === "assign-attribute-value" && params.id
}
onAssignReferencesClick={handleAssignAttributeReferenceClick}
referencePages={searchPagesOpts.data?.search.edges.map(
edge => edge.node
)}
referenceProducts={searchProductsOpts.data?.search.edges.map(
edge => edge.node
)}
referencePages={mapEdgesToItems(searchPagesOpts?.data?.search)}
referenceProducts={mapEdgesToItems(searchProductsOpts?.data?.search)}
fetchReferencePages={searchPages}
fetchMoreReferencePages={fetchMoreReferencePages}
fetchReferenceProducts={searchProducts}

3
src/pages/views/PageList/PageList.tsx
View file

@ -15,6 +15,7 @@ import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -114,7 +115,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
<PageListPage
disabled={loading}
settings={settings}
pages={maybe(() => data.pages.edges.map(edge => edge.node))}
pages={mapEdgesToItems(data?.pages)}
pageInfo={pageInfo}
onAdd={() => navigate(pageCreateUrl())}
onBack={() => navigate(configurationMenuUrl)}

4
src/permissionGroups/views/PermissionGroupDetails/PermissionGroupDetails.tsx
View file

@ -13,9 +13,11 @@ import {
permissionsDiff,
usersDiff
} from "@saleor/permissionGroups/utils";
import { searchProducts } from "@saleor/searches/useProductSearch";
import useStaffMemberSearch from "@saleor/searches/useStaffMemberSearch";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React, { useState } from "react";
import { useIntl } from "react-intl";
@ -185,7 +187,7 @@ export const PermissionGroupDetails: React.FC<PermissionGroupDetailsProps> = ({
/>
<AssignMembersDialog
loading={searchResult.loading}
staffMembers={searchResult?.data?.search.edges.map(edge => edge.node)}
staffMembers={mapEdgesToItems(searchResult?.data?.search)}
onSearchChange={search}
onFetchMore={loadMore}
disabled={disabled}

3
src/permissionGroups/views/PermissionGroupList/PermissionGroupList.tsx
View file

@ -14,6 +14,7 @@ import { PermissionGroupDelete } from "@saleor/permissionGroups/types/Permission
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { useIntl } from "react-intl";
@ -73,7 +74,7 @@ export const PermissionGroupList: React.FC<PermissionGroupListProps> = ({
PermissionGroupListUrlQueryParams
>(navigate, permissionGroupListUrl, params);
const permissionGroups = data?.permissionGroups?.edges.map(edge => edge.node);
const permissionGroups = mapEdgesToItems(data?.permissionGroups);
const [deleteError, setDeleteError] = React.useState<
PermissionGroupErrorFragment
>();

3
src/plugins/views/PluginList/PluginList.tsx
View file

@ -13,6 +13,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
@ -121,7 +122,7 @@ export const PluginsList: React.FC<PluginsListProps> = ({ params }) => {
filterOpts={getFilterOpts(params)}
initialSearch={params.query || ""}
settings={settings}
plugins={maybe(() => data.plugins.edges.map(edge => edge.node))}
plugins={mapEdgesToItems(data?.plugins)}
pageInfo={pageInfo}
sort={getSortParams(params)}
tabs={getFilterTabs().map(tab => tab.name)}

5
src/productTypes/views/ProductTypeList/ProductTypeList.tsx
View file

@ -18,6 +18,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -174,9 +175,7 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
onTabSave={() => openModal("save-search")}
tabs={tabs.map(tab => tab.name)}
disabled={loading}
productTypes={maybe(() =>
data.productTypes.edges.map(edge => edge.node)
)}
productTypes={mapEdgesToItems(data?.productTypes)}
pageInfo={pageInfo}
onAdd={() => navigate(productTypeAddUrl)}
onBack={() => navigate(configurationMenuUrl)}

7
src/productTypes/views/ProductTypeUpdate/index.tsx
View file

@ -15,6 +15,7 @@ import { useProductTypeUpdateMutation } from "@saleor/productTypes/mutations";
import { ReorderEvent } from "@saleor/types";
import { ProductAttributeType } from "@saleor/types/globalTypes";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -338,10 +339,8 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
{!dataLoading &&
Object.keys(ProductAttributeType).map(key => (
<AssignAttributeDialog
attributes={maybe(() =>
result.data.productType.availableAttributes.edges.map(
edge => edge.node
)
attributes={mapEdgesToItems(
result?.data?.productType?.availableAttributes
)}
confirmButtonState={assignAttribute.opts.status}
errors={maybe(

13
src/products/views/ProductCreate/ProductCreate.tsx
View file

@ -34,6 +34,7 @@ import { useTaxTypeList } from "@saleor/taxes/queries";
import { getProductErrorMessage } from "@saleor/utils/errors";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataCreateHandler from "@saleor/utils/handlers/metadataCreateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -310,9 +311,7 @@ export const ProductCreateView: React.FC<ProductCreateProps> = ({ params }) => {
fetchMoreCategories={fetchMoreCategories}
fetchMoreCollections={fetchMoreCollections}
fetchMoreProductTypes={fetchMoreProductTypes}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
taxTypes={taxTypes.data?.taxTypes || []}
weightUnit={shop?.defaultWeightUnit}
openChannelsModal={handleChannelsModalOpen}
@ -321,12 +320,8 @@ export const ProductCreateView: React.FC<ProductCreateProps> = ({ params }) => {
params.action === "assign-attribute-value" && params.id
}
onAssignReferencesClick={handleAssignAttributeReferenceClick}
referencePages={searchPagesOpts.data?.search.edges.map(
edge => edge.node
)}
referenceProducts={searchProductsOpts.data?.search.edges.map(
edge => edge.node
)}
referencePages={mapEdgesToItems(searchPagesOpts?.data?.search)}
referenceProducts={mapEdgesToItems(searchProductsOpts?.data?.search)}
fetchReferencePages={searchPages}
fetchMoreReferencePages={fetchMoreReferencePages}
fetchReferenceProducts={searchProducts}

17
src/products/views/ProductList/ProductList.tsx
View file

@ -55,6 +55,7 @@ import useProductTypeSearch from "@saleor/searches/useProductTypeSearch";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortUrlVariables } from "@saleor/utils/sort";
import { useWarehouseList } from "@saleor/warehouses/queries";
import React, { useEffect } from "react";
@ -353,18 +354,14 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
sort: params.sort
}}
onSort={handleSort}
availableInGridAttributes={maybe(
() => attributes.data.availableInGrid.edges.map(edge => edge.node),
[]
availableInGridAttributes={mapEdgesToItems(
attributes?.data?.availableInGrid
)}
currencySymbol={channel?.currencyCode || ""}
currentTab={currentTab}
defaultSettings={defaultListSettings[ListViews.PRODUCT_LIST]}
filterOpts={filterOpts}
gridAttributes={maybe(
() => attributes.data.grid.edges.map(edge => edge.node),
[]
)}
gridAttributes={mapEdgesToItems(attributes?.data?.grid)}
totalGridAttributes={maybe(
() => attributes.data.availableInGrid.totalCount,
0
@ -378,7 +375,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
onAdd={() => navigate(productAddUrl())}
disabled={loading}
limits={limitOpts.data?.shop.limits}
products={maybe(() => data.products.edges.map(edge => edge.node))}
products={mapEdgesToItems(data?.products)}
onFetchMore={() =>
attributes.loadMore(
(prev, next) => {
@ -484,9 +481,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
filter: data?.products.totalCount
}}
selectedProducts={listElements.length}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
channels={availableChannels}
onClose={closeModal}
onSubmit={data =>

28
src/products/views/ProductList/filters.ts
View file

@ -20,6 +20,7 @@ import {
SearchProductTypes,
SearchProductTypesVariables
} from "@saleor/searches/types/SearchProductTypes";
import { mapEdgesToItems, mapNodeToChoice } from "@saleor/utils/maps";
import isArray from "lodash-es/isArray";
import { IFilterElement } from "../../../components/Filter";
@ -80,13 +81,8 @@ export function getFilterOpts(
})),
categories: {
active: !!params.categories,
choices: maybe(
() =>
categories.search.result.data.search.edges.map(edge => ({
label: edge.node.name,
value: edge.node.id
})),
[]
choices: mapNodeToChoice(
mapEdgesToItems(categories?.search?.result?.data?.search)
),
displayValues: !!params.categories
? maybe(
@ -110,13 +106,8 @@ export function getFilterOpts(
},
collections: {
active: !!params.collections,
choices: maybe(
() =>
collections.search.result.data.search.edges.map(edge => ({
label: edge.node.name,
value: edge.node.id
})),
[]
choices: mapNodeToChoice(
mapEdgesToItems(collections?.search?.result?.data?.search)
),
displayValues: !!params.collections
? maybe(
@ -151,13 +142,8 @@ export function getFilterOpts(
},
productType: {
active: !!params.productTypes,
choices: maybe(
() =>
productTypes.search.result.data.search.edges.map(edge => ({
label: edge.node.name,
value: edge.node.id
})),
[]
choices: mapNodeToChoice(
mapEdgesToItems(productTypes?.search?.result?.data?.search)
),
displayValues: !!params.productTypes
? maybe(

13
src/products/views/ProductUpdate/ProductUpdate.tsx
View file

@ -47,6 +47,7 @@ import useProductSearch from "@saleor/searches/useProductSearch";
import { getProductErrorMessage } from "@saleor/utils/errors";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -525,9 +526,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
header={product?.name}
placeholderImage={placeholderImg}
product={product}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
taxTypes={data?.taxTypes}
variants={product?.variants}
onBack={handleBack}
@ -570,12 +569,8 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
params.action === "assign-attribute-value" && params.id
}
onAssignReferencesClick={handleAssignAttributeReferenceClick}
referencePages={searchPagesOpts.data?.search.edges.map(
edge => edge.node
)}
referenceProducts={searchProductsOpts.data?.search.edges.map(
edge => edge.node
)}
referencePages={mapEdgesToItems(searchPagesOpts?.data?.search)}
referenceProducts={mapEdgesToItems(searchProductsOpts?.data?.search)}
fetchReferencePages={searchPages}
fetchMoreReferencePages={fetchMoreReferencePages}
fetchReferenceProducts={searchProducts}

13
src/products/views/ProductVariant.tsx
View file

@ -27,6 +27,7 @@ import usePageSearch from "@saleor/searches/usePageSearch";
import useProductSearch from "@saleor/searches/useProductSearch";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -326,9 +327,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
placeholderImage={placeholderImg}
variant={variant}
header={variant?.name || variant?.sku}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
onAdd={() => navigate(productVariantAddUrl(productId))}
onBack={handleBack}
onDelete={() => openModal("remove")}
@ -346,12 +345,8 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
params.action === "assign-attribute-value" && params.id
}
onAssignReferencesClick={handleAssignAttributeReferenceClick}
referencePages={searchPagesOpts.data?.search.edges.map(
edge => edge.node
)}
referenceProducts={searchProductsOpts.data?.search.edges.map(
edge => edge.node
)}
referencePages={mapEdgesToItems(searchPagesOpts?.data?.search)}
referenceProducts={mapEdgesToItems(searchProductsOpts?.data?.search)}
fetchReferencePages={searchPages}
fetchMoreReferencePages={fetchMoreReferencePages}
fetchReferenceProducts={searchProducts}

13
src/products/views/ProductVariantCreate.tsx
View file

@ -14,6 +14,7 @@ import useShop from "@saleor/hooks/useShop";
import usePageSearch from "@saleor/searches/usePageSearch";
import useProductSearch from "@saleor/searches/useProductSearch";
import createMetadataCreateHandler from "@saleor/utils/handlers/metadataCreateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -203,20 +204,14 @@ export const ProductVariant: React.FC<ProductVariantCreateProps> = ({
onWarehouseConfigure={() => navigate(warehouseAddPath)}
onVariantReorder={handleVariantReorder}
saveButtonBarState={variantCreateResult.status}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(warehouses?.data?.warehouses)}
weightUnit={shop?.defaultWeightUnit}
assignReferencesAttributeId={
params.action === "assign-attribute-value" && params.id
}
onAssignReferencesClick={handleAssignAttributeReferenceClick}
referencePages={searchPagesOpts.data?.search.edges.map(
edge => edge.node
)}
referenceProducts={searchProductsOpts.data?.search.edges.map(
edge => edge.node
)}
referencePages={mapEdgesToItems(searchPagesOpts?.data?.search)}
referenceProducts={mapEdgesToItems(searchProductsOpts?.data?.search)}
fetchReferencePages={searchPages}
fetchMoreReferencePages={fetchMoreReferencePages}
fetchReferenceProducts={searchProducts}

3
src/products/views/ProductVariantCreator/ProductVariantCreator.tsx
View file

@ -5,6 +5,7 @@ import useNotifier from "@saleor/hooks/useNotifier";
import { useProductVariantBulkCreateMutation } from "@saleor/products/mutations";
import { useCreateMultipleVariantsData } from "@saleor/products/queries";
import { productUrl } from "@saleor/products/urls";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { useIntl } from "react-intl";
@ -73,7 +74,7 @@ const ProductVariantCreator: React.FC<ProductVariantCreatorProps> = ({
variables: { id, inputs }
})
}
warehouses={data?.warehouses.edges.map(edge => edge.node) || []}
warehouses={mapEdgesToItems(data?.warehouses)}
/>
</>
);

5
src/shipping/components/ShippingMethodProducts/ShippingMethodProducts.stories.tsx
View file

@ -1,5 +1,6 @@
import { shippingZone } from "@saleor/shipping/fixtures";
import Decorator from "@saleor/storybook//Decorator";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { storiesOf } from "@storybook/react";
import React from "react";
@ -7,8 +8,8 @@ import ShippingMethodProducts, {
ShippingMethodProductsProps
} from "./ShippingMethodProducts";
const products = shippingZone.shippingMethods[0].excludedProducts.edges.map(
edge => edge.node
const products = mapEdgesToItems(
shippingZone.shippingMethods[0].excludedProducts
);
const props: ShippingMethodProductsProps = {

6
src/shipping/components/ShippingZoneRatesPage/ShippingZoneRatesPage.tsx
View file

@ -30,7 +30,7 @@ import {
PostalCodeRuleInclusionTypeEnum,
ShippingMethodTypeEnum
} from "@saleor/types/globalTypes";
import { mapMetadataItemToInput } from "@saleor/utils/maps";
import { mapEdgesToItems, mapMetadataItemToInput } from "@saleor/utils/maps";
import useMetadataChangeTrigger from "@saleor/utils/metadata/useMetadataChangeTrigger";
import React from "react";
import { FormattedMessage } from "react-intl";
@ -192,9 +192,7 @@ export const ShippingZoneRatesPage: React.FC<ShippingZoneRatesPageProps> = ({
/>
<CardSpacer />
<ShippingMethodProducts
products={rate?.excludedProducts?.edges.map(
edge => edge.node
)}
products={mapEdgesToItems(rate?.excludedProducts)}
onProductAssign={onProductAssign}
onProductUnassign={onProductUnassign}
disabled={disabled}

5
src/shipping/views/ShippingZoneDetails/index.tsx
View file

@ -22,6 +22,7 @@ import {
} from "@saleor/shipping/mutations";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -204,9 +205,7 @@ const ShippingZoneDetails: React.FC<ShippingZoneDetailsProps> = ({
}
saveButtonBarState={updateShippingZoneOpts.status}
shippingZone={data?.shippingZone}
warehouses={
searchWarehousesOpts.data?.search.edges.map(edge => edge.node) || []
}
warehouses={mapEdgesToItems(searchWarehousesOpts?.data?.search)}
hasMore={searchWarehousesOpts.data?.search.pageInfo.hasNextPage}
loading={searchWarehousesOpts.loading}
onFetchMore={loadMore}

5
src/shipping/views/ShippingZonesList.tsx
View file

@ -16,6 +16,7 @@ import { commonMessages } from "@saleor/intl";
import { getStringOrPlaceholder, maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -125,9 +126,7 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
deleteShippingZoneOpts.loading ||
updateDefaultWeightUnitOpts.loading
}
shippingZones={maybe(() =>
data.shippingZones.edges.map(edge => edge.node)
)}
shippingZones={mapEdgesToItems(data?.shippingZones)}
pageInfo={pageInfo}
onAdd={() => navigate(shippingZoneAddUrl)}
onBack={() => navigate(configurationMenuUrl)}

5
src/staff/views/StaffDetails.tsx
View file

@ -9,6 +9,7 @@ import useUser from "@saleor/hooks/useUser";
import { commonMessages } from "@saleor/intl";
import { getStringOrPlaceholder, maybe } from "@saleor/misc";
import usePermissionGroupSearch from "@saleor/searches/usePermissionGroupSearch";
import { mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -207,8 +208,8 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
})
)
}
availablePermissionGroups={searchPermissionGroupsOpts.data?.search.edges.map(
edge => edge.node
availablePermissionGroups={mapEdgesToItems(
searchPermissionGroupsOpts?.data?.search
)}
staffMember={staffMember}
saveButtonBarState={updateResult.status}

7
src/staff/views/StaffList/StaffList.tsx
View file

@ -19,6 +19,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import React from "react";
import { useIntl } from "react-intl";
@ -187,7 +188,7 @@ export const StaffList: React.FC<StaffListProps> = ({ params }) => {
settings={settings}
pageInfo={pageInfo}
sort={getSortParams(params)}
staffMembers={staffQueryData?.staffUsers.edges.map(edge => edge.node)}
staffMembers={mapEdgesToItems(staffQueryData?.staffUsers)}
onAdd={() => openModal("add")}
onBack={() => navigate(configurationMenuUrl)}
onNextPage={loadNextPage}
@ -197,8 +198,8 @@ export const StaffList: React.FC<StaffListProps> = ({ params }) => {
onSort={handleSort}
/>
<StaffAddMemberDialog
availablePermissionGroups={searchPermissionGroupsOpts.data?.search.edges.map(
edge => edge.node
availablePermissionGroups={mapEdgesToItems(
searchPermissionGroupsOpts?.data?.search
)}
confirmButtonState={addStaffMemberData.status}
initialSearch=""

5
src/storybook/stories/categories/CategoryUpdatePage.tsx
View file

@ -1,6 +1,7 @@
import placeholderImage from "@assets/images/placeholder255x255.png";
import { Omit } from "@material-ui/core";
import { ProductErrorCode } from "@saleor/types/globalTypes";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { storiesOf } from "@storybook/react";
import React from "react";
@ -45,10 +46,10 @@ const updateProps: Omit<CategoryUpdatePageProps, "classes"> = {
hasPreviousPage: true
},
productListToolbar: null,
products: category.products.edges.map(edge => edge.node),
products: mapEdgesToItems(category.products),
saveButtonBarState: "default",
selectedChannelId: "123",
subcategories: category.children.edges.map(edge => edge.node),
subcategories: mapEdgesToItems(category.children),
subcategoryListToolbar: null,
...listActionsProps
};

5
src/storybook/stories/home/HomePage.tsx
View file

@ -2,6 +2,7 @@ import placeholderImage from "@assets/images/placeholder60x60.png";
import { Omit } from "@material-ui/core";
import { adminUserPermissions } from "@saleor/fixtures";
import { PermissionEnum } from "@saleor/types/globalTypes";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { storiesOf } from "@storybook/react";
import React from "react";
@ -12,7 +13,7 @@ import Decorator from "../../Decorator";
const shop = shopFixture(placeholderImage);
const homePageProps: Omit<HomePageProps, "classes"> = {
activities: shop.activities.edges.map(edge => edge.node),
activities: mapEdgesToItems(shop.activities),
noChannel: false,
onCreateNewChannelClick: () => undefined,
onOrdersToCaptureClick: () => undefined,
@ -24,7 +25,7 @@ const homePageProps: Omit<HomePageProps, "classes"> = {
ordersToFulfill: shop.ordersToFulfill.totalCount,
productsOutOfStock: shop.productsOutOfStock.totalCount,
sales: shop.salesToday.gross,
topProducts: shop.productTopToday.edges.map(edge => edge.node),
topProducts: mapEdgesToItems(shop.productTopToday),
userName: "admin@example.com",
userPermissions: adminUserPermissions
};

12
src/utils/maps.ts
View file

@ -6,6 +6,18 @@ import { SearchPages_search_edges_node } from "@saleor/searches/types/SearchPage
import { Node } from "@saleor/types";
import { MetadataInput } from "@saleor/types/globalTypes";
interface EdgesType<T> {
edges?: Array<{ node: T }>;
}
export function mapEdgesToItems<T>(data?: EdgesType<T>): T[] {
if (!data || !data?.edges) {
return [];
}
return data.edges.map(({ node }) => node);
}
export function mapCountriesToChoices(
countries: ShopInfo_shop_countries[]
): Array<SingleAutocompleteChoiceType | MultiAutocompleteChoiceType> {

4
src/warehouses/components/WarehouseDetailsPage/WarehouseDetailsPage.tsx
View file

@ -17,7 +17,7 @@ import { sectionNames } from "@saleor/intl";
import { findValueInEnum, maybe } from "@saleor/misc";
import { CountryCode } from "@saleor/types/globalTypes";
import createSingleAutocompleteSelectHandler from "@saleor/utils/handlers/singleAutocompleteSelectChangeHandler";
import { mapCountriesToChoices } from "@saleor/utils/maps";
import { mapCountriesToChoices, mapEdgesToItems } from "@saleor/utils/maps";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -116,7 +116,7 @@ const WarehouseDetailsPage: React.FC<WarehouseDetailsPageProps> = ({
</div>
<div>
<WarehouseZones
zones={warehouse?.shippingZones?.edges.map(edge => edge.node)}
zones={mapEdgesToItems(warehouse?.shippingZones)}
onShippingZoneClick={onShippingZoneClick}
/>
</div>

3
src/warehouses/views/WarehouseList/WarehouseList.tsx
View file

@ -17,6 +17,7 @@ import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getSortParams } from "@saleor/utils/sort";
import WarehouseDeleteDialog from "@saleor/warehouses/components/WarehouseDeleteDialog";
import WarehouseListPage from "@saleor/warehouses/components/WarehouseListPage";
@ -150,7 +151,7 @@ const WarehouseList: React.FC<WarehouseListProps> = ({ params }) => {
onTabSave={() => openModal("save-search")}
limits={limitOpts.data?.shop.limits}
tabs={tabs.map(tab => tab.name)}
warehouses={maybe(() => data.warehouses.edges.map(edge => edge.node))}
warehouses={mapEdgesToItems(data?.warehouses)}
settings={settings}
disabled={loading}
pageInfo={pageInfo}