ux(datasheet): soften the purchase link — "Buy" becomes a localized "Product page"
The word "Buy" on a solid button read as an ad inside a work dialog. The link is really a pointer to the part's product page, so it now says that — localized in all nine languages — with an external-link icon instead of a shopping cart. Same URL, same placement, in both the part inspector and the picker hover card.
This commit is contained in:
parent
16c3089c5f
commit
b1c9c41849
|
|
@ -20,6 +20,7 @@
|
|||
|
||||
import React from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
import remarkGfm from 'remark-gfm';
|
||||
import type { PropertyDescriptor } from '../types/component-metadata';
|
||||
|
|
@ -114,6 +115,7 @@ export const ComponentInfoBody: React.FC<{
|
|||
/** false = doc/description + tags + Buy only (the dialog has its own props UI). */
|
||||
showProps?: boolean;
|
||||
}> = ({ data, showProps = true }) => {
|
||||
const { t: translate } = useTranslation();
|
||||
const doc = useComponentDoc(data.id);
|
||||
|
||||
const visibleProps = data.properties.filter((p) => !HIDDEN_PROPS.has(p.name));
|
||||
|
|
@ -178,11 +180,11 @@ export const ComponentInfoBody: React.FC<{
|
|||
strokeLinejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<circle cx="9" cy="21" r="1" />
|
||||
<circle cx="20" cy="21" r="1" />
|
||||
<path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6" />
|
||||
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
|
||||
<polyline points="15 3 21 3 21 9" />
|
||||
<line x1="10" y1="14" x2="21" y2="3" />
|
||||
</svg>
|
||||
Buy
|
||||
{translate('editor.inspector.productPage')}
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -788,11 +788,11 @@ export const PartInspectorDialog: React.FC<PartInspectorDialogProps> = ({
|
|||
strokeLinejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<circle cx="9" cy="21" r="1" />
|
||||
<circle cx="20" cy="21" r="1" />
|
||||
<path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6" />
|
||||
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
|
||||
<polyline points="15 3 21 3 21 9" />
|
||||
<line x1="10" y1="14" x2="21" y2="3" />
|
||||
</svg>
|
||||
Buy
|
||||
{t('editor.inspector.productPage')}
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Eigenschaften",
|
||||
"datasheetTab": "Datenblatt",
|
||||
"examplesTitle": "Beispielprojekte"
|
||||
"examplesTitle": "Beispielprojekte",
|
||||
"productPage": "Produktseite"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -394,7 +394,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Properties",
|
||||
"datasheetTab": "Datasheet",
|
||||
"examplesTitle": "Example projects"
|
||||
"examplesTitle": "Example projects",
|
||||
"productPage": "Product page"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -394,7 +394,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Propiedades",
|
||||
"datasheetTab": "Ficha técnica",
|
||||
"examplesTitle": "Proyectos de ejemplo"
|
||||
"examplesTitle": "Proyectos de ejemplo",
|
||||
"productPage": "Ver producto"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Propriétés",
|
||||
"datasheetTab": "Fiche technique",
|
||||
"examplesTitle": "Projets d’exemple"
|
||||
"examplesTitle": "Projets d’exemple",
|
||||
"productPage": "Page produit"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Proprietà",
|
||||
"datasheetTab": "Scheda tecnica",
|
||||
"examplesTitle": "Progetti di esempio"
|
||||
"examplesTitle": "Progetti di esempio",
|
||||
"productPage": "Pagina prodotto"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "プロパティ",
|
||||
"datasheetTab": "データシート",
|
||||
"examplesTitle": "サンプルプロジェクト"
|
||||
"examplesTitle": "サンプルプロジェクト",
|
||||
"productPage": "製品ページ"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Propriedades",
|
||||
"datasheetTab": "Ficha técnica",
|
||||
"examplesTitle": "Projetos de exemplo"
|
||||
"examplesTitle": "Projetos de exemplo",
|
||||
"productPage": "Página do produto"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "Свойства",
|
||||
"datasheetTab": "Спецификация",
|
||||
"examplesTitle": "Примеры проектов"
|
||||
"examplesTitle": "Примеры проектов",
|
||||
"productPage": "Страница товара"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
|
|
@ -392,7 +392,8 @@
|
|||
"inspector": {
|
||||
"propertiesTab": "属性",
|
||||
"datasheetTab": "数据手册",
|
||||
"examplesTitle": "示例项目"
|
||||
"examplesTitle": "示例项目",
|
||||
"productPage": "产品页面"
|
||||
}
|
||||
},
|
||||
"about": {
|
||||
|
|
|
|||
Loading…
Reference in New Issue