1
0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2025-02-20 14:54:15 +01:00

(bug) html not interpreted in product form

This commit is contained in:
Sylvain 2023-02-16 11:37:24 +01:00
parent 79651d6b3c
commit 2fb18b8a1b
2 changed files with 10 additions and 6 deletions

View File

@ -3,16 +3,19 @@ import { useTranslation } from 'react-i18next';
interface HtmlTranslateProps {
trKey: string,
className?: string,
options?: Record<string, string|number>
}
/**
* This component renders a translation with some HTML content.
*/
export const HtmlTranslate: React.FC<HtmlTranslateProps> = ({ trKey, options }) => {
export const HtmlTranslate: React.FC<HtmlTranslateProps> = ({ trKey, className, options }) => {
const { t } = useTranslation(trKey?.split('.')[1]);
/* eslint-disable fabmanager/component-class-named-as-component */
return (
<span dangerouslySetInnerHTML={{ __html: t(trKey, options) }} />
<span className={className || ''} dangerouslySetInnerHTML={{ __html: t(trKey, options) }} />
);
/* eslint-enable fabmanager/component-class-named-as-component */
};

View File

@ -24,6 +24,7 @@ import { FormMultiFileUpload } from '../form/form-multi-file-upload';
import { FormMultiImageUpload } from '../form/form-multi-image-upload';
import { AdvancedAccountingForm } from '../accounting/advanced-accounting-form';
import { FabTabs } from '../base/fab-tabs';
import { HtmlTranslate } from '../base/html-translate';
interface ProductFormProps {
product: Product,
@ -198,7 +199,7 @@ export const ProductForm: React.FC<ProductFormProps> = ({ product, title, onSucc
<section>
<header>
<p className="title">{t('app.admin.store.product_form.product_images')}</p>
<p className="description">{t('app.admin.store.product_form.product_images_info')}</p>
<HtmlTranslate className="description" trKey="app.admin.store.product_form.product_images_info" />
</header>
<div className="content">
<FormMultiImageUpload setValue={setValue}
@ -241,7 +242,7 @@ export const ProductForm: React.FC<ProductFormProps> = ({ product, title, onSucc
<section>
<header>
<p className="title">{t('app.admin.store.product_form.assigning_category')}</p>
<p className="description">{t('app.admin.store.product_form.assigning_category_info')}</p>
<HtmlTranslate className="description" trKey="app.admin.store.product_form.assigning_category_info" />
</header>
<div className="content">
<FormSelect options={productCategories}
@ -255,7 +256,7 @@ export const ProductForm: React.FC<ProductFormProps> = ({ product, title, onSucc
<section>
<header>
<p className="title" role="heading">{t('app.admin.store.product_form.assigning_machines')}</p>
<p className="description">{t('app.admin.store.product_form.assigning_machines_info')}</p>
<HtmlTranslate className="description" trKey="app.admin.store.product_form.assigning_machines_info" />
</header>
<div className="content">
<FormChecklist options={machines}
@ -268,7 +269,7 @@ export const ProductForm: React.FC<ProductFormProps> = ({ product, title, onSucc
<section>
<header>
<p className="title">{t('app.admin.store.product_form.product_files')}</p>
<p className="description">{t('app.admin.store.product_form.product_files_info')}</p>
<HtmlTranslate className="description" trKey="app.admin.store.product_form.product_files_info" />
</header>
<div className="content">
<FormMultiFileUpload setValue={setValue}