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

Add tax section to product view

Browse source
This commit is contained in:
dominik-zeglen 2020-09-23 10:29:13 +02:00
parent 2805b752f0
commit 2b92211b99
24 changed files with 424 additions and 204 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/SingleAutocompleteSelectField/SingleAutocompleteSelectField.tsx
View file

@ -3,6 +3,7 @@ import { makeStyles } from "@material-ui/core/styles";
import TextField from "@material-ui/core/TextField";
import useStateFromProps from "@saleor/hooks/useStateFromProps";
import { FetchMoreProps } from "@saleor/types";
import classNames from "classnames";
import Downshift from "downshift";
import { filter } from "fuzzaldrin";
import React from "react";
@ -27,6 +28,7 @@ const useStyles = makeStyles(
export interface SingleAutocompleteSelectFieldProps
extends Partial<FetchMoreProps> {
add?: SingleAutocompleteActionType;
className?: string;
error?: boolean;
name: string;
displayValue: string;
@ -51,6 +53,7 @@ const SingleAutocompleteSelectFieldComponent: React.FC<SingleAutocompleteSelectF
const {
add,
allowCustomValues,
className,
choices,
disabled,
displayValue,
@ -122,7 +125,10 @@ const SingleAutocompleteSelectFieldComponent: React.FC<SingleAutocompleteSelectF
);
return (
<div className={classes.container} {...rest}>
<div
className={classNames(classes.container, className)}
{...rest}
>
<TextField
InputProps={{
...InputProps,

8
src/fragments/products.ts
View file

@ -1,6 +1,7 @@
import gql from "graphql-tag";
import { metadataFragment } from "./metadata";
import { taxTypeFragment } from "./taxes";
import { weightFragment } from "./weight";
export const stockFragment = gql`
@ -107,6 +108,7 @@ export const productFragmentDetails = gql`
${stockFragment}
${weightFragment}
${metadataFragment}
${taxTypeFragment}
fragment Product on Product {
...ProductVariantAttributesFragment
...MetadataFragment
@ -173,10 +175,16 @@ export const productFragmentDetails = gql`
id
name
hasVariants
taxType {
...TaxTypeFragment
}
}
weight {
...WeightFragment
}
taxType {
...TaxTypeFragment
}
availableForPurchase
visibleInListings
}

6
src/fragments/taxes.ts
View file

@ -26,3 +26,9 @@ export const shopTaxesFragment = gql`
displayGrossPrices
}
`;
export const taxTypeFragment = gql`
fragment TaxTypeFragment on TaxType {
description
taxCode
}
`;

14
src/fragments/types/Product.ts
View file

@ -52,12 +52,19 @@ export interface Product_productType_variantAttributes {
values: (Product_productType_variantAttributes_values | null)[] | null;
}
export interface Product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface Product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (Product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: Product_productType_taxType | null;
}
export interface Product_pricing_priceRangeUndiscounted_start_gross {
@ -186,6 +193,12 @@ export interface Product_weight {
value: number;
}
export interface Product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface Product {
__typename: "Product";
id: string;
@ -210,6 +223,7 @@ export interface Product {
images: (Product_images | null)[] | null;
variants: (Product_variants | null)[] | null;
weight: Product_weight | null;
taxType: Product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}

13
src/fragments/types/TaxTypeFragment.ts Normal file
View file

@ -0,0 +1,13 @@
/* tslint:disable */
/* eslint-disable */
// This file was automatically generated and should not be edited.
// ====================================================
// GraphQL fragment: TaxTypeFragment
// ====================================================
export interface TaxTypeFragment {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}

12
src/products/components/ProductPricing/ProductPricing.tsx
View file

@ -2,7 +2,6 @@ import Card from "@material-ui/core/Card";
import CardContent from "@material-ui/core/CardContent";
import { makeStyles } from "@material-ui/core/styles";
import CardTitle from "@saleor/components/CardTitle";
import ControlledCheckbox from "@saleor/components/ControlledCheckbox";
import PriceField from "@saleor/components/PriceField";
import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";
@ -23,7 +22,6 @@ const useStyles = makeStyles(
interface ProductPricingProps {
currency?: string;
data: {
chargeTaxes: boolean;
basePrice: number;
};
disabled: boolean;
@ -46,17 +44,7 @@ const ProductPricing: React.FC<ProductPricingProps> = props => {
defaultMessage: "Pricing",
description: "product pricing"
})}
>
<ControlledCheckbox
name="chargeTaxes"
label={intl.formatMessage({
defaultMessage: "Charge taxes for this item"
})}
checked={data.chargeTaxes}
onChange={onChange}
disabled={disabled}
/>
</CardTitle>
<CardContent>
<div className={classes.root}>
<PriceField

109
src/products/components/ProductTaxes/ProductTaxes.tsx Normal file
View file

@ -0,0 +1,109 @@
import Card from "@material-ui/core/Card";
import CardContent from "@material-ui/core/CardContent";
import makeStyles from "@material-ui/core/styles/makeStyles";
import CardTitle from "@saleor/components/CardTitle";
import ControlledCheckbox from "@saleor/components/ControlledCheckbox";
import Hr from "@saleor/components/Hr";
import SingleAutocompleteSelectField from "@saleor/components/SingleAutocompleteSelectField";
import { TaxTypeFragment } from "@saleor/fragments/types/TaxTypeFragment";
import { FormChange } from "@saleor/hooks/useForm";
import { sectionNames } from "@saleor/intl";
import React from "react";
import { useIntl } from "react-intl";
export interface ProductTaxesProps {
data: {
changeTaxCode: boolean;
chargeTaxes: boolean;
taxCode: string;
};
disabled: boolean;
selectedTaxTypeDisplayName: string;
taxTypes: TaxTypeFragment[];
onChange: FormChange;
onTaxTypeChange: FormChange;
}
const useStyles = makeStyles(
theme => ({
content: {
paddingTop: theme.spacing(2)
},
hr: {
margin: theme.spacing(2, 0)
},
select: {
margin: theme.spacing(2, 0)
}
}),
{
name: "ProductTaxes"
}
);
const ProductTaxes: React.FC<ProductTaxesProps> = ({
data,
disabled,
selectedTaxTypeDisplayName,
taxTypes,
onChange,
onTaxTypeChange
}) => {
const intl = useIntl();
const classes = useStyles({});
return (
<Card>
<CardTitle title={intl.formatMessage(sectionNames.taxes)} />
<CardContent className={classes.content}>
<ControlledCheckbox
checked={data.changeTaxCode}
disabled={disabled}
label={intl.formatMessage({
defaultMessage: "Change default product’s tax rate",
description: "checkbox"
})}
name="changeTaxCode"
onChange={onChange}
/>
<Hr className={classes.hr} />
<ControlledCheckbox
checked={data.chargeTaxes}
disabled={disabled}
label={intl.formatMessage({
defaultMessage: "Charge taxes on this product",
description: "checkbox"
})}
name="chargeTaxes"
onChange={onChange}
/>
{data.changeTaxCode && (
<SingleAutocompleteSelectField
className={classes.select}
disabled={disabled}
displayValue={selectedTaxTypeDisplayName}
label={intl.formatMessage({
defaultMessage: "Tax Rate",
description: "select tax ratte"
})}
name="taxCode"
onChange={onTaxTypeChange}
value={data.taxCode}
choices={
taxTypes?.map(taxType => ({
label: taxType.description,
value: taxType.taxCode
})) || []
}
InputProps={{
autoComplete: "off"
}}
/>
)}
</CardContent>
</Card>
);
};
ProductTaxes.displayName = "ProductTaxes";
export default ProductTaxes;

2
src/products/components/ProductTaxes/index.ts Normal file
View file

@ -0,0 +1,2 @@
export * from "./ProductTaxes";
export { default } from "./ProductTaxes";

27
src/products/components/ProductUpdatePage/ProductUpdatePage.tsx
View file

@ -10,6 +10,7 @@ import PageHeader from "@saleor/components/PageHeader";
import SaveButtonBar from "@saleor/components/SaveButtonBar";
import SeoForm from "@saleor/components/SeoForm";
import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
import { TaxTypeFragment } from "@saleor/fragments/types/TaxTypeFragment";
import { WarehouseFragment } from "@saleor/fragments/types/WarehouseFragment";
import useDateLocalize from "@saleor/hooks/useDateLocalize";
import useFormset from "@saleor/hooks/useFormset";
@ -52,6 +53,7 @@ import ProductOrganization from "../ProductOrganization";
import ProductPricing from "../ProductPricing";
import ProductShipping from "../ProductShipping/ProductShipping";
import ProductStocks, { ProductStockInput } from "../ProductStocks";
import ProductTaxes from "../ProductTaxes";
import ProductVariants from "../ProductVariants";
export interface ProductUpdatePageProps extends ListActions {
@ -69,6 +71,7 @@ export interface ProductUpdatePageProps extends ListActions {
header: string;
saveButtonBarState: ConfirmButtonTransitionState;
warehouses: WarehouseFragment[];
taxTypes: TaxTypeFragment[];
fetchCategories: (query: string) => void;
fetchCollections: (query: string) => void;
onVariantsAdd: () => void;
@ -110,6 +113,7 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
saveButtonBarState,
variants,
warehouses,
taxTypes,
onBack,
onDelete,
onImageDelete,
@ -159,6 +163,10 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
getChoices(maybe(() => product.collections, []))
);
const [selectedTaxType, setSelectedTaxType] = useStateFromProps(
product?.taxType.description
);
const {
isMetadataModified,
isPrivateMetadataModified,
@ -175,6 +183,11 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
const currency =
product?.variants?.length && product.variants[0].price.currency;
const hasVariants = maybe(() => product.productType.hasVariants, false);
const taxTypeChoices =
taxTypes?.map(taxType => ({
label: taxType.description,
value: taxType.taxCode
})) || [];
const handleSubmit = (data: ProductUpdatePageFormData) => {
const metadata = isMetadataModified ? data.metadata : undefined;
@ -244,6 +257,11 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
triggerChange
);
const changeMetadata = makeMetadataChangeHandler(change);
const handleTaxTypeSelect = createSingleAutocompleteSelectHandler(
change,
setSelectedTaxType,
taxTypeChoices
);
return (
<>
@ -415,6 +433,15 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
}}
onChange={change}
/>
<CardSpacer />
<ProductTaxes
data={data}
disabled={disabled}
selectedTaxTypeDisplayName={selectedTaxType}
taxTypes={taxTypes}
onChange={change}
onTaxTypeChange={handleTaxTypeSelect}
/>
</div>
</Grid>
<SaveButtonBar

10
src/products/fixtures.ts
View file

@ -205,8 +205,10 @@ export const product: (
hasVariants: true,
id: "pt76406",
name: "Versatile",
seoDescription: "Omnis rerum ea. Fugit dignissimos modi est rerum",
seoTitle: "Ergonomic Plastic Bacon",
taxType: {
__typename: "TaxType",
taxCode: "standard"
},
variantAttributes: [
{
__typename: "Attribute",
@ -253,6 +255,10 @@ export const product: (
seoDescription: "Seo description",
seoTitle: "Seo title",
sku: "59661-34207",
taxType: {
__typename: "TaxType",
taxCode: "standard"
},
thumbnail: { __typename: "Image" as "Image", url: placeholderImage },
url: "/example-url",
variants: [

103
src/products/mutations.ts
View file

@ -137,36 +137,8 @@ export const useProductImagesReorder = makeMutation<
export const productUpdateMutation = gql`
${productErrorFragment}
${productFragmentDetails}
mutation ProductUpdate(
$id: ID!
$attributes: [AttributeValueInput]
$publicationDate: Date
$category: ID
$chargeTaxes: Boolean!
$collections: [ID]
$descriptionJson: JSONString
$isPublished: Boolean!
$name: String
$basePrice: PositiveDecimal
$seo: SeoInput
$visibleInListings: Boolean
) {
productUpdate(
id: $id
input: {
attributes: $attributes
publicationDate: $publicationDate
category: $category
chargeTaxes: $chargeTaxes
collections: $collections
descriptionJson: $descriptionJson
isPublished: $isPublished
name: $name
basePrice: $basePrice
seo: $seo
visibleInListings: $visibleInListings
}
) {
mutation ProductUpdate($id: ID!, $input: ProductInput!) {
productUpdate(id: $id, input: $input) {
errors: productErrors {
...ProductErrorFragment
}
@ -189,41 +161,14 @@ export const simpleProductUpdateMutation = gql`
${fragmentVariant}
mutation SimpleProductUpdate(
$id: ID!
$attributes: [AttributeValueInput]
$publicationDate: Date
$category: ID
$chargeTaxes: Boolean!
$collections: [ID]
$descriptionJson: JSONString
$isPublished: Boolean!
$name: String
$basePrice: PositiveDecimal
$input: ProductInput!
$productVariantId: ID!
$productVariantInput: ProductVariantInput!
$seo: SeoInput
$addStocks: [StockInput!]!
$deleteStocks: [ID!]!
$updateStocks: [StockInput!]!
$weight: WeightScalar
$visibleInListings: Boolean
) {
productUpdate(
id: $id
input: {
attributes: $attributes
publicationDate: $publicationDate
category: $category
chargeTaxes: $chargeTaxes
collections: $collections
descriptionJson: $descriptionJson
isPublished: $isPublished
name: $name
basePrice: $basePrice
seo: $seo
weight: $weight
visibleInListings: $visibleInListings
}
) {
productUpdate(id: $id, input: $input) {
errors: productErrors {
...ProductErrorFragment
}
@ -282,44 +227,8 @@ export const useSimpleProductUpdateMutation = makeMutation<
export const productCreateMutation = gql`
${productErrorFragment}
${productFragmentDetails}
mutation ProductCreate(
$attributes: [AttributeValueInput]
$publicationDate: Date
$category: ID!
$chargeTaxes: Boolean!
$collections: [ID]
$descriptionJson: JSONString
$isPublished: Boolean!
$name: String!
$basePrice: PositiveDecimal
$productType: ID!
$sku: String
$seo: SeoInput
$stocks: [StockInput!]!
$trackInventory: Boolean!
$weight: WeightScalar
$visibleInListings: Boolean
) {
productCreate(
input: {
attributes: $attributes
publicationDate: $publicationDate
category: $category
chargeTaxes: $chargeTaxes
collections: $collections
descriptionJson: $descriptionJson
isPublished: $isPublished
name: $name
basePrice: $basePrice
productType: $productType
sku: $sku
seo: $seo
stocks: $stocks
trackInventory: $trackInventory
weight: $weight
visibleInListings: $visibleInListings
}
) {
mutation ProductCreate($input: ProductCreateInput!) {
productCreate(input: $input) {
errors: productErrors {
...ProductErrorFragment
}

5
src/products/queries.ts
View file

@ -6,6 +6,7 @@ import {
productFragmentDetails,
productVariantAttributesFragment
} from "@saleor/fragments/products";
import { taxTypeFragment } from "@saleor/fragments/taxes";
import { warehouseFragment } from "@saleor/fragments/warehouses";
import makeQuery from "@saleor/hooks/makeQuery";
import gql from "graphql-tag";
@ -166,10 +167,14 @@ export const useCountAllProducts = makeQuery<CountAllProducts, null>(
const productDetailsQuery = gql`
${productFragmentDetails}
${taxTypeFragment}
query ProductDetails($id: ID!) {
product(id: $id) {
...Product
}
taxTypes {
...TaxTypeFragment
}
}
`;
export const useProductDetails = makeQuery<

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

@ -2,7 +2,7 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { AttributeValueInput, SeoInput, StockInput, ProductErrorCode, AttributeInputTypeEnum, WeightUnitsEnum } from "./../../types/globalTypes";
import { ProductCreateInput, ProductErrorCode, AttributeInputTypeEnum, WeightUnitsEnum } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductCreate
@ -58,12 +58,19 @@ export interface ProductCreate_productCreate_product_productType_variantAttribut
values: (ProductCreate_productCreate_product_productType_variantAttributes_values | null)[] | null;
}
export interface ProductCreate_productCreate_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductCreate_productCreate_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (ProductCreate_productCreate_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: ProductCreate_productCreate_product_productType_taxType | null;
}
export interface ProductCreate_productCreate_product_pricing_priceRangeUndiscounted_start_gross {
@ -192,6 +199,12 @@ export interface ProductCreate_productCreate_product_weight {
value: number;
}
export interface ProductCreate_productCreate_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductCreate_productCreate_product {
__typename: "Product";
id: string;
@ -216,6 +229,7 @@ export interface ProductCreate_productCreate_product {
images: (ProductCreate_productCreate_product_images | null)[] | null;
variants: (ProductCreate_productCreate_product_variants | null)[] | null;
weight: ProductCreate_productCreate_product_weight | null;
taxType: ProductCreate_productCreate_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}
@ -231,20 +245,5 @@ export interface ProductCreate {
}
export interface ProductCreateVariables {
attributes?: (AttributeValueInput | null)[] | null;
publicationDate?: any | null;
category: string;
chargeTaxes: boolean;
collections?: (string | null)[] | null;
descriptionJson?: any | null;
isPublished: boolean;
name: string;
basePrice?: any | null;
productType: string;
sku?: string | null;
seo?: SeoInput | null;
stocks: StockInput[];
trackInventory: boolean;
weight?: any | null;
visibleInListings?: boolean | null;
input: ProductCreateInput;
}

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

@ -52,12 +52,19 @@ export interface ProductDetails_product_productType_variantAttributes {
values: (ProductDetails_product_productType_variantAttributes_values | null)[] | null;
}
export interface ProductDetails_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductDetails_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (ProductDetails_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: ProductDetails_product_productType_taxType | null;
}
export interface ProductDetails_product_pricing_priceRangeUndiscounted_start_gross {
@ -186,6 +193,12 @@ export interface ProductDetails_product_weight {
value: number;
}
export interface ProductDetails_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductDetails_product {
__typename: "Product";
id: string;
@ -210,12 +223,20 @@ export interface ProductDetails_product {
images: (ProductDetails_product_images | null)[] | null;
variants: (ProductDetails_product_variants | null)[] | null;
weight: ProductDetails_product_weight | null;
taxType: ProductDetails_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}
export interface ProductDetails_taxTypes {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductDetails {
product: ProductDetails_product | null;
taxTypes: (ProductDetails_taxTypes | null)[] | null;
}
export interface ProductDetailsVariables {

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

@ -58,12 +58,19 @@ export interface ProductImageCreate_productImageCreate_product_productType_varia
values: (ProductImageCreate_productImageCreate_product_productType_variantAttributes_values | null)[] | null;
}
export interface ProductImageCreate_productImageCreate_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductImageCreate_productImageCreate_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (ProductImageCreate_productImageCreate_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: ProductImageCreate_productImageCreate_product_productType_taxType | null;
}
export interface ProductImageCreate_productImageCreate_product_pricing_priceRangeUndiscounted_start_gross {
@ -192,6 +199,12 @@ export interface ProductImageCreate_productImageCreate_product_weight {
value: number;
}
export interface ProductImageCreate_productImageCreate_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductImageCreate_productImageCreate_product {
__typename: "Product";
id: string;
@ -216,6 +229,7 @@ export interface ProductImageCreate_productImageCreate_product {
images: (ProductImageCreate_productImageCreate_product_images | null)[] | null;
variants: (ProductImageCreate_productImageCreate_product_variants | null)[] | null;
weight: ProductImageCreate_productImageCreate_product_weight | null;
taxType: ProductImageCreate_productImageCreate_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}

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

@ -58,12 +58,19 @@ export interface ProductImageUpdate_productImageUpdate_product_productType_varia
values: (ProductImageUpdate_productImageUpdate_product_productType_variantAttributes_values | null)[] | null;
}
export interface ProductImageUpdate_productImageUpdate_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductImageUpdate_productImageUpdate_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (ProductImageUpdate_productImageUpdate_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: ProductImageUpdate_productImageUpdate_product_productType_taxType | null;
}
export interface ProductImageUpdate_productImageUpdate_product_pricing_priceRangeUndiscounted_start_gross {
@ -192,6 +199,12 @@ export interface ProductImageUpdate_productImageUpdate_product_weight {
value: number;
}
export interface ProductImageUpdate_productImageUpdate_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductImageUpdate_productImageUpdate_product {
__typename: "Product";
id: string;
@ -216,6 +229,7 @@ export interface ProductImageUpdate_productImageUpdate_product {
images: (ProductImageUpdate_productImageUpdate_product_images | null)[] | null;
variants: (ProductImageUpdate_productImageUpdate_product_variants | null)[] | null;
weight: ProductImageUpdate_productImageUpdate_product_weight | null;
taxType: ProductImageUpdate_productImageUpdate_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}

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

@ -2,7 +2,7 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { AttributeValueInput, SeoInput, ProductErrorCode, AttributeInputTypeEnum, WeightUnitsEnum } from "./../../types/globalTypes";
import { ProductInput, ProductErrorCode, AttributeInputTypeEnum, WeightUnitsEnum } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductUpdate
@ -58,12 +58,19 @@ export interface ProductUpdate_productUpdate_product_productType_variantAttribut
values: (ProductUpdate_productUpdate_product_productType_variantAttributes_values | null)[] | null;
}
export interface ProductUpdate_productUpdate_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductUpdate_productUpdate_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (ProductUpdate_productUpdate_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: ProductUpdate_productUpdate_product_productType_taxType | null;
}
export interface ProductUpdate_productUpdate_product_pricing_priceRangeUndiscounted_start_gross {
@ -192,6 +199,12 @@ export interface ProductUpdate_productUpdate_product_weight {
value: number;
}
export interface ProductUpdate_productUpdate_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductUpdate_productUpdate_product {
__typename: "Product";
id: string;
@ -216,6 +229,7 @@ export interface ProductUpdate_productUpdate_product {
images: (ProductUpdate_productUpdate_product_images | null)[] | null;
variants: (ProductUpdate_productUpdate_product_variants | null)[] | null;
weight: ProductUpdate_productUpdate_product_weight | null;
taxType: ProductUpdate_productUpdate_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}
@ -232,15 +246,5 @@ export interface ProductUpdate {
export interface ProductUpdateVariables {
id: string;
attributes?: (AttributeValueInput | null)[] | null;
publicationDate?: any | null;
category?: string | null;
chargeTaxes: boolean;
collections?: (string | null)[] | null;
descriptionJson?: any | null;
isPublished: boolean;
name?: string | null;
basePrice?: any | null;
seo?: SeoInput | null;
visibleInListings?: boolean | null;
input: ProductInput;
}

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

@ -58,12 +58,19 @@ export interface ProductVariantReorder_productVariantReorder_product_productType
values: (ProductVariantReorder_productVariantReorder_product_productType_variantAttributes_values | null)[] | null;
}
export interface ProductVariantReorder_productVariantReorder_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductVariantReorder_productVariantReorder_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (ProductVariantReorder_productVariantReorder_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: ProductVariantReorder_productVariantReorder_product_productType_taxType | null;
}
export interface ProductVariantReorder_productVariantReorder_product_pricing_priceRangeUndiscounted_start_gross {
@ -192,6 +199,12 @@ export interface ProductVariantReorder_productVariantReorder_product_weight {
value: number;
}
export interface ProductVariantReorder_productVariantReorder_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface ProductVariantReorder_productVariantReorder_product {
__typename: "Product";
id: string;
@ -216,6 +229,7 @@ export interface ProductVariantReorder_productVariantReorder_product {
images: (ProductVariantReorder_productVariantReorder_product_images | null)[] | null;
variants: (ProductVariantReorder_productVariantReorder_product_variants | null)[] | null;
weight: ProductVariantReorder_productVariantReorder_product_weight | null;
taxType: ProductVariantReorder_productVariantReorder_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}

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

@ -2,7 +2,7 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { AttributeValueInput, ProductVariantInput, SeoInput, StockInput, ProductErrorCode, AttributeInputTypeEnum, WeightUnitsEnum, StockErrorCode } from "./../../types/globalTypes";
import { ProductInput, ProductVariantInput, StockInput, ProductErrorCode, AttributeInputTypeEnum, WeightUnitsEnum, StockErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: SimpleProductUpdate
@ -58,12 +58,19 @@ export interface SimpleProductUpdate_productUpdate_product_productType_variantAt
values: (SimpleProductUpdate_productUpdate_product_productType_variantAttributes_values | null)[] | null;
}
export interface SimpleProductUpdate_productUpdate_product_productType_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface SimpleProductUpdate_productUpdate_product_productType {
__typename: "ProductType";
id: string;
variantAttributes: (SimpleProductUpdate_productUpdate_product_productType_variantAttributes | null)[] | null;
name: string;
hasVariants: boolean;
taxType: SimpleProductUpdate_productUpdate_product_productType_taxType | null;
}
export interface SimpleProductUpdate_productUpdate_product_pricing_priceRangeUndiscounted_start_gross {
@ -192,6 +199,12 @@ export interface SimpleProductUpdate_productUpdate_product_weight {
value: number;
}
export interface SimpleProductUpdate_productUpdate_product_taxType {
__typename: "TaxType";
description: string | null;
taxCode: string | null;
}
export interface SimpleProductUpdate_productUpdate_product {
__typename: "Product";
id: string;
@ -216,6 +229,7 @@ export interface SimpleProductUpdate_productUpdate_product {
images: (SimpleProductUpdate_productUpdate_product_images | null)[] | null;
variants: (SimpleProductUpdate_productUpdate_product_variants | null)[] | null;
weight: SimpleProductUpdate_productUpdate_product_weight | null;
taxType: SimpleProductUpdate_productUpdate_product_taxType | null;
availableForPurchase: any | null;
visibleInListings: boolean;
}
@ -814,21 +828,10 @@ export interface SimpleProductUpdate {
export interface SimpleProductUpdateVariables {
id: string;
attributes?: (AttributeValueInput | null)[] | null;
publicationDate?: any | null;
category?: string | null;
chargeTaxes: boolean;
collections?: (string | null)[] | null;
descriptionJson?: any | null;
isPublished: boolean;
name?: string | null;
basePrice?: any | null;
input: ProductInput;
productVariantId: string;
productVariantInput: ProductVariantInput;
seo?: SeoInput | null;
addStocks: StockInput[];
deleteStocks: string[];
updateStocks: StockInput[];
weight?: any | null;
visibleInListings?: boolean | null;
}

11
src/products/utils/data.ts
View file

@ -174,20 +174,22 @@ export interface ProductUpdatePageFormData extends MetadataFormData {
availableForPurchase: string;
basePrice: number;
category: string | null;
collections: string[];
changeTaxCode: boolean;
chargeTaxes: boolean;
collections: string[];
description: RawDraftContentState;
isAvailableForPurchase: boolean;
isAvailable: boolean;
isAvailableForPurchase: boolean;
isPublished: boolean;
name: string;
publicationDate: string;
seoDescription: string;
seoTitle: string;
sku: string;
taxCode: string;
trackInventory: boolean;
weight: string;
visibleInListings: boolean;
weight: string;
}
export function getProductUpdatePageFormData(
@ -198,6 +200,8 @@ export function getProductUpdatePageFormData(
availableForPurchase: product?.availableForPurchase,
basePrice: maybe(() => product.variants[0].price.amount, 0),
category: maybe(() => product.category.id, ""),
changeTaxCode:
product?.productType.taxType.taxCode !== product?.taxType.taxCode,
chargeTaxes: maybe(() => product.chargeTaxes, false),
collections: maybe(
() => product.collections.map(collection => collection.id),
@ -222,6 +226,7 @@ export function getProductUpdatePageFormData(
: undefined,
""
),
taxCode: product?.taxType.taxCode,
trackInventory: !!product?.variants[0]?.trackInventory,
visibleInListings: !!product?.visibleInListings,
weight: product?.weight?.value.toString() || ""

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

@ -91,6 +91,7 @@ export const ProductCreateView: React.FC = () => {
const handleCreate = async (formData: ProductCreatePageSubmitData) => {
const result = await productCreate({
variables: {
input: {
attributes: formData.attributes.map(attribute => ({
id: attribute.id,
values: attribute.value
@ -118,6 +119,7 @@ export const ProductCreateView: React.FC = () => {
visibleInListings: formData.visibleInListings,
weight: weight(formData.weight)
}
}
});
const productId = result.data.productCreate?.product?.id;

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

@ -292,6 +292,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
taxTypes={data?.taxTypes}
variants={maybe(() => product.variants)}
onBack={handleBack}
onDelete={() => openModal("remove")}

14
src/products/views/ProductUpdate/handlers.ts
View file

@ -41,6 +41,8 @@ export function createUpdateHandler(
) {
return async (data: ProductUpdatePageSubmitData) => {
const productVariables: ProductUpdateVariables = {
id: product.id,
input: {
attributes: data.attributes.map(attribute => ({
id: attribute.id,
values: attribute.value[0] === "" ? [] : attribute.value
@ -50,7 +52,6 @@ export function createUpdateHandler(
chargeTaxes: data.chargeTaxes,
collections: data.collections,
descriptionJson: JSON.stringify(data.description),
id: product.id,
isPublished: data.isPublished,
name: data.name,
publicationDate:
@ -59,7 +60,11 @@ export function createUpdateHandler(
description: data.seoDescription,
title: data.seoTitle
},
taxCode: data.changeTaxCode
? data.taxCode
: product.productType.taxType.taxCode,
visibleInListings: data.visibleInListings
}
};
let errors: Array<
@ -74,13 +79,16 @@ export function createUpdateHandler(
...productVariables,
addStocks: data.addStocks.map(mapFormsetStockToStockInput),
deleteStocks: data.removeStocks,
input: {
...productVariables.input,
weight: weight(data.weight)
},
productVariantId: product.variants[0].id,
productVariantInput: {
sku: data.sku,
trackInventory: data.trackInventory
},
updateStocks: data.updateStocks.map(mapFormsetStockToStockInput),
weight: weight(data.weight)
updateStocks: data.updateStocks.map(mapFormsetStockToStockInput)
});
errors = [
...result.data.productUpdate.errors,

42
src/types/globalTypes.ts
View file

@ -1341,6 +1341,28 @@ export interface PriceRangeInput {
lte?: number | null;
}
export interface ProductCreateInput {
attributes?: (AttributeValueInput | null)[] | null;
publicationDate?: any | null;
category?: string | null;
chargeTaxes?: boolean | null;
collections?: (string | null)[] | null;
description?: string | null;
descriptionJson?: any | null;
isPublished?: boolean | null;
name?: string | null;
slug?: string | null;
taxCode?: string | null;
seo?: SeoInput | null;
weight?: any | null;
sku?: string | null;
trackInventory?: boolean | null;
basePrice?: any | null;
visibleInListings?: boolean | null;
productType: string;
stocks?: StockInput[] | null;
}
export interface ProductFilterInput {
isPublished?: boolean | null;
collections?: (string | null)[] | null;
@ -1356,6 +1378,26 @@ export interface ProductFilterInput {
productTypes?: (string | null)[] | null;
}
export interface ProductInput {
attributes?: (AttributeValueInput | null)[] | null;
publicationDate?: any | null;
category?: string | null;
chargeTaxes?: boolean | null;
collections?: (string | null)[] | null;
description?: string | null;
descriptionJson?: any | null;
isPublished?: boolean | null;
name?: string | null;
slug?: string | null;
taxCode?: string | null;
seo?: SeoInput | null;
weight?: any | null;
sku?: string | null;
trackInventory?: boolean | null;
basePrice?: any | null;
visibleInListings?: boolean | null;
}
export interface ProductOrder {
direction: OrderDirection;
attributeId?: string | null;