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

Update submit next action logic

Browse source
This commit is contained in:
Dawid Tarasiuk 2020-09-22 12:32:17 +02:00
parent 1aaa5c5c3a
commit e8e1162698
9 changed files with 168 additions and 125 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -106,9 +106,11 @@ interface ProductCreatePageProps {
fetchCollections: (data: string) => void;
fetchProductTypes: (data: string) => void;
onBack?();
onSubmit?(data: ProductCreatePageSubmitData);
onSubmitReject?(nextAction?: ProductCreatePageSubmitNextAction);
setSubmitNextAction?(nextAction: ProductCreatePageSubmitNextAction);
onSubmit?(
data: ProductCreatePageSubmitData,
nextAction?: ProductCreatePageSubmitNextAction
);
onSubmitSkip?(nextAction?: ProductCreatePageSubmitNextAction);
}
export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
@ -131,9 +133,7 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
fetchProductTypes,
weightUnit,
onSubmit,
onSubmitReject,
submitNextAction,
setSubmitNextAction
onSubmitSkip
}: ProductCreatePageProps) => {
const intl = useIntl();
const localizeDate = useDateLocalize();
@ -210,12 +210,21 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
value: taxType.taxCode
})) || [];
const handleSubmit = (data: FormData) =>
onSubmit({
...data,
attributes,
stocks
});
const [modalWithAction, setModalWithAction] = React.useState<
ProductCreatePageSubmitNextAction
>(null);
const handleSubmit = (data: FormData) => {
onSubmit(
{
...data,
attributes,
stocks
},
modalWithAction
);
setModalWithAction(null);
};
return (
<Form onSubmit={handleSubmit} initial={initialData} confirmLeave>
@ -331,9 +340,10 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
removeStock(id);
}}
onWarehouseConfigure={() => {
setSubmitNextAction("warehouse-configure");
if (disabled || !onSubmit || !hasChanged) {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
} else {
setModalWithAction("warehouse-configure");
}
}}
/>
@ -429,10 +439,10 @@ export const ProductCreatePage: React.FC<ProductCreatePageProps> = ({
submit();
}}
onRejectChanges={() => {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
}}
onClose={() => setSubmitNextAction(null)}
open={submitNextAction === "warehouse-configure"}
onClose={() => setModalWithAction(null)}
open={modalWithAction === "warehouse-configure"}
confirmButtonState={saveButtonBarState}
/>
</Container>

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

@ -88,9 +88,11 @@ export interface ProductUpdatePageProps extends ListActions {
onImageReorder?(event: { oldIndex: number; newIndex: number });
onImageUpload(file: File);
onSeoClick?();
onSubmit?(data: ProductUpdatePageSubmitData);
onSubmitReject?(nextAction?: ProductUpdatePageSubmitNextAction);
setSubmitNextAction?(nextAction: ProductUpdatePageSubmitNextAction);
onSubmit?(
data: ProductUpdatePageSubmitData,
nextAction?: ProductUpdatePageSubmitNextAction
);
onSubmitSkip?(nextAction?: ProductUpdatePageSubmitNextAction);
onVariantAdd?();
onSetDefaultVariant();
onWarehouseConfigure();
@ -130,7 +132,7 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
onImageUpload,
onSeoClick,
onSubmit,
onSubmitReject,
onSubmitSkip,
onVariantAdd,
onVariantsAdd,
onSetDefaultVariant,
@ -140,9 +142,7 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
selected,
toggle,
toggleAll,
toolbar,
submitNextAction,
setSubmitNextAction
toolbar
}) => {
const intl = useIntl();
const localizeDate = useDateLocalize();
@ -201,6 +201,10 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
value: taxType.taxCode
})) || [];
const [modalWithAction, setModalWithAction] = React.useState<
ProductUpdatePageSubmitNextAction
>(null);
const handleSubmit = (data: ProductUpdatePageFormData) => {
const metadata = isMetadataModified ? data.metadata : undefined;
const privateMetadata = isPrivateMetadataModified
@ -208,15 +212,18 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
: undefined;
if (product.productType.hasVariants) {
onSubmit({
...data,
addStocks: [],
attributes,
metadata,
privateMetadata,
removeStocks: [],
updateStocks: []
});
onSubmit(
{
...data,
addStocks: [],
attributes,
metadata,
privateMetadata,
removeStocks: [],
updateStocks: []
},
modalWithAction
);
} else {
const dataStocks = stocks.map(stock => stock.id);
const variantStocks = product.variants[0]?.stocks.map(
@ -224,20 +231,25 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
);
const stockDiff = diff(variantStocks, dataStocks);
onSubmit({
...data,
addStocks: stocks.filter(stock =>
stockDiff.added.some(addedStock => addedStock === stock.id)
),
attributes,
metadata,
privateMetadata,
removeStocks: stockDiff.removed,
updateStocks: stocks.filter(
stock => !stockDiff.added.some(addedStock => addedStock === stock.id)
)
});
onSubmit(
{
...data,
addStocks: stocks.filter(stock =>
stockDiff.added.some(addedStock => addedStock === stock.id)
),
attributes,
metadata,
privateMetadata,
removeStocks: stockDiff.removed,
updateStocks: stocks.filter(
stock =>
!stockDiff.added.some(addedStock => addedStock === stock.id)
)
},
modalWithAction
);
}
setModalWithAction(null);
};
return (
@ -381,9 +393,10 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
removeStock(id);
}}
onWarehouseConfigure={() => {
setSubmitNextAction("warehouse-configure");
if (disabled || !onSubmit || !hasChanged) {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
} else {
setModalWithAction("warehouse-configure");
}
}}
/>
@ -480,10 +493,10 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
submit();
}}
onRejectChanges={() => {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
}}
onClose={() => setSubmitNextAction(null)}
open={submitNextAction === "warehouse-configure"}
onClose={() => setModalWithAction(null)}
open={modalWithAction === "warehouse-configure"}
confirmButtonState={saveButtonBarState}
/>
</Container>

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

