diff --git a/locale/defaultMessages.json b/locale/defaultMessages.json index dd8396de0..8f0e43968 100644 --- a/locale/defaultMessages.json +++ b/locale/defaultMessages.json @@ -6931,6 +6931,10 @@ "context": "window title", "string": "Create Variants" }, + "src_dot_products_dot_views_dot_variantCreatedSuccess": { + "context": "variant created success message", + "string": "Variant created" + }, "src_dot_properties": { "string": "Properties" }, diff --git a/src/products/views/ProductVariantCreate.tsx b/src/products/views/ProductVariantCreate.tsx index 3a1b7ebbf..a46857ff7 100644 --- a/src/products/views/ProductVariantCreate.tsx +++ b/src/products/views/ProductVariantCreate.tsx @@ -9,6 +9,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle"; import { DEFAULT_INITIAL_SEARCH_DATA } from "@saleor/config"; import { useFileUploadMutation } from "@saleor/files/mutations"; import useNavigator from "@saleor/hooks/useNavigator"; +import useNotifier from "@saleor/hooks/useNotifier"; import useShop from "@saleor/hooks/useShop"; import usePageSearch from "@saleor/searches/usePageSearch"; import useProductSearch from "@saleor/searches/useProductSearch"; @@ -32,6 +33,7 @@ import { useVariantCreateMutation } from "../mutations"; import { useProductVariantCreateQuery } from "../queries"; +import { VariantCreate } from "../types/VariantCreate"; import { productListUrl, productUrl, @@ -39,6 +41,7 @@ import { ProductVariantAddUrlQueryParams, productVariantEditUrl } from "../urls"; +import { variantCreateMessages as messages } from "./messages"; import { createVariantReorderHandler } from "./ProductUpdate/handlers"; interface ProductVariantCreateProps { @@ -51,6 +54,8 @@ export const ProductVariant: React.FC = ({ params }) => { const navigate = useNavigator(); + const notify = useNotifier(); + const shop = useShop(); const intl = useIntl(); const warehouses = useWarehouseList({ @@ -72,7 +77,21 @@ export const ProductVariant: React.FC = ({ const product = data?.product; - const [variantCreate, variantCreateResult] = useVariantCreateMutation({}); + const handleVariantCreationSuccess = (data: VariantCreate) => { + const variantId = data.productVariantCreate.productVariant.id; + + notify({ + status: "success", + text: intl.formatMessage(messages.variantCreatedSuccess) + }); + navigate(productVariantEditUrl(productId, variantId), { + resetScroll: true + }); + }; + + const [variantCreate, variantCreateResult] = useVariantCreateMutation({ + onCompleted: handleVariantCreationSuccess + }); const [updateMetadata] = useMetadataUpdate({}); const [updatePrivateMetadata] = usePrivateMetadataUpdate({}); diff --git a/src/products/views/messages.ts b/src/products/views/messages.ts new file mode 100644 index 000000000..bd6d4ed4f --- /dev/null +++ b/src/products/views/messages.ts @@ -0,0 +1,8 @@ +import { defineMessages } from "react-intl"; + +export const variantCreateMessages = defineMessages({ + variantCreatedSuccess: { + defaultMessage: "Variant created", + description: "variant created success message" + } +});