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:
David Montero Crespo 2026-08-07 07:13:05 +02:00
parent 16c3089c5f
commit b1c9c41849
11 changed files with 28 additions and 17 deletions

View File

@ -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>
)}

View File

@ -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>
)}

View File

@ -392,7 +392,8 @@
"inspector": {
"propertiesTab": "Eigenschaften",
"datasheetTab": "Datenblatt",
"examplesTitle": "Beispielprojekte"
"examplesTitle": "Beispielprojekte",
"productPage": "Produktseite"
}
},
"about": {

View File

@ -394,7 +394,8 @@
"inspector": {
"propertiesTab": "Properties",
"datasheetTab": "Datasheet",
"examplesTitle": "Example projects"
"examplesTitle": "Example projects",
"productPage": "Product page"
}
},
"about": {

View File

@ -394,7 +394,8 @@
"inspector": {
"propertiesTab": "Propiedades",
"datasheetTab": "Ficha técnica",
"examplesTitle": "Proyectos de ejemplo"
"examplesTitle": "Proyectos de ejemplo",
"productPage": "Ver producto"
}
},
"about": {

View File

@ -392,7 +392,8 @@
"inspector": {
"propertiesTab": "Propriétés",
"datasheetTab": "Fiche technique",
"examplesTitle": "Projets d’exemple"
"examplesTitle": "Projets d’exemple",
"productPage": "Page produit"
}
},
"about": {

View File

@ -392,7 +392,8 @@
"inspector": {
"propertiesTab": "Proprietà",
"datasheetTab": "Scheda tecnica",
"examplesTitle": "Progetti di esempio"
"examplesTitle": "Progetti di esempio",
"productPage": "Pagina prodotto"
}
},
"about": {

View File

@ -392,7 +392,8 @@
"inspector": {
"propertiesTab": "プロパティ",
"datasheetTab": "データシート",
"examplesTitle": "サンプルプロジェクト"
"examplesTitle": "サンプルプロジェクト",
"productPage": "製品ページ"
}
},
"about": {

View File

@ -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": {

View File

@ -392,7 +392,8 @@
"inspector": {
"propertiesTab": "Свойства",
"datasheetTab": "Спецификация",
"examplesTitle": "Примеры проектов"
"examplesTitle": "Примеры проектов",
"productPage": "Страница товара"
}
},
"about": {

View File

@ -392,7 +392,8 @@
"inspector": {
"propertiesTab": "属性",
"datasheetTab": "数据手册",
"examplesTitle": "示例项目"
"examplesTitle": "示例项目",
"productPage": "产品页面"
}
},
"about": {