From 77da4694ac89a9255d275ff27bee50ecaf2317ee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dominik=20=C5=BBegle=C5=84?= Date: Fri, 16 Aug 2019 21:32:42 +0200 Subject: [PATCH] Use react-intl --- .../CategoryBackground/CategoryBackground.tsx | 201 +++++++-------- .../CategoryCreatePage/CategoryCreatePage.tsx | 101 ++++---- .../CategoryDeleteDialog.tsx | 33 ++- .../CategoryDetailsForm.tsx | 17 +- .../components/CategoryList/CategoryList.tsx | 238 ++++++++++-------- .../CategoryListPage/CategoryListPage.tsx | 63 +++-- .../CategoryProducts/CategoryProducts.tsx | 169 +++++++------ .../CategoryProductsCard.tsx | 76 +++--- .../CategoryUpdatePage/CategoryUpdatePage.tsx | 26 +- src/categories/views/CategoryCreate.tsx | 18 +- src/categories/views/CategoryDetails.tsx | 139 +++++----- src/categories/views/CategoryList.tsx | 33 +-- src/intl.ts | 27 +- 13 files changed, 655 insertions(+), 486 deletions(-) diff --git a/src/categories/components/CategoryBackground/CategoryBackground.tsx b/src/categories/components/CategoryBackground/CategoryBackground.tsx index 2dca98b19..e1b6616cb 100644 --- a/src/categories/components/CategoryBackground/CategoryBackground.tsx +++ b/src/categories/components/CategoryBackground/CategoryBackground.tsx @@ -1,10 +1,6 @@ -import { - createStyles, - Theme, - withStyles, - WithStyles -} from "@material-ui/core/styles"; +import { Theme } from "@material-ui/core/styles"; import TextField from "@material-ui/core/TextField"; +import makeStyles from "@material-ui/styles/makeStyles"; import React from "react"; import Button from "@material-ui/core/Button"; @@ -15,35 +11,35 @@ import Hr from "@saleor/components/Hr"; import ImageTile from "@saleor/components/ImageTile"; import ImageUpload from "@saleor/components/ImageUpload"; import Skeleton from "@saleor/components/Skeleton"; -import i18n from "../../../i18n"; +import { commonMessages } from "@saleor/intl"; +import { FormattedMessage, useIntl } from "react-intl"; import { CategoryDetails_category_backgroundImage } from "../../types/CategoryDetails"; import { FormData } from "../CategoryUpdatePage"; -const styles = (theme: Theme) => - createStyles({ - fileField: { - display: "none" - }, - image: { - height: "100%", - objectFit: "contain", - userSelect: "none", - width: "100%" - }, - imageContainer: { - background: "#ffffff", - border: "1px solid #eaeaea", - borderRadius: theme.spacing.unit, - height: 148, - justifySelf: "start", - overflow: "hidden", - padding: theme.spacing.unit * 2, - position: "relative", - width: 148 - } - }); +const useStyles = makeStyles((theme: Theme) => ({ + fileField: { + display: "none" + }, + image: { + height: "100%", + objectFit: "contain", + userSelect: "none", + width: "100%" + }, + imageContainer: { + background: "#ffffff", + border: "1px solid #eaeaea", + borderRadius: theme.spacing.unit, + height: 148, + justifySelf: "start", + overflow: "hidden", + padding: theme.spacing.unit * 2, + position: "relative", + width: 148 + } +})); -export interface CategoryBackgroundProps extends WithStyles { +export interface CategoryBackgroundProps { data: FormData; image: CategoryDetails_category_backgroundImage; onChange: (event: React.ChangeEvent) => void; @@ -51,83 +47,76 @@ export interface CategoryBackgroundProps extends WithStyles { onImageUpload: (file: File) => void; } -export const CategoryBackground = withStyles(styles)( - class CategoryBackgroundComponent extends React.Component< - CategoryBackgroundProps, - {} - > { - imgInputAnchor = React.createRef(); +const CategoryBackground: React.FC = props => { + const classes = useStyles(props); + const intl = useIntl(); + const anchor = React.useRef(); - clickImgInput = () => this.imgInputAnchor.current.click(); + const { data, onImageUpload, image, onChange, onImageDelete } = props; - render() { - const { - classes, - data, - onImageUpload, - image, - onChange, - onImageDelete - } = this.props; - return ( - - - - onImageUpload(event.target.files[0])} - type="file" - ref={this.imgInputAnchor} - /> - - } - /> - {image === undefined ? ( - -
-
- -
-
- - ) : image === null ? ( - - ) : ( - - - - )} + const handleImageUploadButtonClick = () => anchor.current.click(); - {image && ( - <> -
- - - - - )} - - ); - } - } -); + return ( + + + + onImageUpload(event.target.files[0])} + type="file" + ref={anchor} + /> + + } + /> + {image === undefined ? ( + +
+
+ +
+
+ + ) : image === null ? ( + + ) : ( + + + + )} + + {image && ( + <> +
+ + + + + )} + + ); +}; CategoryBackground.displayName = "CategoryBackground"; export default CategoryBackground; diff --git a/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx b/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx index 664d3b2b5..91ebbb344 100644 --- a/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx +++ b/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx @@ -1,5 +1,6 @@ import { ContentState, convertToRaw, RawDraftContentState } from "draft-js"; import React from "react"; +import { useIntl } from "react-intl"; import AppHeader from "@saleor/components/AppHeader"; import { CardSpacer } from "@saleor/components/CardSpacer"; @@ -9,7 +10,7 @@ import Form from "@saleor/components/Form"; import PageHeader from "@saleor/components/PageHeader"; import SaveButtonBar from "@saleor/components/SaveButtonBar"; import SeoForm from "@saleor/components/SeoForm"; -import i18n from "../../../i18n"; +import { commonMessages, sectionNames } from "@saleor/intl"; import { UserError } from "../../../types"; import CategoryDetailsForm from "../../components/CategoryDetailsForm"; @@ -43,50 +44,60 @@ export const CategoryCreatePage: React.StatelessComponent< onBack, errors: userErrors, saveButtonBarState -}) => ( -
- {({ data, change, errors, submit, hasChanged }) => ( - - {i18n.t("Categories")} - -
- { + const intl = useIntl(); + return ( + + {({ data, change, errors, submit, hasChanged }) => ( + + + {intl.formatMessage(sectionNames.categories)} + + - - - -
- - )} -
-); +
+ + + + +
+ + )} + + ); +}; CategoryCreatePage.displayName = "CategoryCreatePage"; export default CategoryCreatePage; diff --git a/src/categories/components/CategoryDeleteDialog/CategoryDeleteDialog.tsx b/src/categories/components/CategoryDeleteDialog/CategoryDeleteDialog.tsx index 3fb36f4c8..70e87eeb0 100644 --- a/src/categories/components/CategoryDeleteDialog/CategoryDeleteDialog.tsx +++ b/src/categories/components/CategoryDeleteDialog/CategoryDeleteDialog.tsx @@ -11,8 +11,9 @@ import { WithStyles } from "@material-ui/core/styles"; import React from "react"; +import { FormattedMessage } from "react-intl"; -import i18n from "../../../i18n"; +import { commonMessages } from "@saleor/intl"; const styles = (theme: Theme) => createStyles({ @@ -36,27 +37,35 @@ const CategoryDeleteDialog = withStyles(styles, { name: "CategoryDeleteDialog" })(({ classes, name, open, onConfirm, onClose }: CategoryDeleteDialogProps) => ( - {i18n.t("Delete category", { context: "title" })} - - {{name}}?", - { name } - ) - }} + + + + + + {name} + }} + /> + diff --git a/src/categories/components/CategoryDetailsForm/CategoryDetailsForm.tsx b/src/categories/components/CategoryDetailsForm/CategoryDetailsForm.tsx index cffbd9579..f85e469a5 100644 --- a/src/categories/components/CategoryDetailsForm/CategoryDetailsForm.tsx +++ b/src/categories/components/CategoryDetailsForm/CategoryDetailsForm.tsx @@ -4,11 +4,12 @@ import { createStyles, withStyles, WithStyles } from "@material-ui/core/styles"; import TextField from "@material-ui/core/TextField"; import { RawDraftContentState } from "draft-js"; import React from "react"; +import { useIntl } from "react-intl"; import CardTitle from "@saleor/components/CardTitle"; import FormSpacer from "@saleor/components/FormSpacer"; import RichTextEditor from "@saleor/components/RichTextEditor"; -import i18n from "../../../i18n"; +import { commonMessages } from "@saleor/intl"; import { maybe } from "../../../misc"; import { CategoryDetails_category } from "../../types/CategoryDetails"; @@ -40,15 +41,23 @@ export const CategoryDetailsForm = withStyles(styles, { onChange, errors }: CategoryDetailsFormProps) => { + const intl = useIntl(); + return ( - + <>
JSON.parse(category.descriptionJson))} name="description" onChange={onChange} diff --git a/src/categories/components/CategoryList/CategoryList.tsx b/src/categories/components/CategoryList/CategoryList.tsx index 293e04830..c265d8542 100644 --- a/src/categories/components/CategoryList/CategoryList.tsx +++ b/src/categories/components/CategoryList/CategoryList.tsx @@ -12,13 +12,13 @@ import TableCell from "@material-ui/core/TableCell"; import TableFooter from "@material-ui/core/TableFooter"; import TableRow from "@material-ui/core/TableRow"; import React from "react"; +import { FormattedMessage, useIntl } from "react-intl"; import CardTitle from "@saleor/components/CardTitle"; import Checkbox from "@saleor/components/Checkbox"; import Skeleton from "@saleor/components/Skeleton"; import TableHead from "@saleor/components/TableHead"; import TablePagination from "@saleor/components/TablePagination"; -import i18n from "@saleor/i18n"; import { renderCollection } from "@saleor/misc"; import { ListActions, ListProps } from "@saleor/types"; @@ -87,112 +87,146 @@ const CategoryList = withStyles(styles, { name: "CategoryList" })( onPreviousPage, onUpdateListSettings, onRowClick - }: CategoryListProps) => ( - - {!isRoot && ( - - {i18n.t("Add subcategory")} - - } - /> - )} - - - - {i18n.t("Category Name", { context: "object" })} - - - {i18n.t("Subcategories", { context: "object" })} - - - {i18n.t("No. Products", { context: "object" }).replace(" ", "\xa0")} - - - - - - - - - {renderCollection( - categories, - category => { - const isSelected = category ? isChecked(category.id) : false; + }: CategoryListProps) => { + const intl = useIntl(); - return ( - - - toggle(category.id)} - /> - - - {category && category.name ? category.name : } - - - {category && - category.children && - category.children.totalCount !== undefined ? ( - category.children.totalCount + return ( + + {!isRoot && ( + + + + } + /> + )} +
+ + + + + + + + + + + + + + + + + + {renderCollection( + categories, + category => { + const isSelected = category ? isChecked(category.id) : false; + + return ( + + + toggle(category.id)} + /> + + + {category && category.name ? category.name : } + + + {category && + category.children && + category.children.totalCount !== undefined ? ( + category.children.totalCount + ) : ( + + )} + + + {category && + category.products && + category.products.totalCount !== undefined ? ( + category.products.totalCount + ) : ( + + )} + + + ); + }, + () => ( + + + {isRoot ? ( + ) : ( - - )} - - - {category && - category.products && - category.products.totalCount !== undefined ? ( - category.products.totalCount - ) : ( - + )} - ); - }, - () => ( - - - {isRoot - ? i18n.t("No categories found") - : i18n.t("No subcategories found")} - - - ) - )} - -
- - ) + ) + )} + + + + ); + } ); CategoryList.displayName = "CategoryList"; export default CategoryList; diff --git a/src/categories/components/CategoryListPage/CategoryListPage.tsx b/src/categories/components/CategoryListPage/CategoryListPage.tsx index c3829c4bd..7bbd41b90 100644 --- a/src/categories/components/CategoryListPage/CategoryListPage.tsx +++ b/src/categories/components/CategoryListPage/CategoryListPage.tsx @@ -1,10 +1,11 @@ import Button from "@material-ui/core/Button"; import AddIcon from "@material-ui/icons/Add"; import React from "react"; +import { FormattedMessage, useIntl } from "react-intl"; import Container from "@saleor/components/Container"; import PageHeader from "@saleor/components/PageHeader"; -import i18n from "@saleor/i18n"; +import { sectionNames } from "@saleor/intl"; import { ListActions, PageListProps } from "@saleor/types"; import CategoryList from "../CategoryList"; @@ -36,31 +37,39 @@ export const CategoryListPage: React.StatelessComponent = ({ toggle, toggleAll, toolbar -}) => ( - - - - - - -); +}) => { + const intl = useIntl(); + return ( + + + + + + + ); +}; CategoryListPage.displayName = "CategoryListPage"; export default CategoryListPage; diff --git a/src/categories/components/CategoryProducts/CategoryProducts.tsx b/src/categories/components/CategoryProducts/CategoryProducts.tsx index 56d7ec5fe..199007f55 100644 --- a/src/categories/components/CategoryProducts/CategoryProducts.tsx +++ b/src/categories/components/CategoryProducts/CategoryProducts.tsx @@ -13,13 +13,13 @@ import TableFooter from "@material-ui/core/TableFooter"; import TableHead from "@material-ui/core/TableHead"; import TableRow from "@material-ui/core/TableRow"; import React from "react"; +import { FormattedMessage, useIntl } from "react-intl"; import CardTitle from "@saleor/components/CardTitle"; import Skeleton from "@saleor/components/Skeleton"; import TableCellAvatar from "@saleor/components/TableCellAvatar"; import TablePagination from "@saleor/components/TablePagination"; -import i18n from "../../../i18n"; -import { maybe, renderCollection } from "../../../misc"; +import { maybe, renderCollection } from "@saleor/misc"; const styles = (theme: Theme) => createStyles({ @@ -61,76 +61,103 @@ export const ProductList = withStyles(styles, { name: "ProductList" })( onNextPage, onPreviousPage, onRowClick - }: ProductListProps) => ( - - - {i18n.t("Add product")} - - } - /> - - - - {(products === undefined || products.length > 0) && } - - {i18n.t("Name", { context: "object" })} - - {i18n.t("Type", { context: "object" })} - - - - - - - - - {renderCollection( - products, - product => ( - - product.thumbnail.url)} + }: ProductListProps) => { + const intl = useIntl(); + + return ( + + + + + } + /> +
+ + + {(products === undefined || products.length > 0) && } + + - - {product ? ( - - {product.name} - - ) : ( - - )} - - - {product && product.productType ? ( - product.productType.name - ) : ( - - )} - - - ), - () => ( - - {i18n.t("No products found")} - - ) - )} - -
- - ) + + + + + + + + + + + + + {renderCollection( + products, + product => ( + + product.thumbnail.url)} + /> + + {product ? ( + + {product.name} + + ) : ( + + )} + + + {product && product.productType ? ( + product.productType.name + ) : ( + + )} + + + ), + () => ( + + + + + + ) + )} + + + + ); + } ); ProductList.displayName = "CategoryProductList"; export default ProductList; diff --git a/src/categories/components/CategoryProductsCard/CategoryProductsCard.tsx b/src/categories/components/CategoryProductsCard/CategoryProductsCard.tsx index e862eb68b..fcb9fb15d 100644 --- a/src/categories/components/CategoryProductsCard/CategoryProductsCard.tsx +++ b/src/categories/components/CategoryProductsCard/CategoryProductsCard.tsx @@ -1,10 +1,10 @@ import Button from "@material-ui/core/Button"; import Card from "@material-ui/core/Card"; import React from "react"; +import { FormattedMessage, useIntl } from "react-intl"; import CardTitle from "@saleor/components/CardTitle"; import ProductList from "@saleor/components/ProductList"; -import i18n from "../../../i18n"; import { ListActions, PageListProps } from "../../../types"; import { CategoryDetails_category_products_edges_node } from "../../types/CategoryDetails"; @@ -29,35 +29,51 @@ export const CategoryProductsCard: React.StatelessComponent< toggle, toggleAll, toolbar -}) => ( - - - {i18n.t("Add product")} - - } - /> - - -); +}) => { + const intl = useIntl(); + return ( + + + + + } + /> + + + ); +}; CategoryProductsCard.displayName = "CategoryProductsCard"; export default CategoryProductsCard; diff --git a/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx b/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx index 2b944e305..ad8756128 100644 --- a/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx +++ b/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx @@ -1,5 +1,6 @@ import { RawDraftContentState } from "draft-js"; import React from "react"; +import { useIntl, FormattedMessage } from "react-intl"; import AppHeader from "@saleor/components/AppHeader"; import { CardSpacer } from "@saleor/components/CardSpacer"; @@ -10,7 +11,6 @@ import PageHeader from "@saleor/components/PageHeader"; import SaveButtonBar from "@saleor/components/SaveButtonBar"; import SeoForm from "@saleor/components/SeoForm"; import { Tab, TabContainer } from "@saleor/components/Tab"; -import i18n from "../../../i18n"; import { maybe } from "../../../misc"; import { TabListActions, UserError } from "../../../types"; import CategoryDetailsForm from "../../components/CategoryDetailsForm"; @@ -96,6 +96,7 @@ export const CategoryUpdatePage: React.StatelessComponent< toggle, toggleAll }: CategoryUpdatePageProps) => { + const intl = useIntl(); const initialData: FormData = category ? { backgroundImageAlt: maybe(() => category.backgroundImage.alt, ""), @@ -139,9 +140,11 @@ export const CategoryUpdatePage: React.StatelessComponent< /> - {i18n.t("Subcategories")} + - {i18n.t("Products")} + @@ -204,9 +215,6 @@ export const CategoryUpdatePage: React.StatelessComponent< onCancel={onBack} onDelete={onDelete} onSave={submit} - labels={{ - delete: i18n.t("Delete category") - }} state={saveButtonBarState} disabled={disabled || !hasChanged} /> diff --git a/src/categories/views/CategoryCreate.tsx b/src/categories/views/CategoryCreate.tsx index 03f42f937..e015cf14f 100644 --- a/src/categories/views/CategoryCreate.tsx +++ b/src/categories/views/CategoryCreate.tsx @@ -1,9 +1,9 @@ import React from "react"; +import { useIntl } from "react-intl"; import { WindowTitle } from "@saleor/components/WindowTitle"; import useNavigator from "@saleor/hooks/useNavigator"; import useNotifier from "@saleor/hooks/useNotifier"; -import i18n from "../../i18n"; import { getMutationState, maybe } from "../../misc"; import CategoryCreatePage from "../components/CategoryCreatePage"; import { TypedCategoryCreateMutation } from "../mutations"; @@ -19,10 +19,16 @@ export const CategoryCreateView: React.StatelessComponent< > = ({ parentId }) => { const navigate = useNavigator(); const notify = useNotifier(); + const intl = useIntl(); const handleSuccess = (data: CategoryCreate) => { if (data.categoryCreate.errors.length === 0) { - notify({ text: i18n.t("Category created") }); + notify({ + text: intl.formatMessage({ + defaultMessage: "Category created", + id: "categoryCreateCategoryCreated" + }) + }); navigate(categoryUrl(data.categoryCreate.category.id)); } }; @@ -42,7 +48,13 @@ export const CategoryCreateView: React.StatelessComponent< return ( <> - + { if (data.categoryDelete.errors.length === 0) { notify({ - text: i18n.t("Category deleted", { - context: "notification" + text: intl.formatMessage({ + defaultMessage: "Category deleted", + id: "categoryDetailsCategoryDeleted" }) }); navigate(categoryListUrl()); @@ -140,7 +142,10 @@ export const CategoryDetails: React.StatelessComponent< if (data.categoryBulkDelete.errors.length === 0) { closeModal(); notify({ - text: i18n.t("Categories removed") + text: intl.formatMessage({ + defaultMessage: "Categories removed", + id: "categoryDetailsCategoriesRemoved" + }) }); refetch(); reset(); @@ -151,7 +156,10 @@ export const CategoryDetails: React.StatelessComponent< if (data.productBulkDelete.errors.length === 0) { closeModal(); notify({ - text: i18n.t("Products removed") + text: intl.formatMessage({ + defaultMessage: "Products removed", + id: "categoryDetailsProductsRemoved" + }) }); refetch(); reset(); @@ -319,32 +327,43 @@ export const CategoryDetails: React.StatelessComponent< deleteCategory({ variables: { id } }) } open={params.action === "delete"} - title={i18n.t("Delete category", { - context: "modal title" + title={intl.formatMessage({ + defaultMessage: "Delete category", + description: "dialog title", + id: + "categoryDetailsDeleteCategoryDialogTitle" })} variant="delete" > - {{ categoryName }}?
", - { - categoryName: maybe( - () => data.category.name - ), - context: "modal message" - } - ) - }} - /> - {i18n.t( - "Remember that this will also remove all products assigned to this category." - )} + + {maybe( + () => data.category.name, + "..." + )} + + ) + }} + /> + + + params.ids.length > 0) + } confirmButtonState={ categoryBulkDeleteMutationState } @@ -354,27 +373,30 @@ export const CategoryDetails: React.StatelessComponent< variables: { ids: params.ids } }) } - title={i18n.t("Remove categories")} + title={intl.formatMessage({ + defaultMessage: "Remove categories", + description: "dialog title", + id: + "categoryDetailsDeleteSubcategoriesDialogTitle" + })} variant="delete" > - {{ number }} categories?", - { - number: maybe( - () => - params.ids.length.toString(), - "..." - ) - } - ) - }} - /> - {i18n.t( - "Remember that this will also remove all products assigned to this category." - )} + {params.ids.length} + ) + }} + /> + + + - {{ number }} products?", - { - number: maybe( - () => - params.ids.length.toString(), - "..." - ) - } - ) - }} - /> + {" "} + + {params.ids.length} + ) + }} + /> + ); diff --git a/src/categories/views/CategoryList.tsx b/src/categories/views/CategoryList.tsx index a9520ceb5..35ab4194b 100644 --- a/src/categories/views/CategoryList.tsx +++ b/src/categories/views/CategoryList.tsx @@ -2,6 +2,7 @@ import DialogContentText from "@material-ui/core/DialogContentText"; import IconButton from "@material-ui/core/IconButton"; import DeleteIcon from "@material-ui/icons/Delete"; import React from "react"; +import { FormattedMessage, useIntl } from "react-intl"; import ActionDialog from "@saleor/components/ActionDialog"; import useBulkActions from "@saleor/hooks/useBulkActions"; @@ -10,7 +11,6 @@ import useNavigator from "@saleor/hooks/useNavigator"; import usePaginator, { createPaginationState } from "@saleor/hooks/usePaginator"; -import i18n from "@saleor/i18n"; import { getMutationState, maybe } from "@saleor/misc"; import { ListViews } from "@saleor/types"; import { CategoryListPage } from "../components/CategoryListPage/CategoryListPage"; @@ -39,6 +39,8 @@ export const CategoryList: React.StatelessComponent = ({ const { updateListSettings, settings } = useListSettings( ListViews.CATEGORY_LIST ); + const intl = useIntl(); + const paginationState = createPaginationState(settings.rowNumber, params); return ( @@ -124,26 +126,25 @@ export const CategoryList: React.StatelessComponent = ({ }) } open={params.action === "delete"} - title={i18n.t("Remove categories")} + title={intl.formatMessage({ + defaultMessage: "Remove categories", + description: "dialog title", + id: "categoryListDeleteSubcategoriesDialogTitle" + })} variant="delete" > - {{ number }} categories?", - { - number: maybe( - () => params.ids.length.toString(), - "..." - ) - } - ) + {params.ids.length} }} /> - {i18n.t( - "Remember that this will also remove all products assigned to this category." - )} + diff --git a/src/intl.ts b/src/intl.ts index 607d62970..29d8f55b3 100644 --- a/src/intl.ts +++ b/src/intl.ts @@ -9,11 +9,20 @@ export const commonMessages = defineMessages({ defaultMessage: "Confirm", id: "confirm" }, - generalInformations:{ - defaultMessage: "General Informations", - id:"generalInformations" + description: { + defaultMessage: "Description", + id: "description" }, - properties:{ + generalInformations: { + defaultMessage: "General Informations", + id: "generalInformations" + }, + optionalField: { + defaultMessage: "Optional", + description: "field is optional", + id: "optionalField" + }, + properties: { defaultMessage: "Properties", id: "properties" }, @@ -24,6 +33,11 @@ export const commonMessages = defineMessages({ savedChanges: { defaultMessage: "Saved changes", id: "savedChanges" + }, + uploadImage: { + defaultMessage: "Upload image", + description: "button", + id: "uploadImage" } }); @@ -32,5 +46,10 @@ export const sectionNames = defineMessages({ defaultMessage: "Attributes", description: "attributes section name", id: "attributes" + }, + categories: { + defaultMessage: "Categories", + description: "categories section name", + id: "categories" } });