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

Change more usages to map edges to items

Browse source
This commit is contained in:
Magdalena Markusik 2021-05-12 11:11:17 +02:00
parent b731e7cf89
commit def3a381ba
17 changed files with 166 additions and 215 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/hooks/makeTopLevelSearch/utils.ts
View file

@ -1,4 +1,5 @@
import { FetchMoreProps } from "@saleor/types";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { ResultSearchData } from "./makeTopLevelSearch";
import { CommonSearchOpts } from "./types";
@ -14,4 +15,4 @@ export const getSearchFetchMoreProps = (
});
export const getParsedSearchData = ({ data }: ResultSearchData) =>
data?.search?.edges?.map(({ node }) => node) || [];
mapEdgesToItems(data?.search);

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

@ -11,6 +11,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import { buttonMessages, commonMessages } from "@saleor/intl";
import { maybe } from "@saleor/misc";
import { getById } from "@saleor/orders/components/OrderReturnPage/utils";
import { ListViews } from "@saleor/types";
import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
@ -209,13 +210,10 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
defaultMessage="Are you sure you want to delete {menuName}?"
id="menuListDeleteMenuContent"
values={{
menuName: maybe(
() =>
data.menus.edges.find(
edge => edge.node.id === params.id
).node.name,
"..."
)
menuName:
mapEdgesToItems(data?.menus).find(
getById(params.id)
)?.name || "..."
}}
/>
</DialogContentText>

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

@ -172,7 +172,7 @@ export const OrderDraftDetails: React.FC<OrderDraftDetailsProps> = ({
order: id
})
}
users={users?.data?.search?.edges?.map(edge => edge.node) || []}
users={mapEdgesToItems(users?.data?.search)}
hasMore={users?.data?.search?.pageInfo?.hasNextPage || false}
onFetchMore={loadMoreCustomers}
fetchUsers={searchUsers}

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

