Fix delete draft voucher code on voucher create page (#5104)

* Fix delete draft voucher code on voucher create page * Add changeset * Fix import --------- Co-authored-by: Patryk Andrzejewski <[email protected]>
saleor · Aug 12, 2024 · 6289fbd · 6289fbd
1 parent 9434aea
commit 6289fbd
Show file tree

Hide file tree

Showing 6 changed files with 68 additions and 11 deletions.
diff --git a/.changeset/stale-ligers-relate.md b/.changeset/stale-ligers-relate.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+You can now delete draft voucher codes during creation of new voucher
diff --git a/src/discounts/components/VoucherCodes/utils.test.ts b/src/discounts/components/VoucherCodes/utils.test.ts
@@ -2,6 +2,7 @@ import { hasSavedVoucherCodesToDelete } from "./utils";
 
 describe("hasSavedVoucherCodesToDelete", () => {
   it("should return true if there are saved voucher codes to delete", () => {
+    // Arrange
     const voucherCodesIdsToDelete = ["voucherCode1", "voucherCode2"];
     const voucherCodes = [
       {
@@ -18,9 +19,14 @@ describe("hasSavedVoucherCodesToDelete", () => {
       },
     ];
 
-    expect(hasSavedVoucherCodesToDelete(voucherCodesIdsToDelete, voucherCodes)).toBe(true);
+    // Act
+    const result = hasSavedVoucherCodesToDelete(voucherCodesIdsToDelete, voucherCodes);
+
+    // Assert
+    expect(result).toBe(true);
   });
   it("should return false if there are no saved voucher codes to delete", () => {
+    // Arrange
     const voucherCodesIdsToDelete = ["voucherCode1", "voucherCode2"];
     const voucherCodes = [
       {
@@ -33,6 +39,10 @@ describe("hasSavedVoucherCodesToDelete", () => {
       },
     ];
 
-    expect(hasSavedVoucherCodesToDelete(voucherCodesIdsToDelete, voucherCodes)).toBe(false);
+    // Act
+    const result = hasSavedVoucherCodesToDelete(voucherCodesIdsToDelete, voucherCodes);
+
+    // Assert
+    expect(result).toBe(false);
   });
 });
diff --git a/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx b/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx
@@ -32,7 +32,7 @@ import VoucherValue from "../VoucherValue";
 import { initialForm } from "./const";
 import { useVoucherCodesPagination } from "./hooks/useVoucherCodesPagination";
 import { useVoucherCodesSelection } from "./hooks/useVoucherCodesSelection";
-import { generateMultipleIds, voucherCodeExists } from "./utils";
+import { generateDraftVoucherCode, generateMultipleVoucherCodes, voucherCodeExists } from "./utils";
 
 export interface FormData extends VoucherDetailsPageFormData {
   value: number;
@@ -95,7 +95,7 @@ const VoucherCreatePage: React.FC<VoucherCreatePageProps> = ({
     clearRowSelection();
     triggerChange(true);
     set({
-      codes: [...generateMultipleIds(quantity, prefix), ...data.codes],
+      codes: [...generateMultipleVoucherCodes(quantity, prefix), ...data.codes],
     });
   };
   const handleDeleteVoucherCodes = () => {
@@ -111,7 +111,7 @@ const VoucherCreatePage: React.FC<VoucherCreatePageProps> = ({
 
     triggerChange(true);
     set({
-      codes: [{ code }, ...data.codes],
+      codes: [generateDraftVoucherCode(code), ...data.codes],
     });
   };
   const { pagination, paginatedCodes, settings, onSettingsChange } = useVoucherCodesPagination(

diff --git a/src/discounts/components/VoucherCreatePage/utils.test.ts b/src/discounts/components/VoucherCreatePage/utils.test.ts
@@ -0,0 +1,36 @@
+import {
+  generateDraftVoucherCode,
+  generateMultipleVoucherCodes,
+} from "@dashboard/discounts/components/VoucherCreatePage/utils";
+import { v4 as uuidv4 } from "uuid";
+
+jest.mock("uuid");
+
+describe("generateDraftVoucherCode", () => {
+  it("should return draft voucher code", () => {
+    // Act
+    const draftVoucherCode = generateDraftVoucherCode("test1");
+
+    // Assert
+    expect(draftVoucherCode).toEqual({
+      code: "test1",
+      status: "Draft",
+    });
+  });
+});
+
+describe("generateMultipleVoucherCodes", () => {
+  it("should return multiple voucher codes", () => {
+    // Arrange
+    (uuidv4 as jest.Mock).mockImplementation(() => "uuid");
+
+    // Act
+    const draftVoucherCodes = generateMultipleVoucherCodes("2", "test");
+
+    // Assert
+    expect(draftVoucherCodes).toEqual([
+      { code: "test-uuid", status: "Draft" },
+      { code: "test-uuid", status: "Draft" },
+    ]);
+  });
+});
diff --git a/src/discounts/components/VoucherCreatePage/utils.ts b/src/discounts/components/VoucherCreatePage/utils.ts
@@ -2,11 +2,17 @@ import { v4 as uuidv4 } from "uuid";
 
 import { VoucherCode } from "../VoucherCodesDatagrid/types";
 
-export const generateMultipleIds = (quantity: string, prefix?: string) => {
-  return Array.from({ length: Number(quantity) }).map(() => ({
-    code: prefix ? `${prefix}-${uuidv4()}` : uuidv4(),
+export const generateDraftVoucherCode = (code: string) => {
+  return {
+    code,
     status: "Draft",
-  }));
+  };
+};
+
+export const generateMultipleVoucherCodes = (quantity: string, prefix?: string) => {
+  return Array.from({ length: Number(quantity) }).map(() =>
+    generateDraftVoucherCode(prefix ? `${prefix}-${uuidv4()}` : uuidv4()),
+  );
 };
 
 export const voucherCodeExists = (code: string, voucherCodes: VoucherCode[]) => {

diff --git a/src/discounts/views/VoucherDetails/hooks/useVoucherCodesClient.ts b/src/discounts/views/VoucherDetails/hooks/useVoucherCodesClient.ts
@@ -2,7 +2,7 @@ import { VoucherCode } from "@dashboard/discounts/components/VoucherCodesDatagri
 import { GenerateMultipleVoucherCodeFormData } from "@dashboard/discounts/components/VoucherCodesGenerateDialog";
 import { useVoucherCodesPagination } from "@dashboard/discounts/components/VoucherCreatePage/hooks/useVoucherCodesPagination";
 import {
-  generateMultipleIds,
+  generateMultipleVoucherCodes,
   voucherCodeExists,
 } from "@dashboard/discounts/components/VoucherCreatePage/utils";
 import { UseListSettings } from "@dashboard/hooks/useListSettings";
@@ -52,7 +52,7 @@ export const useVoucherCodesClient = (
     quantity,
     prefix,
   }: GenerateMultipleVoucherCodeFormData) => {
-    setAddedVoucherCodes(codes => [...generateMultipleIds(quantity, prefix), ...codes]);
+    setAddedVoucherCodes(codes => [...generateMultipleVoucherCodes(quantity, prefix), ...codes]);
     switchToClientPagination();
     resetPage();
   };