diff --git a/schema.graphql b/schema.graphql index e82c2e794..d497db28f 100644 --- a/schema.graphql +++ b/schema.graphql @@ -671,7 +671,7 @@ type Category implements Node & ObjectWithMetadata { seoDescription: String id: ID! name: String! - description: JSONString! + description: JSONString slug: String! parent: Category level: Int! @@ -746,7 +746,7 @@ type CategoryTranslatableContent implements Node { seoDescription: String id: ID! name: String! - description: JSONString! + description: JSONString descriptionJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `description` field instead.") translation(languageCode: LanguageCodeEnum!): CategoryTranslation category: Category @@ -763,7 +763,7 @@ type CategoryTranslation implements Node { seoDescription: String id: ID! name: String! - description: JSONString! + description: JSONString language: LanguageDisplay! descriptionJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `description` field instead.") } @@ -1050,7 +1050,7 @@ type Collection implements Node & ObjectWithMetadata { seoDescription: String id: ID! name: String! - description: JSONString! + description: JSONString slug: String! privateMetadata: [MetadataItem]! metadata: [MetadataItem]! @@ -1205,7 +1205,7 @@ type CollectionTranslatableContent implements Node { seoDescription: String id: ID! name: String! - description: JSONString! + description: JSONString descriptionJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `description` field instead.") translation(languageCode: LanguageCodeEnum!): CollectionTranslation collection: Collection @@ -1222,7 +1222,7 @@ type CollectionTranslation implements Node { seoDescription: String id: ID! name: String! - description: JSONString! + description: JSONString language: LanguageDisplay! descriptionJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `description` field instead.") } @@ -3307,7 +3307,7 @@ type Page implements Node & ObjectWithMetadata { seoDescription: String id: ID! title: String! - content: JSONString! + content: JSONString publicationDate: Date isPublished: Boolean! slug: String! @@ -3441,7 +3441,7 @@ type PageTranslatableContent implements Node { seoDescription: String id: ID! title: String! - content: JSONString! + content: JSONString contentJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `content` field instead.") translation(languageCode: LanguageCodeEnum!): PageTranslation page: Page @@ -3458,7 +3458,7 @@ type PageTranslation implements Node { seoDescription: String id: ID! title: String! - content: JSONString! + content: JSONString language: LanguageDisplay! contentJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `content` field instead.") } @@ -3834,7 +3834,7 @@ type Product implements Node & ObjectWithMetadata { seoTitle: String seoDescription: String name: String! - description: JSONString! + description: JSONString productType: ProductType! slug: String! category: Category @@ -4140,7 +4140,7 @@ type ProductTranslatableContent implements Node { seoTitle: String seoDescription: String name: String! - description: JSONString! + description: JSONString descriptionJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `description` field instead.") translation(languageCode: LanguageCodeEnum!): ProductTranslation product: Product @@ -4157,7 +4157,7 @@ type ProductTranslation implements Node { seoTitle: String seoDescription: String name: String! - description: JSONString! + description: JSONString language: LanguageDisplay! descriptionJson: JSONString @deprecated(reason: "Will be removed in Saleor 4.0. Use the `description` field instead.") } diff --git a/src/categories/types/CategoryCreate.ts b/src/categories/types/CategoryCreate.ts index 3a9b822b7..b1d7643e8 100644 --- a/src/categories/types/CategoryCreate.ts +++ b/src/categories/types/CategoryCreate.ts @@ -39,7 +39,7 @@ export interface CategoryCreate_categoryCreate_category { backgroundImage: CategoryCreate_categoryCreate_category_backgroundImage | null; name: string; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; parent: CategoryCreate_categoryCreate_category_parent | null; diff --git a/src/categories/types/CategoryDetails.ts b/src/categories/types/CategoryDetails.ts index d1c245f13..d4a4306a0 100644 --- a/src/categories/types/CategoryDetails.ts +++ b/src/categories/types/CategoryDetails.ts @@ -165,7 +165,7 @@ export interface CategoryDetails_category { backgroundImage: CategoryDetails_category_backgroundImage | null; name: string; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; parent: CategoryDetails_category_parent | null; diff --git a/src/categories/types/CategoryUpdate.ts b/src/categories/types/CategoryUpdate.ts index bfd4ec9c9..f45c6ca68 100644 --- a/src/categories/types/CategoryUpdate.ts +++ b/src/categories/types/CategoryUpdate.ts @@ -39,7 +39,7 @@ export interface CategoryUpdate_categoryUpdate_category { backgroundImage: CategoryUpdate_categoryUpdate_category_backgroundImage | null; name: string; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; parent: CategoryUpdate_categoryUpdate_category_parent | null; diff --git a/src/categories/views/CategoryCreate.tsx b/src/categories/views/CategoryCreate.tsx index a0f271eb2..a21e29a87 100644 --- a/src/categories/views/CategoryCreate.tsx +++ b/src/categories/views/CategoryCreate.tsx @@ -1,6 +1,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle"; import useNavigator from "@saleor/hooks/useNavigator"; import useNotifier from "@saleor/hooks/useNotifier"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import createMetadataCreateHandler from "@saleor/utils/handlers/metadataCreateHandler"; import { useMetadataUpdate, @@ -48,7 +49,7 @@ export const CategoryCreateView: React.FC = ({ const result = await createCategory({ variables: { input: { - description: JSON.stringify(formData.description), + description: getParsedDataForJsonStringField(formData.description), name: formData.name, seo: { description: formData.seoDescription, diff --git a/src/categories/views/CategoryDetails.tsx b/src/categories/views/CategoryDetails.tsx index e97265d89..b6ddb47a2 100644 --- a/src/categories/views/CategoryDetails.tsx +++ b/src/categories/views/CategoryDetails.tsx @@ -13,6 +13,7 @@ import usePaginator, { createPaginationState } from "@saleor/hooks/usePaginator"; import { commonMessages } from "@saleor/intl"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler"; import { mapNodeToChoice } from "@saleor/utils/maps"; @@ -188,7 +189,7 @@ export const CategoryDetails: React.FC = ({ id, input: { backgroundImageAlt: formData.backgroundImageAlt, - description: JSON.stringify(formData.description), + description: getParsedDataForJsonStringField(formData.description), name: formData.name, seo: { description: formData.seoDescription, diff --git a/src/collections/types/CollectionDetails.ts b/src/collections/types/CollectionDetails.ts index 3d8dca339..2b31df0ad 100644 --- a/src/collections/types/CollectionDetails.ts +++ b/src/collections/types/CollectionDetails.ts @@ -102,7 +102,7 @@ export interface CollectionDetails_collection { privateMetadata: (CollectionDetails_collection_privateMetadata | null)[]; backgroundImage: CollectionDetails_collection_backgroundImage | null; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; products: CollectionDetails_collection_products | null; diff --git a/src/collections/types/CollectionUpdate.ts b/src/collections/types/CollectionUpdate.ts index d0f28cc7f..45218fa1b 100644 --- a/src/collections/types/CollectionUpdate.ts +++ b/src/collections/types/CollectionUpdate.ts @@ -48,7 +48,7 @@ export interface CollectionUpdate_collectionUpdate_collection { privateMetadata: (CollectionUpdate_collectionUpdate_collection_privateMetadata | null)[]; backgroundImage: CollectionUpdate_collectionUpdate_collection_backgroundImage | null; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } diff --git a/src/collections/types/CreateCollection.ts b/src/collections/types/CreateCollection.ts index e660d3a20..208bfbcef 100644 --- a/src/collections/types/CreateCollection.ts +++ b/src/collections/types/CreateCollection.ts @@ -48,7 +48,7 @@ export interface CreateCollection_collectionCreate_collection { privateMetadata: (CreateCollection_collectionCreate_collection_privateMetadata | null)[]; backgroundImage: CreateCollection_collectionCreate_collection_backgroundImage | null; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } diff --git a/src/collections/views/CollectionCreate.tsx b/src/collections/views/CollectionCreate.tsx index 9995af199..df484059b 100644 --- a/src/collections/views/CollectionCreate.tsx +++ b/src/collections/views/CollectionCreate.tsx @@ -7,6 +7,7 @@ import useChannels from "@saleor/hooks/useChannels"; import useNavigator from "@saleor/hooks/useNavigator"; import useNotifier from "@saleor/hooks/useNotifier"; import { commonMessages } from "@saleor/intl"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createMetadataCreateHandler from "@saleor/utils/handlers/metadataCreateHandler"; import { @@ -102,7 +103,7 @@ export const CollectionCreate: React.FC = ({ input: { backgroundImage: formData.backgroundImage.value, backgroundImageAlt: formData.backgroundImageAlt, - description: JSON.stringify(formData.description), + description: getParsedDataForJsonStringField(formData.description), name: formData.name, seo: { description: formData.seoDescription, diff --git a/src/collections/views/CollectionDetails.tsx b/src/collections/views/CollectionDetails.tsx index 7e661ea52..8c145a16a 100644 --- a/src/collections/views/CollectionDetails.tsx +++ b/src/collections/views/CollectionDetails.tsx @@ -21,6 +21,7 @@ import usePaginator, { } from "@saleor/hooks/usePaginator"; import { commonMessages } from "@saleor/intl"; import useProductSearch from "@saleor/searches/useProductSearch"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler"; import { @@ -198,7 +199,7 @@ export const CollectionDetails: React.FC = ({ const handleUpdate = async (formData: CollectionUpdateData) => { const input: CollectionInput = { backgroundImageAlt: formData.backgroundImageAlt, - description: JSON.stringify(formData.description), + description: getParsedDataForJsonStringField(formData.description), name: formData.name, seo: { description: formData.seoDescription, diff --git a/src/fragments/types/CategoryDetailsFragment.ts b/src/fragments/types/CategoryDetailsFragment.ts index 1190c711d..6ecb638c3 100644 --- a/src/fragments/types/CategoryDetailsFragment.ts +++ b/src/fragments/types/CategoryDetailsFragment.ts @@ -37,7 +37,7 @@ export interface CategoryDetailsFragment { backgroundImage: CategoryDetailsFragment_backgroundImage | null; name: string; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; parent: CategoryDetailsFragment_parent | null; diff --git a/src/fragments/types/CategoryTranslationFragment.ts b/src/fragments/types/CategoryTranslationFragment.ts index ed3f656cd..ed941efb3 100644 --- a/src/fragments/types/CategoryTranslationFragment.ts +++ b/src/fragments/types/CategoryTranslationFragment.ts @@ -14,7 +14,7 @@ export interface CategoryTranslationFragment_translation_language { export interface CategoryTranslationFragment_translation { __typename: "CategoryTranslation"; id: string; - description: any; + description: any | null; language: CategoryTranslationFragment_translation_language; name: string; seoDescription: string | null; @@ -25,7 +25,7 @@ export interface CategoryTranslationFragment_category { __typename: "Category"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } diff --git a/src/fragments/types/CollectionDetailsFragment.ts b/src/fragments/types/CollectionDetailsFragment.ts index ae823d602..8b170980e 100644 --- a/src/fragments/types/CollectionDetailsFragment.ts +++ b/src/fragments/types/CollectionDetailsFragment.ts @@ -46,7 +46,7 @@ export interface CollectionDetailsFragment { privateMetadata: (CollectionDetailsFragment_privateMetadata | null)[]; backgroundImage: CollectionDetailsFragment_backgroundImage | null; slug: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } diff --git a/src/fragments/types/CollectionTranslationFragment.ts b/src/fragments/types/CollectionTranslationFragment.ts index 0b27b4a6a..0e77f2c0d 100644 --- a/src/fragments/types/CollectionTranslationFragment.ts +++ b/src/fragments/types/CollectionTranslationFragment.ts @@ -10,7 +10,7 @@ export interface CollectionTranslationFragment_collection { __typename: "Collection"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } @@ -23,7 +23,7 @@ export interface CollectionTranslationFragment_translation_language { export interface CollectionTranslationFragment_translation { __typename: "CollectionTranslation"; id: string; - description: any; + description: any | null; language: CollectionTranslationFragment_translation_language; name: string; seoDescription: string | null; diff --git a/src/fragments/types/PageDetailsFragment.ts b/src/fragments/types/PageDetailsFragment.ts index 8750634ac..1abbe5c7d 100644 --- a/src/fragments/types/PageDetailsFragment.ts +++ b/src/fragments/types/PageDetailsFragment.ts @@ -109,7 +109,7 @@ export interface PageDetailsFragment { pageType: PageDetailsFragment_pageType; metadata: (PageDetailsFragment_metadata | null)[]; privateMetadata: (PageDetailsFragment_privateMetadata | null)[]; - content: any; + content: any | null; seoTitle: string | null; seoDescription: string | null; publicationDate: any | null; diff --git a/src/fragments/types/PageTranslatableFragment.ts b/src/fragments/types/PageTranslatableFragment.ts index 8088d7a2f..59ac73eef 100644 --- a/src/fragments/types/PageTranslatableFragment.ts +++ b/src/fragments/types/PageTranslatableFragment.ts @@ -17,7 +17,7 @@ export interface PageTranslatableFragment_translation_language { export interface PageTranslatableFragment_translation { __typename: "PageTranslation"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; @@ -27,7 +27,7 @@ export interface PageTranslatableFragment_translation { export interface PageTranslatableFragment { __typename: "PageTranslatableContent"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; diff --git a/src/fragments/types/PageTranslationFragment.ts b/src/fragments/types/PageTranslationFragment.ts index a0e87d4da..3c89e43a1 100644 --- a/src/fragments/types/PageTranslationFragment.ts +++ b/src/fragments/types/PageTranslationFragment.ts @@ -11,7 +11,7 @@ import { LanguageCodeEnum } from "./../../types/globalTypes"; export interface PageTranslationFragment_page { __typename: "Page"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; @@ -26,7 +26,7 @@ export interface PageTranslationFragment_translation_language { export interface PageTranslationFragment_translation { __typename: "PageTranslation"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; diff --git a/src/fragments/types/Product.ts b/src/fragments/types/Product.ts index 8792e55a4..6d2912612 100644 --- a/src/fragments/types/Product.ts +++ b/src/fragments/types/Product.ts @@ -253,7 +253,7 @@ export interface Product { privateMetadata: (Product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/fragments/types/ProductTranslationFragment.ts b/src/fragments/types/ProductTranslationFragment.ts index 6bd9548fd..4280e43ec 100644 --- a/src/fragments/types/ProductTranslationFragment.ts +++ b/src/fragments/types/ProductTranslationFragment.ts @@ -12,7 +12,7 @@ export interface ProductTranslationFragment_product { __typename: "Product"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } @@ -26,7 +26,7 @@ export interface ProductTranslationFragment_translation_language { export interface ProductTranslationFragment_translation { __typename: "ProductTranslation"; id: string; - description: any; + description: any | null; language: ProductTranslationFragment_translation_language; name: string; seoDescription: string | null; diff --git a/src/pages/components/PageDetailsPage/form.tsx b/src/pages/components/PageDetailsPage/form.tsx index e1c21856f..cfbe1c0fa 100644 --- a/src/pages/components/PageDetailsPage/form.tsx +++ b/src/pages/components/PageDetailsPage/form.tsx @@ -122,7 +122,7 @@ function usePageForm( title: page?.title || "" }); const [content, changeContent] = useRichText({ - initial: pageExists ? page?.content : null, + initial: page?.content, triggerChange }); diff --git a/src/pages/types/PageCreate.ts b/src/pages/types/PageCreate.ts index f91bff45a..ecd908f0d 100644 --- a/src/pages/types/PageCreate.ts +++ b/src/pages/types/PageCreate.ts @@ -117,7 +117,7 @@ export interface PageCreate_pageCreate_page { pageType: PageCreate_pageCreate_page_pageType; metadata: (PageCreate_pageCreate_page_metadata | null)[]; privateMetadata: (PageCreate_pageCreate_page_privateMetadata | null)[]; - content: any; + content: any | null; seoTitle: string | null; seoDescription: string | null; publicationDate: any | null; diff --git a/src/pages/types/PageDetails.ts b/src/pages/types/PageDetails.ts index a596547d6..45bdc00f9 100644 --- a/src/pages/types/PageDetails.ts +++ b/src/pages/types/PageDetails.ts @@ -109,7 +109,7 @@ export interface PageDetails_page { pageType: PageDetails_page_pageType; metadata: (PageDetails_page_metadata | null)[]; privateMetadata: (PageDetails_page_privateMetadata | null)[]; - content: any; + content: any | null; seoTitle: string | null; seoDescription: string | null; publicationDate: any | null; diff --git a/src/pages/types/PageUpdate.ts b/src/pages/types/PageUpdate.ts index a32762485..1b9b567fc 100644 --- a/src/pages/types/PageUpdate.ts +++ b/src/pages/types/PageUpdate.ts @@ -116,7 +116,7 @@ export interface PageUpdate_pageUpdate_page { pageType: PageUpdate_pageUpdate_page_pageType; metadata: (PageUpdate_pageUpdate_page_metadata | null)[]; privateMetadata: (PageUpdate_pageUpdate_page_privateMetadata | null)[]; - content: any; + content: any | null; seoTitle: string | null; seoDescription: string | null; publicationDate: any | null; diff --git a/src/pages/views/PageCreate.tsx b/src/pages/views/PageCreate.tsx index 5289ddc4a..b3b2f6fb6 100644 --- a/src/pages/views/PageCreate.tsx +++ b/src/pages/views/PageCreate.tsx @@ -12,6 +12,7 @@ import useNotifier from "@saleor/hooks/useNotifier"; import usePageSearch from "@saleor/searches/usePageSearch"; import usePageTypeSearch from "@saleor/searches/usePageTypeSearch"; import useProductSearch from "@saleor/searches/useProductSearch"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import createMetadataCreateHandler from "@saleor/utils/handlers/metadataCreateHandler"; import { useMetadataUpdate, @@ -128,7 +129,7 @@ export const PageCreate: React.FC = ({ params }) => { attributes: formData.attributes, updatedFileAttributes }), - content: JSON.stringify(formData.content), + content: getParsedDataForJsonStringField(formData.content), isPublished: formData.isPublished, pageType: formData.pageType, publicationDate: formData.publicationDate, diff --git a/src/pages/views/PageDetails.tsx b/src/pages/views/PageDetails.tsx index 32d2eb608..db773768f 100644 --- a/src/pages/views/PageDetails.tsx +++ b/src/pages/views/PageDetails.tsx @@ -23,6 +23,7 @@ import useNotifier from "@saleor/hooks/useNotifier"; import { commonMessages } from "@saleor/intl"; import usePageSearch from "@saleor/searches/usePageSearch"; import useProductSearch from "@saleor/searches/useProductSearch"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import createMetadataUpdateHandler from "@saleor/utils/handlers/metadataUpdateHandler"; import { useMetadataUpdate, @@ -53,7 +54,7 @@ const createPageInput = ( attributes: data.attributes, updatedFileAttributes }), - content: JSON.stringify(data.content), + content: getParsedDataForJsonStringField(data.content), isPublished: data.isPublished, publicationDate: data.publicationDate, seo: { diff --git a/src/products/types/ProductChannelListingUpdate.ts b/src/products/types/ProductChannelListingUpdate.ts index 795e8368c..e06f8dca6 100644 --- a/src/products/types/ProductChannelListingUpdate.ts +++ b/src/products/types/ProductChannelListingUpdate.ts @@ -253,7 +253,7 @@ export interface ProductChannelListingUpdate_productChannelListingUpdate_product privateMetadata: (ProductChannelListingUpdate_productChannelListingUpdate_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductCreate.ts b/src/products/types/ProductCreate.ts index 531a73af0..782132b2a 100644 --- a/src/products/types/ProductCreate.ts +++ b/src/products/types/ProductCreate.ts @@ -260,7 +260,7 @@ export interface ProductCreate_productCreate_product { privateMetadata: (ProductCreate_productCreate_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductDetails.ts b/src/products/types/ProductDetails.ts index 960e25330..d181c34b5 100644 --- a/src/products/types/ProductDetails.ts +++ b/src/products/types/ProductDetails.ts @@ -253,7 +253,7 @@ export interface ProductDetails_product { privateMetadata: (ProductDetails_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductImageCreate.ts b/src/products/types/ProductImageCreate.ts index 13e0a706b..9297b016f 100644 --- a/src/products/types/ProductImageCreate.ts +++ b/src/products/types/ProductImageCreate.ts @@ -259,7 +259,7 @@ export interface ProductImageCreate_productImageCreate_product { privateMetadata: (ProductImageCreate_productImageCreate_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductImageUpdate.ts b/src/products/types/ProductImageUpdate.ts index 2545adbd8..f66a65fc5 100644 --- a/src/products/types/ProductImageUpdate.ts +++ b/src/products/types/ProductImageUpdate.ts @@ -259,7 +259,7 @@ export interface ProductImageUpdate_productImageUpdate_product { privateMetadata: (ProductImageUpdate_productImageUpdate_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductUpdate.ts b/src/products/types/ProductUpdate.ts index b2780eff1..c23225475 100644 --- a/src/products/types/ProductUpdate.ts +++ b/src/products/types/ProductUpdate.ts @@ -260,7 +260,7 @@ export interface ProductUpdate_productUpdate_product { privateMetadata: (ProductUpdate_productUpdate_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductVariantReorder.ts b/src/products/types/ProductVariantReorder.ts index 5070100c3..f84bcd8a0 100644 --- a/src/products/types/ProductVariantReorder.ts +++ b/src/products/types/ProductVariantReorder.ts @@ -259,7 +259,7 @@ export interface ProductVariantReorder_productVariantReorder_product { privateMetadata: (ProductVariantReorder_productVariantReorder_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/ProductVariantSetDefault.ts b/src/products/types/ProductVariantSetDefault.ts index d59a4aaca..227e55526 100644 --- a/src/products/types/ProductVariantSetDefault.ts +++ b/src/products/types/ProductVariantSetDefault.ts @@ -259,7 +259,7 @@ export interface ProductVariantSetDefault_productVariantSetDefault_product { privateMetadata: (ProductVariantSetDefault_productVariantSetDefault_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/types/SimpleProductUpdate.ts b/src/products/types/SimpleProductUpdate.ts index b4d7a0a70..41c4b19c4 100644 --- a/src/products/types/SimpleProductUpdate.ts +++ b/src/products/types/SimpleProductUpdate.ts @@ -260,7 +260,7 @@ export interface SimpleProductUpdate_productUpdate_product { privateMetadata: (SimpleProductUpdate_productUpdate_product_privateMetadata | null)[]; name: string; slug: string; - description: any; + description: any | null; seoTitle: string | null; seoDescription: string | null; rating: number | null; diff --git a/src/products/views/ProductCreate/handlers.ts b/src/products/views/ProductCreate/handlers.ts index 4cbe4b801..0798775f5 100644 --- a/src/products/views/ProductCreate/handlers.ts +++ b/src/products/views/ProductCreate/handlers.ts @@ -37,6 +37,7 @@ import { } from "@saleor/products/types/VariantCreate"; import { getAvailabilityVariables } from "@saleor/products/utils/handlers"; import { SearchProductTypes_search_edges_node } from "@saleor/searches/types/SearchProductTypes"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import { MutationFetchResult } from "react-apollo"; const getChannelsVariables = (productId: string, channels: ChannelData[]) => ({ @@ -108,7 +109,7 @@ export function createHandler( category: formData.category, chargeTaxes: formData.chargeTaxes, collections: formData.collections, - description: JSON.stringify(formData.description), + description: getParsedDataForJsonStringField(formData.description), name: formData.name, productType: formData.productType?.id, rating: formData.rating, diff --git a/src/products/views/ProductUpdate/handlers.ts b/src/products/views/ProductUpdate/handlers.ts index 47b36da63..e191a8db2 100644 --- a/src/products/views/ProductUpdate/handlers.ts +++ b/src/products/views/ProductUpdate/handlers.ts @@ -56,6 +56,7 @@ import { } from "@saleor/products/types/VariantCreate"; import { mapFormsetStockToStockInput } from "@saleor/products/utils/data"; import { getAvailabilityVariables } from "@saleor/products/utils/handlers"; +import { getParsedDataForJsonStringField } from "@saleor/translations/utils"; import { ReorderEvent } from "@saleor/types"; import { move } from "@saleor/utils/lists"; import { diff } from "fast-array-diff"; @@ -185,7 +186,7 @@ export function createUpdateHandler( category: data.category, chargeTaxes: data.chargeTaxes, collections: data.collections, - description: JSON.stringify(data.description), + description: getParsedDataForJsonStringField(data.description), name: data.name, rating: data.rating, seo: { diff --git a/src/translations/components/TranslationsCategoriesPage/TranslationsCategoriesPage.tsx b/src/translations/components/TranslationsCategoriesPage/TranslationsCategoriesPage.tsx index 66a529d52..9135a71cc 100644 --- a/src/translations/components/TranslationsCategoriesPage/TranslationsCategoriesPage.tsx +++ b/src/translations/components/TranslationsCategoriesPage/TranslationsCategoriesPage.tsx @@ -5,7 +5,10 @@ import LanguageSwitch from "@saleor/components/LanguageSwitch"; import PageHeader from "@saleor/components/PageHeader"; import { CategoryTranslationFragment } from "@saleor/fragments/types/CategoryTranslationFragment"; import { commonMessages, sectionNames } from "@saleor/intl"; -import { TranslationsEntitiesPageProps } from "@saleor/translations/types"; +import { + TranslationInputFieldName, + TranslationsEntitiesPageProps +} from "@saleor/translations/types"; import React from "react"; import { useIntl } from "react-intl"; @@ -17,13 +20,6 @@ export interface TranslationsCategoriesPageProps data: CategoryTranslationFragment; } -export const fieldNames = { - description: "description", - name: "name", - seoDescription: "seoDescription", - seoTitle: "seoTitle" -}; - const TranslationsCategoriesPage: React.FC = ({ activeField, disabled, @@ -72,14 +68,14 @@ const TranslationsCategoriesPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Category Name" }), - name: fieldNames.name, + name: TranslationInputFieldName.name, translation: data?.translation?.name || null, type: "short" as "short", value: data?.category?.name }, { displayName: intl.formatMessage(commonMessages.description), - name: fieldNames.description, + name: TranslationInputFieldName.description, translation: data?.translation?.description || null, type: "rich" as "rich", value: data?.category?.description @@ -103,7 +99,7 @@ const TranslationsCategoriesPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Search Engine Title" }), - name: fieldNames.seoTitle, + name: TranslationInputFieldName.seoTitle, translation: data?.translation?.seoTitle || null, type: "short" as "short", value: data?.category?.seoTitle @@ -112,7 +108,7 @@ const TranslationsCategoriesPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Search Engine Description" }), - name: fieldNames.seoDescription, + name: TranslationInputFieldName.seoDescription, translation: data?.translation?.seoDescription || null, type: "long" as "long", value: data?.category?.seoDescription diff --git a/src/translations/components/TranslationsCollectionsPage/TranslationsCollectionsPage.tsx b/src/translations/components/TranslationsCollectionsPage/TranslationsCollectionsPage.tsx index ef3c962a6..371db37b3 100644 --- a/src/translations/components/TranslationsCollectionsPage/TranslationsCollectionsPage.tsx +++ b/src/translations/components/TranslationsCollectionsPage/TranslationsCollectionsPage.tsx @@ -5,7 +5,10 @@ import LanguageSwitch from "@saleor/components/LanguageSwitch"; import PageHeader from "@saleor/components/PageHeader"; import { CollectionTranslationFragment } from "@saleor/fragments/types/CollectionTranslationFragment"; import { commonMessages, sectionNames } from "@saleor/intl"; -import { TranslationsEntitiesPageProps } from "@saleor/translations/types"; +import { + TranslationInputFieldName, + TranslationsEntitiesPageProps +} from "@saleor/translations/types"; import React from "react"; import { useIntl } from "react-intl"; @@ -17,13 +20,6 @@ export interface TranslationsCollectionsPageProps data: CollectionTranslationFragment; } -export const fieldNames = { - description: "description", - name: "name", - seoDescription: "seoDescription", - seoTitle: "seoTitle" -}; - const TranslationsCollectionsPage: React.FC = ({ activeField, disabled, @@ -73,14 +69,14 @@ const TranslationsCollectionsPage: React.FC = displayName: intl.formatMessage({ defaultMessage: "Collection Name" }), - name: fieldNames.name, + name: TranslationInputFieldName.name, translation: data?.translation?.name || null, type: "short" as "short", value: data?.collection?.name }, { displayName: intl.formatMessage(commonMessages.description), - name: fieldNames.description, + name: TranslationInputFieldName.description, translation: data?.translation?.description || null, type: "rich" as "rich", value: data?.collection?.description @@ -104,7 +100,7 @@ const TranslationsCollectionsPage: React.FC = displayName: intl.formatMessage({ defaultMessage: "Search Engine Title" }), - name: fieldNames.seoTitle, + name: TranslationInputFieldName.seoTitle, translation: data?.translation?.seoTitle || null, type: "short" as "short", value: data?.collection?.seoTitle @@ -113,7 +109,7 @@ const TranslationsCollectionsPage: React.FC = displayName: intl.formatMessage({ defaultMessage: "Search Engine Description" }), - name: fieldNames.seoDescription, + name: TranslationInputFieldName.seoDescription, translation: data?.translation?.seoDescription || null, type: "long" as "long", value: data?.collection?.seoDescription diff --git a/src/translations/components/TranslationsPagesPage/TranslationsPagesPage.tsx b/src/translations/components/TranslationsPagesPage/TranslationsPagesPage.tsx index 2c8661cf8..01b79924e 100644 --- a/src/translations/components/TranslationsPagesPage/TranslationsPagesPage.tsx +++ b/src/translations/components/TranslationsPagesPage/TranslationsPagesPage.tsx @@ -5,7 +5,10 @@ import LanguageSwitch from "@saleor/components/LanguageSwitch"; import PageHeader from "@saleor/components/PageHeader"; import { PageTranslationFragment } from "@saleor/fragments/types/PageTranslationFragment"; import { commonMessages, sectionNames } from "@saleor/intl"; -import { TranslationsEntitiesPageProps } from "@saleor/translations/types"; +import { + PageTranslationInputFieldName, + TranslationsEntitiesPageProps +} from "@saleor/translations/types"; import React from "react"; import { useIntl } from "react-intl"; @@ -17,13 +20,6 @@ export interface TranslationsPagesPageProps data: PageTranslationFragment; } -export const fieldNames = { - content: "content", - seoDescription: "seoDescription", - seoTitle: "seoTitle", - title: "title" -}; - const TranslationsPagesPage: React.FC = ({ activeField, disabled, @@ -72,7 +68,7 @@ const TranslationsPagesPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Page Title" }), - name: fieldNames.title, + name: PageTranslationInputFieldName.title, translation: data?.translation?.title || null, type: "short" as "short", value: data?.page?.title @@ -82,7 +78,7 @@ const TranslationsPagesPage: React.FC = ({ defaultMessage: "Content", description: "page content" }), - name: fieldNames.content, + name: PageTranslationInputFieldName.content, translation: data?.translation?.content || null, type: "rich" as "rich", value: data?.page?.content @@ -106,7 +102,7 @@ const TranslationsPagesPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Search Engine Title" }), - name: fieldNames.seoTitle, + name: PageTranslationInputFieldName.seoTitle, translation: data?.translation?.seoTitle || null, type: "short" as "short", value: data?.page?.seoTitle @@ -115,7 +111,7 @@ const TranslationsPagesPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Search Engine Description" }), - name: fieldNames.seoDescription, + name: PageTranslationInputFieldName.seoDescription, translation: data?.translation?.seoDescription || null, type: "long" as "long", value: data?.page?.seoDescription diff --git a/src/translations/components/TranslationsProductsPage/TranslationsProductsPage.tsx b/src/translations/components/TranslationsProductsPage/TranslationsProductsPage.tsx index 93e2d850c..b0b9c039a 100644 --- a/src/translations/components/TranslationsProductsPage/TranslationsProductsPage.tsx +++ b/src/translations/components/TranslationsProductsPage/TranslationsProductsPage.tsx @@ -5,7 +5,10 @@ import LanguageSwitch from "@saleor/components/LanguageSwitch"; import PageHeader from "@saleor/components/PageHeader"; import { ProductTranslationFragment } from "@saleor/fragments/types/ProductTranslationFragment"; import { commonMessages, sectionNames } from "@saleor/intl"; -import { TranslationsEntitiesPageProps } from "@saleor/translations/types"; +import { + TranslationInputFieldName, + TranslationsEntitiesPageProps +} from "@saleor/translations/types"; import React from "react"; import { useIntl } from "react-intl"; @@ -17,13 +20,6 @@ export interface TranslationsProductsPageProps data: ProductTranslationFragment; } -export const fieldNames = { - description: "description", - name: "name", - seoDescription: "seoDescription", - seoTitle: "seoTitle" -}; - const TranslationsProductsPage: React.FC = ({ activeField, disabled, @@ -73,7 +69,7 @@ const TranslationsProductsPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Product Name" }), - name: fieldNames.name, + name: TranslationInputFieldName.name, translation: data?.translation?.name || null, type: "short" as "short", value: data?.product?.name @@ -82,7 +78,7 @@ const TranslationsProductsPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Description" }), - name: fieldNames.description, + name: TranslationInputFieldName.description, translation: data?.translation?.description || null, type: "rich" as "rich", value: data?.product?.description @@ -106,7 +102,7 @@ const TranslationsProductsPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Search Engine Title" }), - name: fieldNames.seoTitle, + name: TranslationInputFieldName.seoTitle, translation: data?.translation?.seoTitle || null, type: "short" as "short", value: data?.product?.seoTitle @@ -115,7 +111,7 @@ const TranslationsProductsPage: React.FC = ({ displayName: intl.formatMessage({ defaultMessage: "Search Engine Description" }), - name: fieldNames.seoDescription, + name: TranslationInputFieldName.seoDescription, translation: data?.translation?.seoDescription || null, type: "long" as "long", value: data?.product?.seoDescription diff --git a/src/translations/mutations.ts b/src/translations/mutations.ts index 20fcd85bb..3a65e570d 100644 --- a/src/translations/mutations.ts +++ b/src/translations/mutations.ts @@ -107,6 +107,7 @@ const updateCategoryTranslations = gql` } } `; + export const TypedUpdateCategoryTranslations = TypedMutation< UpdateCategoryTranslations, UpdateCategoryTranslationsVariables @@ -143,6 +144,7 @@ const updateCollectionTranslations = gql` } } `; + export const TypedUpdateCollectionTranslations = TypedMutation< UpdateCollectionTranslations, UpdateCollectionTranslationsVariables diff --git a/src/translations/types.ts b/src/translations/types.ts index 335268725..3b7aa3a6e 100644 --- a/src/translations/types.ts +++ b/src/translations/types.ts @@ -14,3 +14,17 @@ export interface TranslationsEntitiesPageProps { onLanguageChange: (lang: string) => void; onSubmit: (field: string, data: string | OutputData) => void; } + +export enum TranslationInputFieldName { + description = "description", + name = "name", + seoDescription = "seoDescription", + seoTitle = "seoTitle" +} + +export enum PageTranslationInputFieldName { + content = "content", + title = "title", + seoDescription = "seoDescription", + seoTitle = "seoTitle" +} diff --git a/src/translations/types/CategoryTranslationDetails.ts b/src/translations/types/CategoryTranslationDetails.ts index b3efd65b2..1407289a3 100644 --- a/src/translations/types/CategoryTranslationDetails.ts +++ b/src/translations/types/CategoryTranslationDetails.ts @@ -20,7 +20,7 @@ export interface CategoryTranslationDetails_translation_CategoryTranslatableCont export interface CategoryTranslationDetails_translation_CategoryTranslatableContent_translation { __typename: "CategoryTranslation"; id: string; - description: any; + description: any | null; language: CategoryTranslationDetails_translation_CategoryTranslatableContent_translation_language; name: string; seoDescription: string | null; @@ -31,7 +31,7 @@ export interface CategoryTranslationDetails_translation_CategoryTranslatableCont __typename: "Category"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } diff --git a/src/translations/types/CategoryTranslations.ts b/src/translations/types/CategoryTranslations.ts index 8330f1b59..8a2ad4fb2 100644 --- a/src/translations/types/CategoryTranslations.ts +++ b/src/translations/types/CategoryTranslations.ts @@ -20,7 +20,7 @@ export interface CategoryTranslations_translations_edges_node_CategoryTranslatab export interface CategoryTranslations_translations_edges_node_CategoryTranslatableContent_translation { __typename: "CategoryTranslation"; id: string; - description: any; + description: any | null; language: CategoryTranslations_translations_edges_node_CategoryTranslatableContent_translation_language; name: string; seoDescription: string | null; @@ -31,7 +31,7 @@ export interface CategoryTranslations_translations_edges_node_CategoryTranslatab __typename: "Category"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } diff --git a/src/translations/types/CollectionTranslationDetails.ts b/src/translations/types/CollectionTranslationDetails.ts index f8ce23280..4e70171af 100644 --- a/src/translations/types/CollectionTranslationDetails.ts +++ b/src/translations/types/CollectionTranslationDetails.ts @@ -16,7 +16,7 @@ export interface CollectionTranslationDetails_translation_CollectionTranslatable __typename: "Collection"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } @@ -29,7 +29,7 @@ export interface CollectionTranslationDetails_translation_CollectionTranslatable export interface CollectionTranslationDetails_translation_CollectionTranslatableContent_translation { __typename: "CollectionTranslation"; id: string; - description: any; + description: any | null; language: CollectionTranslationDetails_translation_CollectionTranslatableContent_translation_language; name: string; seoDescription: string | null; diff --git a/src/translations/types/CollectionTranslations.ts b/src/translations/types/CollectionTranslations.ts index f25b8d4d1..5ea2f16e4 100644 --- a/src/translations/types/CollectionTranslations.ts +++ b/src/translations/types/CollectionTranslations.ts @@ -16,7 +16,7 @@ export interface CollectionTranslations_translations_edges_node_CollectionTransl __typename: "Collection"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } @@ -29,7 +29,7 @@ export interface CollectionTranslations_translations_edges_node_CollectionTransl export interface CollectionTranslations_translations_edges_node_CollectionTranslatableContent_translation { __typename: "CollectionTranslation"; id: string; - description: any; + description: any | null; language: CollectionTranslations_translations_edges_node_CollectionTranslatableContent_translation_language; name: string; seoDescription: string | null; diff --git a/src/translations/types/PageTranslationDetails.ts b/src/translations/types/PageTranslationDetails.ts index a40b072ca..e208f22de 100644 --- a/src/translations/types/PageTranslationDetails.ts +++ b/src/translations/types/PageTranslationDetails.ts @@ -15,7 +15,7 @@ export interface PageTranslationDetails_translation_ProductTranslatableContent { export interface PageTranslationDetails_translation_PageTranslatableContent_page { __typename: "Page"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; @@ -30,7 +30,7 @@ export interface PageTranslationDetails_translation_PageTranslatableContent_tran export interface PageTranslationDetails_translation_PageTranslatableContent_translation { __typename: "PageTranslation"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; diff --git a/src/translations/types/PageTranslations.ts b/src/translations/types/PageTranslations.ts index a2a9aa242..ba01bc4f8 100644 --- a/src/translations/types/PageTranslations.ts +++ b/src/translations/types/PageTranslations.ts @@ -15,7 +15,7 @@ export interface PageTranslations_translations_edges_node_ProductTranslatableCon export interface PageTranslations_translations_edges_node_PageTranslatableContent_page { __typename: "Page"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; @@ -30,7 +30,7 @@ export interface PageTranslations_translations_edges_node_PageTranslatableConten export interface PageTranslations_translations_edges_node_PageTranslatableContent_translation { __typename: "PageTranslation"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; diff --git a/src/translations/types/ProductTranslationDetails.ts b/src/translations/types/ProductTranslationDetails.ts index d7f4b0dc7..4aa5b923e 100644 --- a/src/translations/types/ProductTranslationDetails.ts +++ b/src/translations/types/ProductTranslationDetails.ts @@ -16,7 +16,7 @@ export interface ProductTranslationDetails_translation_ProductTranslatableConten __typename: "Product"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } @@ -30,7 +30,7 @@ export interface ProductTranslationDetails_translation_ProductTranslatableConten export interface ProductTranslationDetails_translation_ProductTranslatableContent_translation { __typename: "ProductTranslation"; id: string; - description: any; + description: any | null; language: ProductTranslationDetails_translation_ProductTranslatableContent_translation_language; name: string; seoDescription: string | null; diff --git a/src/translations/types/ProductTranslations.ts b/src/translations/types/ProductTranslations.ts index 46c1989b4..748c04738 100644 --- a/src/translations/types/ProductTranslations.ts +++ b/src/translations/types/ProductTranslations.ts @@ -16,7 +16,7 @@ export interface ProductTranslations_translations_edges_node_ProductTranslatable __typename: "Product"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; } @@ -30,7 +30,7 @@ export interface ProductTranslations_translations_edges_node_ProductTranslatable export interface ProductTranslations_translations_edges_node_ProductTranslatableContent_translation { __typename: "ProductTranslation"; id: string; - description: any; + description: any | null; language: ProductTranslations_translations_edges_node_ProductTranslatableContent_translation_language; name: string; seoDescription: string | null; diff --git a/src/translations/types/UpdateCategoryTranslations.ts b/src/translations/types/UpdateCategoryTranslations.ts index 3d5e977ad..ac0ed3b35 100644 --- a/src/translations/types/UpdateCategoryTranslations.ts +++ b/src/translations/types/UpdateCategoryTranslations.ts @@ -22,7 +22,7 @@ export interface UpdateCategoryTranslations_categoryTranslate_category_translati export interface UpdateCategoryTranslations_categoryTranslate_category_translation { __typename: "CategoryTranslation"; id: string; - description: any; + description: any | null; language: UpdateCategoryTranslations_categoryTranslate_category_translation_language; name: string; seoDescription: string | null; @@ -33,7 +33,7 @@ export interface UpdateCategoryTranslations_categoryTranslate_category { __typename: "Category"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; translation: UpdateCategoryTranslations_categoryTranslate_category_translation | null; diff --git a/src/translations/types/UpdateCollectionTranslations.ts b/src/translations/types/UpdateCollectionTranslations.ts index 3f72c6f8d..6072b1cf9 100644 --- a/src/translations/types/UpdateCollectionTranslations.ts +++ b/src/translations/types/UpdateCollectionTranslations.ts @@ -22,7 +22,7 @@ export interface UpdateCollectionTranslations_collectionTranslate_collection_tra export interface UpdateCollectionTranslations_collectionTranslate_collection_translation { __typename: "CollectionTranslation"; id: string; - description: any; + description: any | null; language: UpdateCollectionTranslations_collectionTranslate_collection_translation_language; name: string; seoDescription: string | null; @@ -33,7 +33,7 @@ export interface UpdateCollectionTranslations_collectionTranslate_collection { __typename: "Collection"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; translation: UpdateCollectionTranslations_collectionTranslate_collection_translation | null; diff --git a/src/translations/types/UpdatePageTranslations.ts b/src/translations/types/UpdatePageTranslations.ts index 48154c0d4..56020a3e0 100644 --- a/src/translations/types/UpdatePageTranslations.ts +++ b/src/translations/types/UpdatePageTranslations.ts @@ -17,7 +17,7 @@ export interface UpdatePageTranslations_pageTranslate_errors { export interface UpdatePageTranslations_pageTranslate_page_page { __typename: "Page"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; @@ -32,7 +32,7 @@ export interface UpdatePageTranslations_pageTranslate_page_translation_language export interface UpdatePageTranslations_pageTranslate_page_translation { __typename: "PageTranslation"; id: string; - content: any; + content: any | null; seoDescription: string | null; seoTitle: string | null; title: string; diff --git a/src/translations/types/UpdateProductTranslations.ts b/src/translations/types/UpdateProductTranslations.ts index 0be7c75ac..0fd4c837d 100644 --- a/src/translations/types/UpdateProductTranslations.ts +++ b/src/translations/types/UpdateProductTranslations.ts @@ -23,7 +23,7 @@ export interface UpdateProductTranslations_productTranslate_product_translation_ export interface UpdateProductTranslations_productTranslate_product_translation { __typename: "ProductTranslation"; id: string; - description: any; + description: any | null; language: UpdateProductTranslations_productTranslate_product_translation_language; name: string; seoDescription: string | null; @@ -34,7 +34,7 @@ export interface UpdateProductTranslations_productTranslate_product { __typename: "Product"; id: string; name: string; - description: any; + description: any | null; seoDescription: string | null; seoTitle: string | null; translation: UpdateProductTranslations_productTranslate_product_translation | null; diff --git a/src/translations/utils.ts b/src/translations/utils.ts new file mode 100644 index 000000000..b92d417b7 --- /dev/null +++ b/src/translations/utils.ts @@ -0,0 +1,31 @@ +import { OutputData } from "@editorjs/editorjs"; + +import { + PageTranslationInputFieldName, + TranslationInputFieldName +} from "./types"; + +export const getParsedTranslationInputData = ({ + fieldName, + data +}: { + fieldName: TranslationInputFieldName | PageTranslationInputFieldName; + data: string | OutputData; +}): Record => { + const fieldsToParse = [ + TranslationInputFieldName.description, + PageTranslationInputFieldName.content + ]; + + if (fieldsToParse.includes(fieldName)) { + return { + description: getParsedDataForJsonStringField(data as OutputData) + }; + } + + return { [fieldName]: data as string }; +}; + +export const getParsedDataForJsonStringField = ( + data: OutputData +): string | null => (!!data.blocks?.length ? JSON.stringify(data) : null); diff --git a/src/translations/views/TranslationsCategories.tsx b/src/translations/views/TranslationsCategories.tsx index 2aa9260ff..c29fe6e12 100644 --- a/src/translations/views/TranslationsCategories.tsx +++ b/src/translations/views/TranslationsCategories.tsx @@ -1,3 +1,4 @@ +import { OutputData } from "@editorjs/editorjs"; import useNavigator from "@saleor/hooks/useNavigator"; import useNotifier from "@saleor/hooks/useNotifier"; import useShop from "@saleor/hooks/useShop"; @@ -6,18 +7,18 @@ import { stringify as stringifyQs } from "qs"; import React from "react"; import { useIntl } from "react-intl"; -import { LanguageCodeEnum, TranslationInput } from "../../types/globalTypes"; -import TranslationsCategoriesPage, { - fieldNames -} from "../components/TranslationsCategoriesPage"; +import { LanguageCodeEnum } from "../../types/globalTypes"; +import TranslationsCategoriesPage from "../components/TranslationsCategoriesPage"; import { TypedUpdateCategoryTranslations } from "../mutations"; import { useCategoryTranslationDetails } from "../queries"; +import { TranslationInputFieldName } from "../types"; import { UpdateCategoryTranslations } from "../types/UpdateCategoryTranslations"; import { languageEntitiesUrl, languageEntityUrl, TranslatableEntities } from "../urls"; +import { getParsedTranslationInputData } from "../utils"; export interface TranslationsCategoriesQueryParams { activeField: string; @@ -67,25 +68,19 @@ const TranslationsCategories: React.FC = ({ return ( {(updateTranslations, updateTranslationsOpts) => { - const handleSubmit = (field: string, data: string) => { - const input: TranslationInput = {}; - if (field === fieldNames.description) { - input.description = JSON.stringify(data); - } else if (field === fieldNames.name) { - input.name = data; - } else if (field === fieldNames.seoDescription) { - input.seoDescription = data; - } else if (field === fieldNames.seoTitle) { - input.seoTitle = data; - } + const handleSubmit = ( + fieldName: TranslationInputFieldName, + data: string | OutputData + ) => { updateTranslations({ variables: { id, - input, + input: getParsedTranslationInputData({ data, fieldName }), language: languageCode } }); }; + const translation = categoryTranslations?.data?.translation; return ( diff --git a/src/translations/views/TranslationsCollections.tsx b/src/translations/views/TranslationsCollections.tsx index 747e5bc7e..efce16ca1 100644 --- a/src/translations/views/TranslationsCollections.tsx +++ b/src/translations/views/TranslationsCollections.tsx @@ -7,18 +7,18 @@ import React from "react"; import { useIntl } from "react-intl"; import { maybe } from "../../misc"; -import { LanguageCodeEnum, TranslationInput } from "../../types/globalTypes"; -import TranslationsCollectionsPage, { - fieldNames -} from "../components/TranslationsCollectionsPage"; +import { LanguageCodeEnum } from "../../types/globalTypes"; +import TranslationsCollectionsPage from "../components/TranslationsCollectionsPage"; import { TypedUpdateCollectionTranslations } from "../mutations"; import { useCollectionTranslationDetails } from "../queries"; +import { TranslationInputFieldName } from "../types"; import { UpdateCollectionTranslations } from "../types/UpdateCollectionTranslations"; import { languageEntitiesUrl, languageEntityUrl, TranslatableEntities } from "../urls"; +import { getParsedTranslationInputData } from "../utils"; export interface TranslationsCollectionsQueryParams { activeField: string; @@ -69,21 +69,14 @@ const TranslationsCollections: React.FC = ({ return ( {(updateTranslations, updateTranslationsOpts) => { - const handleSubmit = (field: string, data: string) => { - const input: TranslationInput = {}; - if (field === fieldNames.description) { - input.description = JSON.stringify(data); - } else if (field === fieldNames.name) { - input.name = data; - } else if (field === fieldNames.seoDescription) { - input.seoDescription = data; - } else if (field === fieldNames.seoTitle) { - input.seoTitle = data; - } + const handleSubmit = ( + fieldName: TranslationInputFieldName, + data: string + ) => { updateTranslations({ variables: { id, - input, + input: getParsedTranslationInputData({ data, fieldName }), language: languageCode } }); diff --git a/src/translations/views/TranslationsPages.tsx b/src/translations/views/TranslationsPages.tsx index 8b7e735db..1d2e43f49 100644 --- a/src/translations/views/TranslationsPages.tsx +++ b/src/translations/views/TranslationsPages.tsx @@ -6,21 +6,18 @@ import { stringify as stringifyQs } from "qs"; import React from "react"; import { useIntl } from "react-intl"; -import { - LanguageCodeEnum, - PageTranslationInput -} from "../../types/globalTypes"; -import TranslationsPagesPage, { - fieldNames -} from "../components/TranslationsPagesPage"; +import { LanguageCodeEnum } from "../../types/globalTypes"; +import TranslationsPagesPage from "../components/TranslationsPagesPage"; import { TypedUpdatePageTranslations } from "../mutations"; import { usePageTranslationDetails } from "../queries"; +import { TranslationInputFieldName } from "../types"; import { UpdatePageTranslations } from "../types/UpdatePageTranslations"; import { languageEntitiesUrl, languageEntityUrl, TranslatableEntities } from "../urls"; +import { getParsedTranslationInputData } from "../utils"; export interface TranslationsPagesQueryParams { activeField: string; @@ -70,21 +67,14 @@ const TranslationsPages: React.FC = ({ return ( {(updateTranslations, updateTranslationsOpts) => { - const handleSubmit = (field: string, data: string) => { - const input: PageTranslationInput = {}; - if (field === fieldNames.content) { - input.content = JSON.stringify(data); - } else if (field === fieldNames.title) { - input.title = data; - } else if (field === fieldNames.seoDescription) { - input.seoDescription = data; - } else if (field === fieldNames.seoTitle) { - input.seoTitle = data; - } + const handleSubmit = ( + fieldName: TranslationInputFieldName, + data: string + ) => { updateTranslations({ variables: { id, - input, + input: getParsedTranslationInputData({ data, fieldName }), language: languageCode } }); diff --git a/src/translations/views/TranslationsProducts.tsx b/src/translations/views/TranslationsProducts.tsx index aede683aa..984ee4a92 100644 --- a/src/translations/views/TranslationsProducts.tsx +++ b/src/translations/views/TranslationsProducts.tsx @@ -7,18 +7,18 @@ import React from "react"; import { useIntl } from "react-intl"; import { maybe } from "../../misc"; -import { LanguageCodeEnum, TranslationInput } from "../../types/globalTypes"; -import TranslationsProductsPage, { - fieldNames -} from "../components/TranslationsProductsPage"; +import { LanguageCodeEnum } from "../../types/globalTypes"; +import TranslationsProductsPage from "../components/TranslationsProductsPage"; import { TypedUpdateProductTranslations } from "../mutations"; import { useProductTranslationDetails } from "../queries"; +import { TranslationInputFieldName } from "../types"; import { UpdateProductTranslations } from "../types/UpdateProductTranslations"; import { languageEntitiesUrl, languageEntityUrl, TranslatableEntities } from "../urls"; +import { getParsedTranslationInputData } from "../utils"; export interface TranslationsProductsQueryParams { activeField: string; @@ -68,21 +68,14 @@ const TranslationsProducts: React.FC = ({ return ( {(updateTranslations, updateTranslationsOpts) => { - const handleSubmit = (field: string, data: string) => { - const input: TranslationInput = {}; - if (field === fieldNames.description) { - input.description = JSON.stringify(data); - } else if (field === fieldNames.name) { - input.name = data; - } else if (field === fieldNames.seoDescription) { - input.seoDescription = data; - } else if (field === fieldNames.seoTitle) { - input.seoTitle = data; - } + const handleSubmit = ( + fieldName: TranslationInputFieldName, + data: string + ) => { updateTranslations({ variables: { id, - input, + input: getParsedTranslationInputData({ data, fieldName }), language: languageCode } }); diff --git a/src/utils/richText/useRichText.ts b/src/utils/richText/useRichText.ts index 652e88bc4..d05ae08ca 100644 --- a/src/utils/richText/useRichText.ts +++ b/src/utils/richText/useRichText.ts @@ -6,18 +6,21 @@ function useRichText(opts: { initial: string | null; triggerChange: () => void; }): [MutableRefObject, RichTextEditorChange] { - const data = useRef( - opts.initial === null ? { blocks: [] } : undefined - ); + const data = useRef(); const [, setLoaded] = useState(false); + useEffect(() => { - if (opts.initial !== null) { - try { - data.current = JSON.parse(opts.initial); - setLoaded(true); - } catch { - data.current = undefined; - } + if (opts.initial === null) { + data.current = { blocks: [] }; + setLoaded(true); + return; + } + + try { + data.current = JSON.parse(opts.initial); + setLoaded(true); + } catch { + data.current = undefined; } }, [opts.initial]);