@ -57,14 +57,13 @@ interface ProductVariantCreatePageProps {
saveButtonBarState: ConfirmButtonTransitionState;
warehouses: SearchWarehouses_search_edges_node[];
weightUnit: string;
submitNextAction?: ProductVariantCreatePageSubmitNextAction;
onBack: () => void;
onSubmit: (data: ProductVariantCreatePageSubmitData) => void;
onSubmitReject?: (
onSubmit: (
data: ProductVariantCreatePageSubmitData,
nextAction?: ProductVariantCreatePageSubmitNextAction
) => void;
setSubmitNextAction?: (
nextAction: ProductVariantCreatePageSubmitNextAction
onSubmitSkip?: (
nextAction?: ProductVariantCreatePageSubmitNextAction
) => void;
onVariantClick: (variantId: string) => void;
onVariantReorder: ReorderAction;
@ -81,11 +80,9 @@ const ProductVariantCreatePage: React.FC<ProductVariantCreatePageProps> = ({
weightUnit,
onBack,
onSubmit,
onSubmitReject,
onSubmitSkip,
onVariantClick,
onVariantReorder,
submitNextAction,
setSubmitNextAction
onVariantReorder
}) => {
const intl = useIntl();
const attributeInput = React.useMemo(
@ -117,12 +114,21 @@ const ProductVariantCreatePage: React.FC<ProductVariantCreatePageProps> = ({
weight: ""
};
const handleSubmit = (data: ProductVariantCreatePageFormData) =>
onSubmit({
...data,
attributes,
stocks
});
const [modalWithAction, setModalWithAction] = React.useState<
ProductVariantCreatePageSubmitNextAction
>(null);
const handleSubmit = (data: ProductVariantCreatePageFormData) => {
onSubmit(
{
...data,
attributes,
stocks
},
modalWithAction
);
setModalWithAction(null);
};
return (
<Form initial={initialForm} onSubmit={handleSubmit}>
@ -202,9 +208,10 @@ const ProductVariantCreatePage: React.FC<ProductVariantCreatePageProps> = ({
removeStock(id);
}}
onWarehouseConfigure={() => {
setSubmitNextAction("warehouse-configure");
if (disabled || !onSubmit || !hasChanged) {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
} else {
setModalWithAction("warehouse-configure");
}
}}
/>
@ -233,10 +240,10 @@ const ProductVariantCreatePage: React.FC<ProductVariantCreatePageProps> = ({
submit();
}}
onRejectChanges={() => {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
}}
onClose={() => setSubmitNextAction(null)}
open={submitNextAction === "warehouse-configure"}
onClose={() => setModalWithAction(null)}
open={modalWithAction === "warehouse-configure"}
confirmButtonState={saveButtonBarState}
/>
</Container>

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

@ -65,14 +65,15 @@ interface ProductVariantPageProps {
placeholderImage?: string;
header: string;
warehouses: WarehouseFragment[];
submitNextAction?: ProductVariantPageSubmitNextAction;
onVariantReorder: ReorderAction;
onAdd();
onBack();
onDelete();
onSubmit(data: ProductVariantPageSubmitData);
onSubmitReject?(nextAction?: ProductVariantPageSubmitNextAction);
setSubmitNextAction?(nextAction: ProductVariantPageSubmitNextAction);
onSubmit(
data: ProductVariantPageSubmitData,
nextAction?: ProductVariantPageSubmitNextAction
);
onSubmitSkip?(nextAction?: ProductVariantPageSubmitNextAction);
onImageSelect(id: string);
onVariantClick(variantId: string);
onSetDefaultVariant();
@ -93,13 +94,11 @@ const ProductVariantPage: React.FC<ProductVariantPageProps> = ({
onDelete,
onImageSelect,
onSubmit,
onSubmitReject,
onSubmitSkip,
onVariantClick,
onVariantReorder,
onSetDefaultVariant,
onWarehouseConfigure,
submitNextAction,
setSubmitNextAction
onWarehouseConfigure
}) => {
const attributeInput = React.useMemo(
() => getAttributeInputFromVariant(variant),
@ -149,6 +148,10 @@ const ProductVariantPage: React.FC<ProductVariantPageProps> = ({
weight: variant?.weight?.value.toString() || ""
};
const [modalWithAction, setModalWithAction] = React.useState<
ProductVariantPageSubmitNextAction
>(null);
const handleSubmit = (data: ProductVariantPageFormData) => {
const dataStocks = stocks.map(stock => stock.id);
const variantStocks = variant.stocks.map(stock => stock.warehouse.id);
@ -158,19 +161,23 @@ const ProductVariantPage: React.FC<ProductVariantPageProps> = ({
? data.privateMetadata
: undefined;
onSubmit({
...data,
addStocks: stocks.filter(stock =>
stockDiff.added.some(addedStock => addedStock === stock.id)
),
attributes,
metadata,
privateMetadata,
removeStocks: stockDiff.removed,
updateStocks: stocks.filter(
stock => !stockDiff.added.some(addedStock => addedStock === stock.id)
)
});
onSubmit(
{
...data,
addStocks: stocks.filter(stock =>
stockDiff.added.some(addedStock => addedStock === stock.id)
),
attributes,
metadata,
privateMetadata,
removeStocks: stockDiff.removed,
updateStocks: stocks.filter(
stock => !stockDiff.added.some(addedStock => addedStock === stock.id)
)
},
modalWithAction
);
setModalWithAction(null);
};
return (
@ -276,9 +283,10 @@ const ProductVariantPage: React.FC<ProductVariantPageProps> = ({
removeStock(id);
}}
onWarehouseConfigure={() => {
setSubmitNextAction("warehouse-configure");
if (!onSubmit || !hasChanged) {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
} else {
setModalWithAction("warehouse-configure");
}
}}
/>
@ -298,10 +306,10 @@ const ProductVariantPage: React.FC<ProductVariantPageProps> = ({
submit();
}}
onRejectChanges={() => {
onSubmitReject("warehouse-configure");
onSubmitSkip("warehouse-configure");
}}
onClose={() => setSubmitNextAction(null)}
open={submitNextAction === "warehouse-configure"}
onClose={() => setModalWithAction(null)}
open={modalWithAction === "warehouse-configure"}
confirmButtonState={saveButtonBarState}
/>
</>

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

@ -97,7 +97,12 @@ export const ProductCreateView: React.FC<ProductCreateViewProps> = ({}) => {
}
});
const handleCreate = async (formData: ProductCreatePageSubmitData) => {
const handleCreate = async (
formData: ProductCreatePageSubmitData,
nextAction?: ProductCreatePageSubmitNextAction
) => {
setSubmitNextAction(nextAction);
const result = await productCreate({
variables: {
input: {
@ -198,15 +203,15 @@ export const ProductCreateView: React.FC<ProductCreateViewProps> = ({}) => {
edge => edge.node
)}
onBack={handleBack}
onSubmit={async data => {
const errors = await handleSubmit(data);
onSubmit={async (data, nextAction) => {
const errors = await handleSubmit(data, nextAction);
if (errors?.length === 0) {
handleSubmitNextAction();
handleSubmitNextAction(nextAction);
} else {
setSubmitNextAction(null);
}
}}
onSubmitReject={handleSubmitNextAction}
onSubmitSkip={handleSubmitNextAction}
saveButtonBarState={productCreateOpts.status}
fetchMoreCategories={{
hasMore: searchCategoryOpts.data?.search.pageInfo.hasNextPage,
@ -223,8 +228,6 @@ export const ProductCreateView: React.FC<ProductCreateViewProps> = ({}) => {
loading: searchProductTypesOpts.loading,
onFetchMore: loadMoreProductTypes
}}
submitNextAction={submitNextAction}
setSubmitNextAction={setSubmitNextAction}
warehouses={
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}

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

@ -318,15 +318,15 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
onBack={handleBack}
onDelete={() => openModal("remove")}
onImageReorder={handleImageReorder}
onSubmit={async data => {
onSubmit={async (data, nextAction) => {
const errors = await handleSubmit(data);
if (errors?.length === 0) {
handleSubmitNextAction();
handleSubmitNextAction(nextAction);
} else {
setSubmitNextAction(null);
}
}}
onSubmitReject={handleSubmitNextAction}
onSubmitSkip={handleSubmitNextAction}
onVariantAdd={handleVariantAdd}
onVariantsAdd={() => navigate(productVariantCreatorUrl(id))}
onVariantShow={variantId => () =>
@ -365,8 +365,6 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
loading: searchCollectionsOpts.loading,
onFetchMore: loadMoreCollections
}}
submitNextAction={submitNextAction}
setSubmitNextAction={setSubmitNextAction}
/>
<ActionDialog
open={params.action === "remove"}

8
src/products/views/ProductVariant.tsx
View file

@ -231,21 +231,19 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
onBack={handleBack}
onDelete={() => openModal("remove")}
onImageSelect={handleImageSelect}
onSubmit={async data => {
onSubmit={async (data, nextAction) => {
const errors = await handleSubmit(data);
if (errors?.length === 0) {
handleSubmitNextAction();
handleSubmitNextAction(nextAction);
} else {
setSubmitNextAction(null);
}
}}
onSubmitReject={handleSubmitNextAction}
onSubmitSkip={handleSubmitNextAction}
onVariantClick={variantId => {
navigate(productVariantEditUrl(productId, variantId));
}}
onVariantReorder={handleVariantReorder}
submitNextAction={submitNextAction}
setSubmitNextAction={setSubmitNextAction}
/>
<ProductVariantDeleteDialog
confirmButtonState={deleteVariantOpts.status}

17
src/products/views/ProductVariantCreate.tsx
View file

@ -91,7 +91,12 @@ export const ProductVariant: React.FC<ProductVariantCreateProps> = ({
);
const handleBack = () => navigate(productUrl(productId));
const handleCreate = async (formData: ProductVariantCreatePageSubmitData) => {
const handleCreate = async (
formData: ProductVariantCreatePageSubmitData,
nextAction?: ProductVariantCreatePageSubmitNextAction
) => {
setSubmitNextAction(nextAction);
const result = await variantCreate({
variables: {
input: {
@ -160,15 +165,15 @@ export const ProductVariant: React.FC<ProductVariantCreateProps> = ({
})}
product={data?.product}
onBack={handleBack}
onSubmit={async data => {
const errors = await handleSubmit(data);
onSubmit={async (data, nextAction) => {
const errors = await handleSubmit(data, nextAction);
if (errors?.length === 0) {
handleSubmitNextAction();
handleSubmitNextAction(nextAction);
} else {
setSubmitNextAction(null);
}
}}
onSubmitReject={handleSubmitNextAction}
onSubmitSkip={handleSubmitNextAction}
onVariantClick={handleVariantClick}
onVariantReorder={handleVariantReorder}
saveButtonBarState={variantCreateResult.status}
@ -176,8 +181,6 @@ export const ProductVariant: React.FC<ProductVariantCreateProps> = ({
warehouses.data?.warehouses.edges.map(edge => edge.node) || []
}
weightUnit={shop?.defaultWeightUnit}
submitNextAction={submitNextAction}
setSubmitNextAction={setSubmitNextAction}
/>
</>
);

11
src/utils/handlers/metadataCreateHandler.ts
View file

@ -10,16 +10,19 @@ import {
UpdatePrivateMetadataVariables
} from "../metadata/types/UpdatePrivateMetadata";
function createMetadataCreateHandler<T extends MetadataFormData>(
create: (data: T) => Promise<string>,
function createMetadataCreateHandler<
T extends MetadataFormData,
N extends string
>(
create: (data: T, nextAction?: N) => Promise<string>,
setMetadata: MutationFunction<UpdateMetadata, UpdateMetadataVariables>,
setPrivateMetadata: MutationFunction<
UpdatePrivateMetadata,
UpdatePrivateMetadataVariables
>
) {
return async (data: T) => {
const id = await create(data);
return async (data: T, nextAction?: N) => {
const id = await create(data, nextAction);
if (id === null) {
return null;