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

Use dedicated error fragment

Browse source
This commit is contained in:
dominik-zeglen 2020-10-03 11:52:59 +02:00
parent ee1ecff1f8
commit 60fb2266a9
23 changed files with 296 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
schema.graphql
View file

@ -688,6 +688,7 @@ type BulkProductError {
field: String
message: String
code: ProductErrorCode!
attributes: [ID!]
index: Int
warehouses: [ID!]
}
@ -696,6 +697,7 @@ type BulkStockError {
field: String
message: String
code: ProductErrorCode!
attributes: [ID!]
index: Int
}
@ -3744,6 +3746,7 @@ type ProductError {
field: String
message: String
code: ProductErrorCode!
attributes: [ID!]
}
enum ProductErrorCode {
@ -3755,6 +3758,7 @@ enum ProductErrorCode {
GRAPHQL_ERROR
INVALID
NOT_PRODUCTS_IMAGE
NOT_PRODUCTS_VARIANT
NOT_FOUND
REQUIRED
UNIQUE

8
src/fragments/errors.ts
View file

@ -7,6 +7,14 @@ export const productErrorFragment = gql`
}
`;
export const productErrorWithAttributesFragment = gql`
${productErrorFragment}
fragment ProductErrorWithAttributesFragment on ProductError {
...ProductErrorFragment
attributes
}
`;
export const accountErrorFragment = gql`
fragment AccountErrorFragment on AccountError {
code

1
src/fragments/types/ProductErrorFragment.ts
View file

@ -10,7 +10,6 @@ import { ProductErrorCode } from "./../../types/globalTypes";
export interface ProductErrorFragment {
__typename: "ProductError";
attributeId: string | null;
code: ProductErrorCode;
field: string | null;
}

16
src/fragments/types/ProductErrorWithAttributesFragment.ts Normal file
View file

@ -0,0 +1,16 @@
/* tslint:disable */
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL fragment: ProductErrorWithAttributesFragment
// ====================================================
export interface ProductErrorWithAttributesFragment {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}

10
src/products/components/ProductAttributes/ProductAttributes.tsx
View file

@ -13,7 +13,7 @@ import MultiAutocompleteSelectField, {
import SingleAutocompleteSelectField, {
SingleAutocompleteChoiceType
} from "@saleor/components/SingleAutocompleteSelectField";
import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
import { ProductErrorWithAttributesFragment } from "@saleor/fragments/types/ProductErrorWithAttributesFragment";
import { FormsetAtomicData, FormsetChange } from "@saleor/hooks/useFormset";
import { maybe } from "@saleor/misc";
import { ProductDetails_product_attributes_attribute_values } from "@saleor/products/types/ProductDetails";
@ -35,7 +35,7 @@ export type ProductAttributeInput = FormsetAtomicData<
export interface ProductAttributesProps {
attributes: ProductAttributeInput[];
disabled: boolean;
errors: ProductErrorFragment[];
errors: ProductErrorWithAttributesFragment[];
onChange: FormsetChange;
onMultiChange: FormsetChange;
}
@ -174,8 +174,8 @@ const ProductAttributes: React.FC<ProductAttributesProps> = ({
<>
<Hr />
{attributes.map((attribute, attributeIndex) => {
const error = errors.find(
err => err.attributeId === attribute.id
const error = errors.find(err =>
err.attributes?.includes(attribute.id)
);
return (
@ -201,7 +201,7 @@ const ProductAttributes: React.FC<ProductAttributesProps> = ({
).name,
attribute.value[0]
)}
emptyOption
emptyOption={!attribute.data.isRequired}
error={!!error}
helperText={getProductErrorMessage(error, intl)}
name={`attribute:${attribute.label}`}

32
src/products/components/ProductCreatePage/ProductCreatePage.tsx
View file

@ -10,13 +10,14 @@ import { MultiAutocompleteChoiceType } from "@saleor/components/MultiAutocomplet
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 { ProductErrorWithAttributesFragment } from "@saleor/fragments/types/ProductErrorWithAttributesFragment";
import { TaxTypeFragment } from "@saleor/fragments/types/TaxTypeFragment";
import useDateLocalize from "@saleor/hooks/useDateLocalize";
import useFormset from "@saleor/hooks/useFormset";
import useStateFromProps from "@saleor/hooks/useStateFromProps";
import { sectionNames } from "@saleor/intl";
import {
getAttributeInputFromProductType,
getChoices,
ProductAttributeValueChoices,
ProductType
@ -79,7 +80,7 @@ export interface ProductCreatePageSubmitData extends FormData {
}
interface ProductCreatePageProps {
errors: ProductErrorFragment[];
errors: ProductErrorWithAttributesFragment[];
collections: SearchCollections_search_edges_node[];
categories: SearchCategories_search_edges_node[];
currency: string;
@ -87,6 +88,7 @@ interface ProductCreatePageProps {
fetchMoreCategories: FetchMoreProps;
fetchMoreCollections: FetchMoreProps;
fetchMoreProductTypes: FetchMoreProps;
initial?: Partial<FormData>;
productTypes?: Array<{
id: string;
name: string;
@ -118,6 +120,7 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
fetchMoreCollections,
fetchMoreProductTypes,
header,
initial,
productTypes: productTypeChoiceList,
saveButtonBarState,
warehouses,
@ -130,12 +133,21 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
}: ProductCreatePageProps) => {
const intl = useIntl();
const localizeDate = useDateLocalize();
const initialProductType = productTypeChoiceList?.find(
productType => initial?.productType === productType.id
);
// Form values
const {
change: changeAttributeData,
data: attributes,
set: setAttributeData
} = useFormset<ProductAttributeInputData>([]);
} = useFormset<ProductAttributeInputData>(
initial?.productType
? getAttributeInputFromProductType(initialProductType)
: []
);
const {
add: addStock,
change: changeStockData,
@ -154,6 +166,7 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
} = useMetadataChangeTrigger();
const initialData: FormData = {
...(initial || {}),
availableForPurchase: "",
basePrice: 0,
category: "",
@ -185,14 +198,20 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
ProductAttributeValueChoices[]
>([]);
const [selectedCategory, setSelectedCategory] = useStateFromProps("");
const [selectedCategory, setSelectedCategory] = useStateFromProps(
initial?.category || ""
);
const [selectedCollections, setSelectedCollections] = useStateFromProps<
MultiAutocompleteChoiceType[]
>([]);
const [productType, setProductType] = React.useState<ProductType>(null);
const [selectedTaxType, setSelectedTaxType] = useStateFromProps(null);
const [productType, setProductType] = useStateFromProps<ProductType>(
initialProductType || null
);
const [selectedTaxType, setSelectedTaxType] = useStateFromProps(
initial?.taxCode || null
);
const categories = getChoices(categoryChoiceList);
const collections = getChoices(collectionChoiceList);
@ -274,6 +293,7 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
<ProductAttributes
attributes={attributes}
disabled={disabled}
errors={errors}
onChange={handleAttributeChange}
onMultiChange={handleAttributeMultiChange}
/>

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

@ -9,7 +9,7 @@ import Metadata from "@saleor/components/Metadata/Metadata";
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 { ProductErrorWithAttributesFragment } from "@saleor/fragments/types/ProductErrorWithAttributesFragment";
import { TaxTypeFragment } from "@saleor/fragments/types/TaxTypeFragment";
import { WarehouseFragment } from "@saleor/fragments/types/WarehouseFragment";
import useDateLocalize from "@saleor/hooks/useDateLocalize";
@ -58,7 +58,7 @@ import ProductVariants from "../ProductVariants";
export interface ProductUpdatePageProps extends ListActions {
defaultWeightUnit: string;
errors: ProductErrorFragment[];
errors: ProductErrorWithAttributesFragment[];
placeholderImage: string;
collections: SearchCollections_search_edges_node[];
categories: SearchCategories_search_edges_node[];

10
src/products/components/ProductVariantAttributes/ProductVariantAttributes.tsx
View file

@ -8,7 +8,7 @@ import SingleAutocompleteSelectField, {
SingleAutocompleteChoiceType
} from "@saleor/components/SingleAutocompleteSelectField";
import Skeleton from "@saleor/components/Skeleton";
import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
import { ProductErrorWithAttributesFragment } from "@saleor/fragments/types/ProductErrorWithAttributesFragment";
import { ProductVariant_attributes_attribute_values } from "@saleor/fragments/types/ProductVariant";
import { FormsetAtomicData, FormsetChange } from "@saleor/hooks/useFormset";
import { commonMessages } from "@saleor/intl";
@ -27,7 +27,7 @@ export type VariantAttributeInput = FormsetAtomicData<
interface ProductVariantAttributesProps {
attributes: VariantAttributeInput[];
disabled: boolean;
errors: ProductErrorFragment[];
errors: ProductErrorWithAttributesFragment[];
onChange: FormsetChange<VariantAttributeInputData>;
}
@ -85,8 +85,8 @@ const ProductVariantAttributes: React.FC<ProductVariantAttributesProps> = ({
<Skeleton />
) : (
attributes.map(attribute => {
const error = errors.find(
err => err.attributeId === attribute.id
const error = errors.find(err =>
err.attributes?.includes(attribute.id)
);
return (
@ -122,7 +122,7 @@ const ProductVariantAttributes: React.FC<ProductVariantAttributesProps> = ({
{errors
.filter(
error =>
error.field === "attributes" && error.attributeId === null
error.field === "attributes" && error.attributes === null
)
.map(error => (
<Typography color="error" key={error.code}>

4
src/products/components/ProductVariantCreatePage/ProductVariantCreatePage.tsx
View file

@ -7,7 +7,7 @@ import Grid from "@saleor/components/Grid";
import Metadata, { MetadataFormData } from "@saleor/components/Metadata";
import PageHeader from "@saleor/components/PageHeader";
import SaveButtonBar from "@saleor/components/SaveButtonBar";
import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
import { ProductErrorWithAttributesFragment } from "@saleor/fragments/types/ProductErrorWithAttributesFragment";
import useFormset, {
FormsetChange,
FormsetData
@ -48,7 +48,7 @@ export interface ProductVariantCreatePageSubmitData
interface ProductVariantCreatePageProps {
currencySymbol: string;
disabled: boolean;
errors: ProductErrorFragment[];
errors: ProductErrorWithAttributesFragment[];
header: string;
product: ProductVariantCreateData_product;
saveButtonBarState: ConfirmButtonTransitionState;

2
src/products/components/ProductVariantNavigation/ProductVariantNavigation.tsx
View file

@ -131,7 +131,7 @@ const ProductVariantNavigation: React.FC<ProductVariantNavigationProps> = props
classes.tabActive,
classes.noHandle,
{
[classes.firstVariant]: variants.length === 0
[classes.firstVariant]: variants?.length === 0
}
)}
thumbnail={null}

4
src/products/components/ProductVariantPage/ProductVariantPage.tsx
View file

@ -8,7 +8,7 @@ import { MetadataFormData } from "@saleor/components/Metadata";
import Metadata from "@saleor/components/Metadata/Metadata";
import PageHeader from "@saleor/components/PageHeader";
import SaveButtonBar from "@saleor/components/SaveButtonBar";
import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
import { ProductErrorWithAttributesFragment } from "@saleor/fragments/types/ProductErrorWithAttributesFragment";
import { ProductVariant } from "@saleor/fragments/types/ProductVariant";
import { WarehouseFragment } from "@saleor/fragments/types/WarehouseFragment";
import useFormset, {
@ -56,7 +56,7 @@ export interface ProductVariantPageSubmitData
interface ProductVariantPageProps {
defaultWeightUnit: string;
variant?: ProductVariant;
errors: ProductErrorFragment[];
errors: ProductErrorWithAttributesFragment[];
saveButtonBarState: ConfirmButtonTransitionState;
loading?: boolean;
placeholderImage?: string;

23
src/products/mutations.ts
View file

@ -3,6 +3,7 @@ import {
bulkStockErrorFragment,
exportErrorFragment,
productErrorFragment,
productErrorWithAttributesFragment,
stockErrorFragment
} from "@saleor/fragments/errors";
import {
@ -159,12 +160,12 @@ export const useProductVariantSetDefaultMutation = makeMutation<
>(productVariantSetDefault);
export const productUpdateMutation = gql`
${productErrorFragment}
${productErrorWithAttributesFragment}
${productFragmentDetails}
mutation ProductUpdate($id: ID!, $input: ProductInput!) {
productUpdate(id: $id, input: $input) {
errors: productErrors {
...ProductErrorFragment
...ProductErrorWithAttributesFragment
}
product {
...Product
@ -179,7 +180,7 @@ export const useProductUpdateMutation = makeMutation<
export const simpleProductUpdateMutation = gql`
${bulkStockErrorFragment}
${productErrorFragment}
${productErrorWithAttributesFragment}
${productFragmentDetails}
${stockErrorFragment}
${fragmentVariant}
@ -194,7 +195,7 @@ export const simpleProductUpdateMutation = gql`
) {
productUpdate(id: $id, input: $input) {
errors: productErrors {
...ProductErrorFragment
...ProductErrorWithAttributesFragment
}
product {
...Product
@ -202,7 +203,7 @@ export const simpleProductUpdateMutation = gql`
}
productVariantUpdate(id: $productVariantId, input: $productVariantInput) {
errors: productErrors {
...ProductErrorFragment
...ProductErrorWithAttributesFragment
}
productVariant {
...ProductVariant
@ -249,12 +250,12 @@ export const useSimpleProductUpdateMutation = makeMutation<
>(simpleProductUpdateMutation);
export const productCreateMutation = gql`
${productErrorFragment}
${productErrorWithAttributesFragment}
${productFragmentDetails}
mutation ProductCreate($input: ProductCreateInput!) {
productCreate(input: $input) {
errors: productErrors {
...ProductErrorFragment
...ProductErrorWithAttributesFragment
}
product {
...Product
@ -288,7 +289,7 @@ export const useVariantDeleteMutation = makeMutation<
export const variantUpdateMutation = gql`
${bulkStockErrorFragment}
${fragmentVariant}
${productErrorFragment}
${productErrorWithAttributesFragment}
mutation VariantUpdate(
$addStocks: [StockInput!]!
$removeStocks: [ID!]!
@ -313,7 +314,7 @@ export const variantUpdateMutation = gql`
}
) {
errors: productErrors {
...ProductErrorFragment
...ProductErrorWithAttributesFragment
}
productVariant {
...ProductVariant
@ -359,11 +360,11 @@ export const useVariantUpdateMutation = makeMutation<
export const variantCreateMutation = gql`
${fragmentVariant}
${productErrorFragment}
${productErrorWithAttributesFragment}
mutation VariantCreate($input: ProductVariantCreateInput!) {
productVariantCreate(input: $input) {
errors: productErrors {
...ProductErrorFragment
...ProductErrorWithAttributesFragment
}
productVariant {
...ProductVariant

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

@ -12,6 +12,7 @@ export interface ProductCreate_productCreate_errors {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}
export interface ProductCreate_productCreate_product_attributes_attribute_values {

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

@ -12,6 +12,7 @@ export interface ProductUpdate_productUpdate_errors {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}
export interface ProductUpdate_productUpdate_product_attributes_attribute_values {

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

@ -12,6 +12,7 @@ export interface SimpleProductUpdate_productUpdate_errors {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}
export interface SimpleProductUpdate_productUpdate_product_attributes_attribute_values {
@ -251,6 +252,7 @@ export interface SimpleProductUpdate_productVariantUpdate_errors {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}
export interface SimpleProductUpdate_productVariantUpdate_productVariant_metadata {

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

@ -12,6 +12,7 @@ export interface VariantCreate_productVariantCreate_errors {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}
export interface VariantCreate_productVariantCreate_productVariant_metadata {

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

@ -12,6 +12,7 @@ export interface VariantUpdate_productVariantUpdate_errors {
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
attributes: string[] | null;
}
export interface VariantUpdate_productVariantUpdate_productVariant_metadata {

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

@ -140040,6 +140040,152 @@ Ctrl + K"
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiPaper-root-id MuiPaper-elevation0-id MuiCard-root-id ProductAttributes-card-id MuiPaper-rounded-id"
>
<div
class="CardTitle-root-id"
>
<span
class="MuiTypography-root-id CardTitle-title-id MuiTypography-h5-id"
>
Attributes
</span>
<div
class="CardTitle-toolbar-id"
/>
</div>
<div
class="CardTitle-children-id"
/>
<hr
class="CardTitle-hr-id"
/>
<div
class="MuiCardContent-root-id ProductAttributes-cardContent-id"
>
<div
class="ProductAttributes-expansionBar-id"
>
<div
class="ProductAttributes-expansionBarLabelContainer-id"
>
<div
class="MuiTypography-root-id ProductAttributes-expansionBarLabel-id MuiTypography-caption-id"
>
1 Attributes
</div>
</div>
<button
class="MuiButtonBase-root-id MuiIconButton-root-id ProductAttributes-expansionBarButton-id"
data-test="product-attributes-expand"
tabindex="0"
type="button"
>
<span
class="MuiIconButton-label-id"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root-id ProductAttributes-expansionBarButtonIcon-id ProductAttributes-rotate-id"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M7 10l5 5 5-5z"
/>
</svg>
</span>
</button>
</div>
<hr
class="Hr-root-id"
/>
<div
class="ProductAttributes-attributeSection-id Grid-root-id Grid-uniform-id"
>
<div
class="ProductAttributes-attributeSectionLabel-id"
data-test="product-attribute-label"
>
<div
class="MuiTypography-root-id MuiTypography-body1-id"
>
Author
</div>
</div>
<div
data-test="product-attribute-value"
>
<div
class="SingleAutocompleteSelectField-container-id"
>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
data-shrink="false"
>
Value
</label>
<div
aria-autocomplete="list"
aria-expanded="false"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
role="combobox"
>
<input
aria-invalid="true"
autocomplete="off"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
type="text"
value=""
/>
<div>
<svg
aria-hidden="true"
class="MuiSvgIcon-root-id"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<g
style="fill-rule:evenodd"
>
<path
d="M7 10l5 5 5-5z"
/>
</g>
</svg>
</div>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
>
Invalid value
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="CardSpacer-spacer-id"
/>
@ -140248,8 +140394,8 @@ Ctrl + K"
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
data-shrink="false"
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
data-shrink="true"
>
Product Type
</label>
@ -140264,7 +140410,7 @@ Ctrl + K"
autocomplete="off"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
type="text"
value=""
value="Candy"
/>
<div>
<svg
@ -140290,7 +140436,7 @@ Ctrl + K"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
style="width:0"
>
<span>
​
@ -140299,7 +140445,7 @@ Ctrl + K"
</fieldset>
</div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
>
Invalid value
</p>
@ -140976,7 +141122,7 @@ exports[`Storyshots Views / Products / Create product variant add first variant
class="MuiTableRow-root-id"
>
<td
class="MuiTableCell-root-id MuiTableCell-body-id TableCellAvatar-root-id ProductVariantNavigation-colAvatar-id ProductVariantNavigation-tabActive-id ProductVariantNavigation-noHandle-id"
class="MuiTableCell-root-id MuiTableCell-body-id TableCellAvatar-root-id ProductVariantNavigation-colAvatar-id ProductVariantNavigation-tabActive-id ProductVariantNavigation-noHandle-id ProductVariantNavigation-firstVariant-id"
colspan="2"
>
<div
@ -142849,7 +142995,7 @@ exports[`Storyshots Views / Products / Create product variant no warehouses 1`]
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
data-shrink="false"
>
Color
@ -142857,11 +143003,11 @@ exports[`Storyshots Views / Products / Create product variant no warehouses 1`]
<div
aria-autocomplete="list"
aria-expanded="false"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
role="combobox"
>
<input
aria-invalid="false"
aria-invalid="true"
autocomplete="off"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
type="text"
@ -144511,17 +144657,17 @@ exports[`Storyshots Views / Products / Create product variant with errors 1`] =
</legend>
</fieldset>
</div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
>
This field is required
</p>
</div>
</div>
</div>
<div
class="FormSpacer-spacer-id"
/>
<div
class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorError-id"
>
All attributes should have value
</div>
<div
class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorError-id"
>
@ -145955,7 +146101,7 @@ Ctrl + K"
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
data-shrink="true"
>
Value
@ -145963,11 +146109,11 @@ Ctrl + K"
<div
aria-autocomplete="list"
aria-expanded="false"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
role="combobox"
>
<input
aria-invalid="false"
aria-invalid="true"
autocomplete="off"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
type="text"
@ -146005,6 +146151,11 @@ Ctrl + K"
</legend>
</fieldset>
</div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
>
Invalid value
</p>
</div>
</div>
</div>
@ -173699,7 +173850,7 @@ exports[`Storyshots Views / Products / Product variant details attribute errors
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
data-shrink="true"
>
Borders
@ -173707,11 +173858,11 @@ exports[`Storyshots Views / Products / Product variant details attribute errors
<div
aria-autocomplete="list"
aria-expanded="false"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-adornedEnd-id MuiOutlinedInput-adornedEnd-id"
role="combobox"
>
<input
aria-invalid="false"
aria-invalid="true"
autocomplete="off"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
type="text"
@ -173749,6 +173900,11 @@ exports[`Storyshots Views / Products / Product variant details attribute errors
</legend>
</fieldset>
</div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
>
This field is required
</p>
</div>
</div>
<div
@ -173815,11 +173971,6 @@ exports[`Storyshots Views / Products / Product variant details attribute errors
<div
class="FormSpacer-spacer-id"
/>
<div
class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorError-id"
>
All attributes should have value
</div>
<div
class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorError-id"
>

27
src/storybook/stories/products/ProductCreatePage.tsx
View file

@ -68,13 +68,23 @@ storiesOf("Views / Products / Create product", module)
<ProductCreatePage
currency="USD"
disabled={false}
errors={(["name", "productType", "category", "sku"] as Array<
keyof ProductCreatePageSubmitData
>).map(field => ({
__typename: "ProductError",
code: ProductErrorCode.INVALID,
field
}))}
errors={([
"attributes",
"name",
"productType",
"category",
"sku"
] as Array<keyof ProductCreatePageSubmitData | "attributes">).map(
field => ({
__typename: "ProductError",
attributes:
field === "attributes"
? [productTypes[0].productAttributes[0].id]
: null,
code: ProductErrorCode.INVALID,
field
})
)}
header="Add product"
collections={product.collections}
fetchCategories={() => undefined}
@ -83,6 +93,9 @@ storiesOf("Views / Products / Create product", module)
fetchMoreCategories={fetchMoreProps}
fetchMoreCollections={fetchMoreProps}
fetchMoreProductTypes={fetchMoreProps}
initial={{
productType: productTypes[0].id
}}
productTypes={productTypes}
categories={[product.category]}
onBack={() => undefined}

6
src/storybook/stories/products/ProductUpdatePage.tsx
View file

@ -152,8 +152,10 @@ storiesOf("Views / Products / Product edit", module)
] as Array<keyof ProductUpdatePageFormData | "attributes">).map(
field => ({
__typename: "ProductError",
attributeId:
field === "attributes" ? product.attributes[0].attribute.id : null,
attributes:
field === "attributes"
? [product.attributes[0].attribute.id]
: null,
code: ProductErrorCode.INVALID,
field
})

6
src/storybook/stories/products/ProductVariantCreatePage.tsx
View file

@ -36,17 +36,17 @@ storiesOf("Views / Products / Create product variant", module)
disabled={false}
errors={[
{
attributeId: product.productType.variantAttributes[0].id,
attributes: [product.productType.variantAttributes[0].id],
code: ProductErrorCode.REQUIRED,
field: "attributes"
},
{
attributeId: null,
attributes: null,
code: ProductErrorCode.UNIQUE,
field: "attributes"
},
{
attributeId: null,
attributes: null,
code: ProductErrorCode.ALREADY_EXISTS,
field: "sku"
}

6
src/storybook/stories/products/ProductVariantPage.tsx
View file

@ -86,17 +86,17 @@ storiesOf("Views / Products / Product variant details", module)
saveButtonBarState="default"
errors={[
{
attributeId: variant.attributes[0].attribute.id,
attributes: [variant.attributes[0].attribute.id],
code: ProductErrorCode.REQUIRED,
field: "attributes"
},
{
attributeId: null,
attributes: null,
code: ProductErrorCode.UNIQUE,
field: "attributes"
},
{
attributeId: null,
attributes: null,
code: ProductErrorCode.ALREADY_EXISTS,
field: "sku"
}

1
src/types/globalTypes.ts
View file

@ -705,6 +705,7 @@ export enum ProductErrorCode {
INVALID = "INVALID",
NOT_FOUND = "NOT_FOUND",
NOT_PRODUCTS_IMAGE = "NOT_PRODUCTS_IMAGE",
NOT_PRODUCTS_VARIANT = "NOT_PRODUCTS_VARIANT",
REQUIRED = "REQUIRED",
UNIQUE = "UNIQUE",
VARIANT_NO_DIGITAL_CONTENT = "VARIANT_NO_DIGITAL_CONTENT",