@ -264,8 +264,8 @@ export const PageTypeDetails: React.FC<PageTypeDetailsProps> = ({
deleteButtonState={deletePageTypeOpts.status}
/>
<AssignAttributeDialog
attributes={result.data?.pageType.availableAttributes.edges.map(
edge => edge.node
attributes={mapEdgesToItems(
result?.data?.pageType?.availableAttributes
)}
confirmButtonState={assignAttributeOpts.status}
errors={

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

@ -19,6 +19,7 @@ import { usePageTypeBulkDeleteMutation } from "@saleor/pageTypes/mutations";
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";
@ -165,7 +166,7 @@ export const PageTypeList: React.FC<PageTypeListProps> = ({ params }) => {
params
});
const pageTypesData = data?.pageTypes?.edges.map(edge => edge.node) || [];
const pageTypesData = mapEdgesToItems(data?.pageTypes);
return (
<>
@ -179,7 +180,7 @@ export const PageTypeList: React.FC<PageTypeListProps> = ({ params }) => {
onTabSave={() => openModal("save-search")}
tabs={tabs.map(tab => tab.name)}
disabled={loading}
pageTypes={data?.pageTypes?.edges?.map(edge => edge.node)}
pageTypes={pageTypesData}
pageInfo={pageInfo}
onAdd={() => navigate(pageTypeAddUrl)}
onBack={() => navigate(configurationMenuUrl)}

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

@ -159,8 +159,7 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
params
});
const productTypesData =
data?.productTypes?.edges.map(edge => edge.node) || [];
const productTypesData = mapEdgesToItems(data?.productTypes);
return (
<TypedProductTypeBulkDeleteMutation

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

@ -346,10 +346,8 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
<>
{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(

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

@ -118,9 +118,7 @@ export const ProductCreateView: React.FC<ProductCreateProps> = ({ params }) => {
skip: !selectedProductTypeId
});
const productTypes = searchProductTypesOpts?.data?.search?.edges?.map(
edge => edge.node
);
const productTypes = mapEdgesToItems(searchProductTypesOpts?.data?.search);
const { data: channelsData } = useChannelsList({});
const allChannels: ChannelData[] = createSortedChannelsData(
@ -281,12 +279,8 @@ export const ProductCreateView: React.FC<ProductCreateProps> = ({ params }) => {
<ProductCreatePage
allChannelsCount={allChannels?.length}
currentChannels={currentChannels}
categories={(searchCategoryOpts?.data?.search?.edges || []).map(
edge => edge.node
)}
collections={(searchCollectionOpts?.data?.search?.edges || []).map(
edge => edge.node
)}
categories={mapEdgesToItems(searchCategoryOpts?.data?.search)}
collections={mapEdgesToItems(searchCollectionOpts?.data?.search)}
loading={loading}
channelsErrors={
updateVariantChannelsOpts.data?.productVariantChannelListingUpdate

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

@ -317,24 +317,17 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
const filterOpts = getFilterOpts(
params,
initialFilterAttributes?.attributes?.edges?.map(edge => edge.node) || [],
mapEdgesToItems(initialFilterAttributes?.attributes),
{
initial:
initialFilterCategories?.categories?.edges?.map(edge => edge.node) ||
[],
initial: mapEdgesToItems(initialFilterCategories?.categories),
search: searchCategories
},
{
initial:
initialFilterCollections?.collections?.edges?.map(edge => edge.node) ||
[],
initial: mapEdgesToItems(initialFilterCollections?.collections),
search: searchCollections
},
{
initial:
initialFilterProductTypes?.productTypes?.edges?.map(
edge => edge.node
) || [],
initial: mapEdgesToItems(initialFilterProductTypes?.productTypes),
search: searchProductTypes
}
);
@ -462,9 +455,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
</DialogContentText>
</ActionDialog>
<ProductExportDialog
attributes={(searchAttributes.result.data?.search.edges || []).map(
edge => edge.node
)}
attributes={mapEdgesToItems(searchAttributes?.result?.data?.search)}
hasMore={searchAttributes.result.data?.search.pageInfo.hasNextPage}
loading={
searchAttributes.result.loading ||

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

@ -426,12 +426,10 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
createProductMediaOpts.data?.productMediaCreate.errors
);
const categories = (searchCategoriesOpts?.data?.search?.edges || []).map(
edge => edge.node
);
const collections = (searchCollectionsOpts?.data?.search?.edges || []).map(
edge => edge.node
);
const categories = mapEdgesToItems(searchCategoriesOpts?.data?.search);
const collections = mapEdgesToItems(searchCollectionsOpts?.data?.search);
const errors = [
...(updateProductOpts.data?.productUpdate.errors || []),
...(updateSimpleProductOpts.data?.productUpdate.errors || []),

7
src/shipping/views/PriceRatesUpdate/PriceRatesUpdate.tsx
View file

@ -59,6 +59,7 @@ import {
} from "@saleor/types/globalTypes";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -341,9 +342,9 @@ export const PriceRatesUpdate: React.FC<PriceRatesUpdateProps> = ({
loading={productsSearchOpts.loading}
open={params.action === "assign-product"}
hasMore={productsSearchOpts.data?.search?.pageInfo.hasNextPage}
products={productsSearchOpts.data?.search?.edges
.map(edge => edge.node)
.filter(suggestedProduct => suggestedProduct.id)}
products={mapEdgesToItems(productsSearchOpts?.data?.search).filter(
suggestedProduct => suggestedProduct.id
)}
onClose={closeModal}
onFetch={productsSearch}
onFetchMore={loadMore}

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

@ -14,6 +14,7 @@ import useShop from "@saleor/hooks/useShop";
import useUser from "@saleor/hooks/useUser";
import { commonMessages } from "@saleor/intl";
import { getStringOrPlaceholder, maybe } from "@saleor/misc";
import { getById } from "@saleor/orders/components/OrderReturnPage/utils";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { mapEdgesToItems } from "@saleor/utils/maps";
@ -184,13 +185,8 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
values={{
shippingZoneName: (
<strong>
{maybe(
() =>
data.shippingZones.edges.find(
edge => edge.node.id === params.id
).node.name,
"..."
)}
{mapEdgesToItems(data?.shippingZones).find(getById(params.id))
?.name || "..."}
</strong>
)
}}

7
src/shipping/views/WeightRatesUpdate/WeightRatesUpdate.tsx
View file

@ -59,6 +59,7 @@ import {
} from "@saleor/types/globalTypes";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler";
import { mapEdgesToItems } from "@saleor/utils/maps";
import {
useMetadataUpdate,
usePrivateMetadataUpdate
@ -342,9 +343,9 @@ export const WeightRatesUpdate: React.FC<WeightRatesUpdateProps> = ({
loading={productsSearchOpts.loading}
open={params.action === "assign-product"}
hasMore={productsSearchOpts.data?.search?.pageInfo.hasNextPage}
products={productsSearchOpts.data?.search?.edges
.map(edge => edge.node)
.filter(suggestedProduct => suggestedProduct.id)}
products={mapEdgesToItems(productsSearchOpts?.data?.search).filter(
suggestedProduct => suggestedProduct.id
)}
onClose={closeModal}
onFetch={productsSearch}
onFetchMore={loadMore}

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

@ -1,7 +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 { mapEdgesToItems, mapNodeToChoice } from "@saleor/utils/maps";
import { storiesOf } from "@storybook/react";
import React from "react";
@ -15,12 +15,7 @@ import Decorator from "../../Decorator";
const category = categoryFixture(placeholderImage);
const channelChoices = category.products.edges[0].node.channelListings.map(
listing => ({
label: listing.channel.name,
value: listing.channel.id
})
);
const channelChoices = mapNodeToChoice(mapEdgesToItems(category?.products));
const updateProps: Omit<CategoryUpdatePageProps, "classes"> = {
category,

254
src/translations/views/TranslationsEntities.tsx
View file

@ -3,6 +3,7 @@ import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import useShop from "@saleor/hooks/useShop";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { stringify as stringifyQs } from "qs";
import React from "react";
@ -142,24 +143,22 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "CategoryTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.description,
node.translation?.name,
node.translation?.seoDescription,
node.translation?.seoTitle
]),
max: 4
},
id: node?.category?.id,
name: node?.category?.name
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "CategoryTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.description,
node.translation?.name,
node.translation?.seoDescription,
node.translation?.seoTitle
]),
max: 4
},
id: node?.category?.id,
name: node?.category?.name
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(
@ -187,24 +186,22 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "ProductTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.description,
node.translation?.name,
node.translation?.seoDescription,
node.translation?.seoTitle
]),
max: 4
},
id: node?.product?.id,
name: node?.product?.name
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "ProductTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.description,
node.translation?.name,
node.translation?.seoDescription,
node.translation?.seoTitle
]),
max: 4
},
id: node?.product?.id,
name: node?.product?.name
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(
@ -233,24 +230,22 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "CollectionTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.description,
node.translation?.name,
node.translation?.seoDescription,
node.translation?.seoTitle
]),
max: 4
},
id: node.collection.id,
name: node.collection.name
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "CollectionTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.description,
node.translation?.name,
node.translation?.seoDescription,
node.translation?.seoTitle
]),
max: 4
},
id: node.collection.id,
name: node.collection.name
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(
@ -279,19 +274,17 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "SaleTranslatableContent" && {
completion: {
current: sumCompleted([node.translation?.name]),
max: 1
},
id: node.sale?.id,
name: node.sale?.name
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "SaleTranslatableContent" && {
completion: {
current: sumCompleted([node.translation?.name]),
max: 1
},
id: node.sale?.id,
name: node.sale?.name
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(language, TranslatableEntities.sales, id)
@ -320,19 +313,17 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "VoucherTranslatableContent" && {
completion: {
current: sumCompleted([node.translation?.name]),
max: 1
},
id: node.voucher?.id,
name: node.voucher?.name || "-"
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "VoucherTranslatableContent" && {
completion: {
current: sumCompleted([node.translation?.name]),
max: 1
},
id: node.voucher?.id,
name: node.voucher?.name || "-"
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(
@ -361,24 +352,22 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "PageTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.content,
node.translation?.seoDescription,
node.translation?.seoTitle,
node.translation?.title
]),
max: 4
},
id: node?.page.id,
name: node?.page.title
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "PageTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.content,
node.translation?.seoDescription,
node.translation?.seoTitle,
node.translation?.title
]),
max: 4
},
id: node?.page.id,
name: node?.page.title
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(language, TranslatableEntities.pages, id)
@ -402,26 +391,24 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename === "AttributeTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.name,
...(node.attribute?.values.map(
attr => attr.translation?.name
) || [])
]),
max: node.attribute
? node.attribute.values.length + 1
: 0
},
id: node?.attribute.id,
name: node?.attribute.name
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "AttributeTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.name,
...(node.attribute?.values.map(
attr => attr.translation?.name
) || [])
]),
max: node.attribute
? node.attribute.values.length + 1
: 0
},
id: node?.attribute.id,
name: node?.attribute.name
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(
@ -449,23 +436,20 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
return (
<TranslationsEntitiesList
disabled={loading}
entities={data?.translations?.edges
.map(edge => edge.node)
.map(
node =>
node.__typename ===
"ShippingMethodTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.name,
node.translation?.description
]),
max: 2
},
id: node?.shippingMethod.id,
name: node?.name
}
)}
entities={mapEdgesToItems(data?.translations).map(
node =>
node.__typename === "ShippingMethodTranslatableContent" && {
completion: {
current: sumCompleted([
node.translation?.name,
node.translation?.description
]),
max: 2
},
id: node?.shippingMethod.id,
name: node?.name
}
)}
onRowClick={id =>
navigate(
languageEntityUrl(

11
src/warehouses/components/WarehouseList/WarehouseList.tsx
View file

@ -14,6 +14,7 @@ import { WarehouseWithShippingFragment } from "@saleor/fragments/types/Warehouse
import { maybe, renderCollection, stopPropagation } from "@saleor/misc";
import { makeStyles } from "@saleor/theme";
import { ListProps, SortPage } from "@saleor/types";
import { mapEdgesToItems } from "@saleor/utils/maps";
import { getArrowDirection } from "@saleor/utils/sort";
import { WarehouseListUrlSortField } from "@saleor/warehouses/urls";
import React from "react";
@ -137,13 +138,9 @@ const WarehouseList: React.FC<WarehouseListProps> = props => {
{maybe<React.ReactNode>(() => warehouse.name, <Skeleton />)}
</TableCell>
<TableCell className={classes.colZones} data-test="zones">
{maybe<React.ReactNode>(
() =>
warehouse.shippingZones.edges
.map(edge => edge.node.name)
.join(", "),
<Skeleton />
)}
{mapEdgesToItems(warehouse?.shippingZones)
.map(({ name }) => name)
.join(", ") || <Skeleton />}
</TableCell>
<TableCell className={classes.colActions}>
<div className={classes.actions}>

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

@ -13,6 +13,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import { commonMessages, sectionNames } from "@saleor/intl";
import { getMutationStatus, maybe } from "@saleor/misc";
import { getById } from "@saleor/orders/components/OrderReturnPage/utils";
import { ListViews } from "@saleor/types";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
@ -166,11 +167,7 @@ const WarehouseList: React.FC<WarehouseListProps> = ({ params }) => {
/>
<WarehouseDeleteDialog
confirmButtonState={deleteTransitionState}
name={maybe(
() =>
data.warehouses.edges.find(edge => edge.node.id === params.id).node
.name
)}
name={mapEdgesToItems(data?.warehouses).find(getById(params.id))?.name}
open={params.action === "delete"}
onClose={closeModal}
onConfirm={() =>