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

Add inventory status to variant list

Browse source
This commit is contained in:
dominik-zeglen 2020-02-06 17:51:01 +01:00
parent 8f02117865
commit 92d16effb3
15 changed files with 145 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
src/products/components/ProductVariants/ProductVariants.tsx
View file

@ -15,7 +15,6 @@ import Checkbox from "@saleor/components/Checkbox";
import Money from "@saleor/components/Money";
import ResponsiveTable from "@saleor/components/ResponsiveTable";
import Skeleton from "@saleor/components/Skeleton";
import StatusLabel from "@saleor/components/StatusLabel";
import TableHead from "@saleor/components/TableHead";
import { maybe, renderCollection } from "../../../misc";
import { ListActions } from "../../../types";
@ -25,17 +24,20 @@ import { ProductVariant_costPrice } from "../../types/ProductVariant";
const useStyles = makeStyles(
theme => ({
[theme.breakpoints.up("lg")]: {
colInventory: {
width: 300
},
colName: {},
colPrice: {
width: 200
width: 150
},
colSku: {
width: 250
},
colStatus: {
width: 200
}
},
colInventory: {
textAlign: "right"
},
colName: {},
colPrice: {
textAlign: "right"
@ -148,12 +150,6 @@ export const ProductVariants: React.FC<ProductVariantsProps> = props => {
description="product variant name"
/>
</TableCell>
<TableCell className={classes.colStatus}>
<FormattedMessage
defaultMessage="Status"
description="product variant status"
/>
</TableCell>
<TableCell className={classes.colSku}>
<FormattedMessage defaultMessage="SKU" />
</TableCell>
@ -165,10 +161,20 @@ export const ProductVariants: React.FC<ProductVariantsProps> = props => {
/>
</TableCell>
</Hidden>
<TableCell className={classes.colInventory}>
<FormattedMessage
defaultMessage="Inventory"
description="product variant inventory status"
/>
</TableCell>
</TableHead>
<TableBody>
{renderCollection(variants, variant => {
const isSelected = variant ? isChecked(variant.id) : false;
const numAvailable =
variant && variant.stock
? variant.stock.reduce((acc, s) => acc + s.quantity, 0)
: null;
return (
<TableRow
@ -189,32 +195,6 @@ export const ProductVariants: React.FC<ProductVariantsProps> = props => {
<TableCell className={classes.colName} data-tc="name">
{variant ? variant.name || variant.sku : <Skeleton />}
</TableCell>
<TableCell
className={classes.colStatus}
data-tc="isAvailable"
data-tc-is-available={maybe(
() => variant.stockQuantity > 0
)}
>
{variant ? (
<StatusLabel
status={variant.stockQuantity > 0 ? "success" : "error"}
label={
variant.stockQuantity > 0
? intl.formatMessage({
defaultMessage: "Available",
description: "product variant status"
})
: intl.formatMessage({
defaultMessage: "Unavailable",
description: "product variant status"
})
}
/>
) : (
<Skeleton />
)}
</TableCell>
<TableCell className={classes.colSku} data-tc="sku">
{variant ? variant.sku : <Skeleton />}
</TableCell>
@ -233,6 +213,28 @@ export const ProductVariants: React.FC<ProductVariantsProps> = props => {
)}
</TableCell>
</Hidden>
<TableCell
className={classes.colInventory}
data-tc="inventory"
>
{numAvailable === null ? (
<Skeleton />
) : numAvailable === 0 ? (
<FormattedMessage
defaultMessage="Unavailable in all locations"
description="product variant inventory"
/>
) : (
<FormattedMessage
defaultMessage="{numAvailable} available at {numLocations} {numLocations,plural,one{location} other{locations}}"
description="product variant inventory"
values={{
numAvailable,
numLocations: variant.stock.length
}}
/>
)}
</TableCell>
</TableRow>
);
})}

8
src/products/queries.ts
View file

@ -146,6 +146,10 @@ export const productFragmentDetails = gql`
quantity
quantityAllocated
stockQuantity
stock {
id
quantity
}
}
productType {
id
@ -212,6 +216,10 @@ export const fragmentVariant = gql`
sku
quantity
quantityAllocated
stock {
id
quantity
}
}
`;

7
src/products/types/Product.ts
View file

@ -127,6 +127,12 @@ export interface Product_variants_priceOverride {
currency: string;
}
export interface Product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface Product_variants {
__typename: "ProductVariant";
id: string;
@ -137,6 +143,7 @@ export interface Product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (Product_variants_stock | null)[] | null;
}
export interface Product_productType {

7
src/products/types/ProductCreate.ts
View file

@ -133,6 +133,12 @@ export interface ProductCreate_productCreate_product_variants_priceOverride {
currency: string;
}
export interface ProductCreate_productCreate_product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductCreate_productCreate_product_variants {
__typename: "ProductVariant";
id: string;
@ -143,6 +149,7 @@ export interface ProductCreate_productCreate_product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (ProductCreate_productCreate_product_variants_stock | null)[] | null;
}
export interface ProductCreate_productCreate_product_productType {

7
src/products/types/ProductDetails.ts
View file

@ -127,6 +127,12 @@ export interface ProductDetails_product_variants_priceOverride {
currency: string;
}
export interface ProductDetails_product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductDetails_product_variants {
__typename: "ProductVariant";
id: string;
@ -137,6 +143,7 @@ export interface ProductDetails_product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (ProductDetails_product_variants_stock | null)[] | null;
}
export interface ProductDetails_product_productType_variantAttributes_values {

7
src/products/types/ProductImageCreate.ts
View file

@ -133,6 +133,12 @@ export interface ProductImageCreate_productImageCreate_product_variants_priceOve
currency: string;
}
export interface ProductImageCreate_productImageCreate_product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductImageCreate_productImageCreate_product_variants {
__typename: "ProductVariant";
id: string;
@ -143,6 +149,7 @@ export interface ProductImageCreate_productImageCreate_product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (ProductImageCreate_productImageCreate_product_variants_stock | null)[] | null;
}
export interface ProductImageCreate_productImageCreate_product_productType {

7
src/products/types/ProductImageUpdate.ts
View file

@ -133,6 +133,12 @@ export interface ProductImageUpdate_productImageUpdate_product_variants_priceOve
currency: string;
}
export interface ProductImageUpdate_productImageUpdate_product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductImageUpdate_productImageUpdate_product_variants {
__typename: "ProductVariant";
id: string;
@ -143,6 +149,7 @@ export interface ProductImageUpdate_productImageUpdate_product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (ProductImageUpdate_productImageUpdate_product_variants_stock | null)[] | null;
}
export interface ProductImageUpdate_productImageUpdate_product_productType {

7
src/products/types/ProductUpdate.ts
View file

@ -133,6 +133,12 @@ export interface ProductUpdate_productUpdate_product_variants_priceOverride {
currency: string;
}
export interface ProductUpdate_productUpdate_product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductUpdate_productUpdate_product_variants {
__typename: "ProductVariant";
id: string;
@ -143,6 +149,7 @@ export interface ProductUpdate_productUpdate_product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (ProductUpdate_productUpdate_product_variants_stock | null)[] | null;
}
export interface ProductUpdate_productUpdate_product_productType {

7
src/products/types/ProductVariant.ts
View file

@ -89,6 +89,12 @@ export interface ProductVariant_product {
variants: (ProductVariant_product_variants | null)[] | null;
}
export interface ProductVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductVariant {
__typename: "ProductVariant";
id: string;
@ -101,4 +107,5 @@ export interface ProductVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (ProductVariant_stock | null)[] | null;
}

7
src/products/types/ProductVariantDetails.ts
View file

@ -89,6 +89,12 @@ export interface ProductVariantDetails_productVariant_product {
variants: (ProductVariantDetails_productVariant_product_variants | null)[] | null;
}
export interface ProductVariantDetails_productVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface ProductVariantDetails_productVariant {
__typename: "ProductVariant";
id: string;
@ -101,6 +107,7 @@ export interface ProductVariantDetails_productVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (ProductVariantDetails_productVariant_stock | null)[] | null;
}
export interface ProductVariantDetails {

14
src/products/types/SimpleProductUpdate.ts
View file

@ -133,6 +133,12 @@ export interface SimpleProductUpdate_productUpdate_product_variants_priceOverrid
currency: string;
}
export interface SimpleProductUpdate_productUpdate_product_variants_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface SimpleProductUpdate_productUpdate_product_variants {
__typename: "ProductVariant";
id: string;
@ -143,6 +149,7 @@ export interface SimpleProductUpdate_productUpdate_product_variants {
quantity: number;
quantityAllocated: number | null;
stockQuantity: number;
stock: (SimpleProductUpdate_productUpdate_product_variants_stock | null)[] | null;
}
export interface SimpleProductUpdate_productUpdate_product_productType {
@ -271,6 +278,12 @@ export interface SimpleProductUpdate_productVariantUpdate_productVariant_product
variants: (SimpleProductUpdate_productVariantUpdate_productVariant_product_variants | null)[] | null;
}
export interface SimpleProductUpdate_productVariantUpdate_productVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface SimpleProductUpdate_productVariantUpdate_productVariant {
__typename: "ProductVariant";
id: string;
@ -283,6 +296,7 @@ export interface SimpleProductUpdate_productVariantUpdate_productVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (SimpleProductUpdate_productVariantUpdate_productVariant_stock | null)[] | null;
}
export interface SimpleProductUpdate_productVariantUpdate {

7
src/products/types/VariantCreate.ts
View file

@ -97,6 +97,12 @@ export interface VariantCreate_productVariantCreate_productVariant_product {
variants: (VariantCreate_productVariantCreate_productVariant_product_variants | null)[] | null;
}
export interface VariantCreate_productVariantCreate_productVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface VariantCreate_productVariantCreate_productVariant {
__typename: "ProductVariant";
id: string;
@ -109,6 +115,7 @@ export interface VariantCreate_productVariantCreate_productVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (VariantCreate_productVariantCreate_productVariant_stock | null)[] | null;
}
export interface VariantCreate_productVariantCreate {

7
src/products/types/VariantImageAssign.ts
View file

@ -97,6 +97,12 @@ export interface VariantImageAssign_variantImageAssign_productVariant_product {
variants: (VariantImageAssign_variantImageAssign_productVariant_product_variants | null)[] | null;
}
export interface VariantImageAssign_variantImageAssign_productVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface VariantImageAssign_variantImageAssign_productVariant {
__typename: "ProductVariant";
id: string;
@ -109,6 +115,7 @@ export interface VariantImageAssign_variantImageAssign_productVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (VariantImageAssign_variantImageAssign_productVariant_stock | null)[] | null;
}
export interface VariantImageAssign_variantImageAssign {

7
src/products/types/VariantImageUnassign.ts
View file

@ -97,6 +97,12 @@ export interface VariantImageUnassign_variantImageUnassign_productVariant_produc
variants: (VariantImageUnassign_variantImageUnassign_productVariant_product_variants | null)[] | null;
}
export interface VariantImageUnassign_variantImageUnassign_productVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface VariantImageUnassign_variantImageUnassign_productVariant {
__typename: "ProductVariant";
id: string;
@ -109,6 +115,7 @@ export interface VariantImageUnassign_variantImageUnassign_productVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (VariantImageUnassign_variantImageUnassign_productVariant_stock | null)[] | null;
}
export interface VariantImageUnassign_variantImageUnassign {

7
src/products/types/VariantUpdate.ts
View file

@ -97,6 +97,12 @@ export interface VariantUpdate_productVariantUpdate_productVariant_product {
variants: (VariantUpdate_productVariantUpdate_productVariant_product_variants | null)[] | null;
}
export interface VariantUpdate_productVariantUpdate_productVariant_stock {
__typename: "Stock";
id: string;
quantity: number;
}
export interface VariantUpdate_productVariantUpdate_productVariant {
__typename: "ProductVariant";
id: string;
@ -109,6 +115,7 @@ export interface VariantUpdate_productVariantUpdate_productVariant {
sku: string;
quantity: number;
quantityAllocated: number | null;
stock: (VariantUpdate_productVariantUpdate_productVariant_stock | null)[] | null;
}
export interface VariantUpdate_productVariantUpdate {