diff --git a/.changeset/yummy-socks-greet.md b/.changeset/yummy-socks-greet.md new file mode 100644 index 00000000..f8c12fc5 --- /dev/null +++ b/.changeset/yummy-socks-greet.md @@ -0,0 +1,5 @@ +--- +"@saleor/app-sdk": patch +--- + +Added missing seoName and seoDescriptiont to formPayload action diff --git a/src/app-bridge/app-bridge.test.ts b/src/app-bridge/app-bridge.test.ts index 81affb4b..80ca1514 100644 --- a/src/app-bridge/app-bridge.test.ts +++ b/src/app-bridge/app-bridge.test.ts @@ -9,6 +9,8 @@ import { AppBridge, DashboardEventFactory, DispatchResponseEvent, + FormPayloadProductEdit, + FormPayloadProductTranslate, HandshakeEvent, ThemeEvent, } from "."; @@ -330,7 +332,7 @@ describe("AppBridge", () => { it("Updates state with form context when form payload event is received", () => { expect(appBridge.getState().formContext).toEqual({}); - const formPayload = { + const formPayload: FormPayloadProductTranslate = { form: "product-translate" as const, productId: "product-123", translationLanguage: "es", @@ -343,6 +345,27 @@ describe("AppBridge", () => { currentValue: "Original Product", type: "short-text" as const, }, + productDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, }, }; @@ -373,7 +396,7 @@ describe("AppBridge", () => { expect(callback).not.toHaveBeenCalled(); - const formPayload = { + const formPayload: FormPayloadProductTranslate = { form: "product-translate" as const, productId: "product-456", translationLanguage: "fr", @@ -386,6 +409,27 @@ describe("AppBridge", () => { currentValue: "Description", type: "editorjs" as const, }, + productName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, }, }; @@ -435,7 +479,7 @@ describe("AppBridge", () => { }); it("Updates form context with new fields when multiple form events are received", () => { - const firstFormPayload = { + const firstFormPayload: FormPayloadProductTranslate = { form: "product-translate" as const, productId: "product-1", translationLanguage: "es", @@ -448,6 +492,27 @@ describe("AppBridge", () => { currentValue: "Product 1", type: "short-text" as const, }, + productDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, }, }; @@ -461,7 +526,7 @@ describe("AppBridge", () => { expect(appBridge.getState().formContext?.["product-translate"]?.productId).toBe("product-1"); - const secondFormPayload = { + const secondFormPayload: FormPayloadProductTranslate = { form: "product-translate" as const, productId: "product-2", translationLanguage: "fr", @@ -474,6 +539,27 @@ describe("AppBridge", () => { currentValue: "Product 2", type: "short-text" as const, }, + productDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, }, }; @@ -497,7 +583,7 @@ describe("AppBridge", () => { it("Stores multiple form contexts for different form types simultaneously", () => { expect(appBridge.getState().formContext).toEqual({}); - const productTranslatePayload = { + const productTranslatePayload: FormPayloadProductTranslate = { form: "product-translate" as const, productId: "product-123", translationLanguage: "es", @@ -510,10 +596,31 @@ describe("AppBridge", () => { currentValue: "Original Product", type: "short-text" as const, }, + productDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "editorjs", + }, + seoName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "editorjs", + }, }, }; - const productEditPayload = { + const productEditPayload: FormPayloadProductEdit = { form: "product-edit" as const, productId: "product-456", fields: { diff --git a/src/app-bridge/events.test.ts b/src/app-bridge/events.test.ts index aa5316c5..9470e2be 100644 --- a/src/app-bridge/events.test.ts +++ b/src/app-bridge/events.test.ts @@ -1,5 +1,7 @@ import { describe, expect, it } from "vitest"; +import { FormPayloadProductTranslate } from "@/app-bridge/form-payload"; + import { DashboardEventFactory } from "./events"; describe("DashboardEventFactory", () => { @@ -67,7 +69,7 @@ describe("DashboardEventFactory", () => { }); it("Creates form payload event for product translation", () => { - const formPayload = { + const formPayload: FormPayloadProductTranslate = { form: "product-translate" as const, productId: "product-123", translationLanguage: "es", @@ -87,6 +89,20 @@ describe("DashboardEventFactory", () => { currentValue: "Original description", type: "editorjs" as const, }, + seoName: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, + seoDescription: { + fieldName: "", + originalValue: "", + translatedValue: "", + currentValue: "", + type: "short-text", + }, }, }; @@ -95,37 +111,4 @@ describe("DashboardEventFactory", () => { payload: formPayload, }); }); - - it("Creates form payload event with all translation field types", () => { - const formPayload = { - form: "product-translate" as const, - productId: "product-456", - translationLanguage: "fr", - currentLanguage: "en", - fields: { - shortTextField: { - fieldName: "shortTextField", - originalValue: "Short text", - translatedValue: "Texte court", - currentValue: "Short text", - type: "short-text" as const, - }, - editorField: { - fieldName: "editorField", - originalValue: "{\"blocks\": []}", - translatedValue: "{\"blocks\": []}", - currentValue: "{\"blocks\": []}", - type: "editorjs" as const, - }, - }, - }; - - const event = DashboardEventFactory.createFormEvent(formPayload); - - expect(event.type).toBe("formPayload"); - if (event.payload.form === "product-translate") { - expect(event.payload.fields.shortTextField.type).toBe("short-text"); - expect(event.payload.fields.editorField.type).toBe("editorjs"); - } - }); }); diff --git a/src/app-bridge/form-payload.ts b/src/app-bridge/form-payload.ts index 9bcdcd0d..92049af0 100644 --- a/src/app-bridge/form-payload.ts +++ b/src/app-bridge/form-payload.ts @@ -31,12 +31,15 @@ type TranslationField = { type TranslationPayloadBase = { translationLanguage: string; currentLanguage: string; - fields: Record; }; export type FormPayloadProductTranslate = TranslationPayloadBase & ProductPayloadBase & { form: "product-translate"; + fields: Record< + "productName" | "productDescription" | "seoName" | "seoDescription", + TranslationField + >; }; export type FormPayloadUpdatePayloadProductTranslate = BaseFormPayloadUpdatePayload & {