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

Update category product list

Browse source
This commit is contained in:
Dawid Tarasiuk 2020-06-16 13:13:10 +02:00
parent 2fdda2db55
commit 2d9385554b
5 changed files with 254 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
src/categories/components/CategoryProductList/CategoryProductList.tsx
View file

@ -14,6 +14,7 @@ import TableCellAvatar, {
import TableHead from "@saleor/components/TableHead";
import TablePagination from "@saleor/components/TablePagination";
import { maybe, renderCollection } from "@saleor/misc";
import { getProductPriceRange } from "@saleor/products/components/ProductListPage/utils";
import { ListActions, ListProps } from "@saleor/types";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
@ -207,13 +208,41 @@ export const CategoryProductList: React.FC<CategoryProductListProps> = props =>
)}
</TableCell>
<TableCell className={classes.colPrice}>
{maybe(() => product.basePrice) &&
maybe(() => product.basePrice.amount) !== undefined &&
maybe(() => product.basePrice.currency) !== undefined ? (
<Money money={product.basePrice} />
) : (
<Skeleton />
)}
{maybe<React.ReactNode>(() => {
const { max, min } = getProductPriceRange(
product.variants
);
const currency = product.variants[0].price.currency;
if (max === min) {
return (
<Money
money={{
amount: min,
currency
}}
/>
);
} else {
return (
<>
<Money
money={{
amount: min,
currency
}}
/>
{" - "}
<Money
money={{
amount: max,
currency
}}
/>
</>
);
}
}, <Skeleton />)}
</TableCell>
</TableRow>
);

250
src/categories/fixtures.ts
View file

@ -117,11 +117,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjA=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 83.3,
currency: "USD"
},
id: "UHJvZHVjdDoyMQ==",
isAvailable: true,
name: "Gardner-Schultz",
@ -130,7 +125,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -138,11 +151,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjE=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 68.27,
currency: "USD"
},
id: "UHJvZHVjdDoyMg==",
isAvailable: true,
name: "James, Martinez and Murray",
@ -151,7 +159,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -159,11 +185,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjI=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 21.43,
currency: "USD"
},
id: "UHJvZHVjdDoyMw==",
isAvailable: true,
name: "Curtis, Joyce and Turner",
@ -172,7 +193,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -180,11 +219,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjM=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 62.76,
currency: "USD"
},
id: "UHJvZHVjdDoyNA==",
isAvailable: true,
name: "Davis, Brown and Ray",
@ -193,7 +227,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -201,11 +253,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjQ=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 7.13,
currency: "USD"
},
id: "UHJvZHVjdDoyNQ==",
isAvailable: true,
name: "Gallegos Ltd",
@ -214,7 +261,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -222,11 +287,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjU=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 48.82,
currency: "USD"
},
id: "UHJvZHVjdDoyNg==",
isAvailable: true,
name: "Franklin Inc",
@ -235,7 +295,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -243,11 +321,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjY=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 27.34,
currency: "USD"
},
id: "UHJvZHVjdDoyNw==",
isAvailable: true,
name: "Williams-Taylor",
@ -256,7 +329,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -264,11 +355,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjc=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 75.42,
currency: "USD"
},
id: "UHJvZHVjdDoyOA==",
isAvailable: true,
name: "Riddle, Evans and Hicks",
@ -277,7 +363,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -285,11 +389,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjg=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 86.62,
currency: "USD"
},
id: "UHJvZHVjdDoyOQ==",
isAvailable: true,
name: "Hebert-Sherman",
@ -298,7 +397,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
},
{
@ -306,11 +423,6 @@ export const category: (
cursor: "YXJyYXljb25uZWN0aW9uOjk=",
node: {
__typename: "Product",
basePrice: {
__typename: "Money",
amount: 48.66,
currency: "USD"
},
id: "UHJvZHVjdDozMA==",
isAvailable: true,
name: "Carter and Sons",
@ -319,7 +431,25 @@ export const category: (
id: "UHJvZHVjdFR5cGU6Mw==",
name: "Coffee"
},
thumbnail: { __typename: "Image", url: placeholderImage }
thumbnail: { __typename: "Image", url: placeholderImage },
variants: [
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 5,
currency: "USD"
}
},
{
__typename: "ProductVariant" as "ProductVariant",
price: {
__typename: "Money" as "Money",
amount: 10,
currency: "USD"
}
}
]
}
}
],

6
src/categories/queries.ts
View file

@ -112,6 +112,12 @@ export const categoryDetails = gql`
id
name
}
variants {
price {
amount
currency
}
}
}
}
}

12
src/categories/types/CategoryDetails.ts
View file

@ -73,6 +73,17 @@ export interface CategoryDetails_category_products_edges_node_productType {
name: string;
}
export interface CategoryDetails_category_products_edges_node_variants_price {
__typename: "Money";
amount: number;
currency: string;
}
export interface CategoryDetails_category_products_edges_node_variants {
__typename: "ProductVariant";
price: CategoryDetails_category_products_edges_node_variants_price | null;
}
export interface CategoryDetails_category_products_edges_node {
__typename: "Product";
id: string;
@ -80,6 +91,7 @@ export interface CategoryDetails_category_products_edges_node {
isAvailable: boolean | null;
thumbnail: CategoryDetails_category_products_edges_node_thumbnail | null;
productType: CategoryDetails_category_products_edges_node_productType;
variants: (CategoryDetails_category_products_edges_node_variants | null)[] | null;
}
export interface CategoryDetails_category_products_edges {

20
src/storybook/__snapshots__/Stories.test.ts.snap
View file

@ -25221,7 +25221,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$83.30
$5.00 - $10.00
</td>
</tr>
<tr
@ -25280,7 +25280,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$68.27
$5.00 - $10.00
</td>
</tr>
<tr
@ -25339,7 +25339,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$21.43
$5.00 - $10.00
</td>
</tr>
<tr
@ -25398,7 +25398,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$62.76
$5.00 - $10.00
</td>
</tr>
<tr
@ -25457,7 +25457,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$7.13
$5.00 - $10.00
</td>
</tr>
<tr
@ -25516,7 +25516,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$48.82
$5.00 - $10.00
</td>
</tr>
<tr
@ -25575,7 +25575,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$27.34
$5.00 - $10.00
</td>
</tr>
<tr
@ -25634,7 +25634,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$75.42
$5.00 - $10.00
</td>
</tr>
<tr
@ -25693,7 +25693,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$86.62
$5.00 - $10.00
</td>
</tr>
<tr
@ -25752,7 +25752,7 @@ Ctrl + K"
<td
class="MuiTableCell-root-id MuiTableCell-body-id CategoryProductList-colPrice-id"
>
$48.66
$5.00 - $10.00
</td>
</tr>
</tbody>