From b4b1d9fd6cf03b23758d99c0bd0b53ff3a63745d Mon Sep 17 00:00:00 2001 From: "Sharad." Date: Sun, 13 Sep 2026 08:29:24 +0000 Subject: [PATCH] feat: add Go to source links on reference pages Add a footer link on reference pages pointing to the JSON source file in the processing-website repository for the active locale. Fixes #704 --- i18n/react-intl/en.json | 2 ++ i18n/react-intl/es.json | 2 ++ src/components/reference/GoToSource.js | 25 +++++++++++++++++++ .../reference/GoToSource.module.css | 5 ++++ src/templates/reference/class.js | 3 +++ src/templates/reference/field.js | 3 +++ src/templates/reference/function.js | 3 +++ src/utils/paths.js | 6 +++++ 8 files changed, 49 insertions(+) create mode 100644 src/components/reference/GoToSource.js create mode 100644 src/components/reference/GoToSource.module.css diff --git a/i18n/react-intl/en.json b/i18n/react-intl/en.json index 4389212d2..ce20f70c2 100644 --- a/i18n/react-intl/en.json +++ b/i18n/react-intl/en.json @@ -133,6 +133,8 @@ "relatedExamples": "Related Examples", "exampleInfo": "This example is for Processing 4+. If you have a previous version, use the examples included with your software. If you see any errors or have suggestions, please", "letUsKnow": " let us know", + "referenceSourceInfo": "If you see any errors or have suggestions, you can ", + "goToSource": "edit this page on GitHub", "syntax": "Syntax", "parameters": "Parameters", "return": "Return", diff --git a/i18n/react-intl/es.json b/i18n/react-intl/es.json index a5a3b0720..ee1db05a1 100644 --- a/i18n/react-intl/es.json +++ b/i18n/react-intl/es.json @@ -133,6 +133,8 @@ "relatedExamples": "Ejemplos Relacionados", "exampleInfo": "Este ejemplo es para Processing 3+. Si tienes una versión previa, usa los ejemplos incluidos con tu software. Si te encuentras con errores o tienes sugerencias, por favor", "letUsKnow": " háznoslo saber", + "referenceSourceInfo": "Si encuentras errores o tienes sugerencias, puedes ", + "goToSource": "editar esta página en GitHub", "syntax": "Sintaxis", "parameters": "Parámetros", "return": "Regresa", diff --git a/src/components/reference/GoToSource.js b/src/components/reference/GoToSource.js new file mode 100644 index 000000000..ed0ebf22f --- /dev/null +++ b/src/components/reference/GoToSource.js @@ -0,0 +1,25 @@ +import React, { memo } from 'react'; +import { useIntl } from 'react-intl'; +import { useLocalization } from 'gatsby-theme-i18n'; + +import { referenceSourceUrl } from '../../utils/paths'; + +import * as css from './GoToSource.module.css'; + +const GoToSource = ({ name, libraryName }) => { + const intl = useIntl(); + const { locale } = useLocalization(); + const url = referenceSourceUrl(name, libraryName, locale || 'en'); + + return ( +

+ {intl.formatMessage({ id: 'referenceSourceInfo' })} + + {intl.formatMessage({ id: 'goToSource' })} + + . +

+ ); +}; + +export default memo(GoToSource); diff --git a/src/components/reference/GoToSource.module.css b/src/components/reference/GoToSource.module.css new file mode 100644 index 000000000..627fa3c20 --- /dev/null +++ b/src/components/reference/GoToSource.module.css @@ -0,0 +1,5 @@ +.root { + padding-top: var(--gutter-double); + color: var(--processing-blue-dark); + margin: 0; +} diff --git a/src/templates/reference/class.js b/src/templates/reference/class.js index 37c076f4c..69bc24437 100644 --- a/src/templates/reference/class.js +++ b/src/templates/reference/class.js @@ -13,6 +13,7 @@ import Content from '../../components/ContentWithSidebar'; import { SidebarTree } from '../../components/Sidebar'; import Section from '../../components/reference/Section'; import License from '../../components/reference/License'; +import GoToSource from '../../components/reference/GoToSource'; import { CodeList, ExampleList } from '../../components/reference/ContentList'; import { ExampleItem } from '../../components/examples/ExamplesList'; import Breadcrumbs from '../../components/Breadcrumbs'; @@ -133,6 +134,7 @@ const ClassRefTemplate = ({ data, pageContext }) => { )} + ) : ( @@ -142,6 +144,7 @@ const ClassRefTemplate = ({ data, pageContext }) => { {' '} {intl.formatMessage({ id: 'englishPage' })} + )} diff --git a/src/templates/reference/field.js b/src/templates/reference/field.js index 54fde533e..90093bd14 100644 --- a/src/templates/reference/field.js +++ b/src/templates/reference/field.js @@ -12,6 +12,7 @@ import Content from '../../components/ContentWithSidebar'; import { SidebarTree } from '../../components/Sidebar'; import Section from '../../components/reference/Section'; import License from '../../components/reference/License'; +import GoToSource from '../../components/reference/GoToSource'; import { CodeList, ExampleList } from '../../components/reference/ContentList'; import { ExampleItem } from '../../components/examples/ExamplesList'; import Breadcrumbs from '../../components/Breadcrumbs'; @@ -133,6 +134,7 @@ const FieldRefTemplate = ({ data, pageContext }) => { )} + ) : ( @@ -142,6 +144,7 @@ const FieldRefTemplate = ({ data, pageContext }) => { {' '} {intl.formatMessage({ id: 'englishPage' })} + )} diff --git a/src/templates/reference/function.js b/src/templates/reference/function.js index c93c71ce7..0db5dd618 100644 --- a/src/templates/reference/function.js +++ b/src/templates/reference/function.js @@ -12,6 +12,7 @@ import Content from '../../components/ContentWithSidebar'; import { SidebarTree } from '../../components/Sidebar'; import Section from '../../components/reference/Section'; import License from '../../components/reference/License'; +import GoToSource from '../../components/reference/GoToSource'; import { CodeList, ExampleList } from '../../components/reference/ContentList'; import { ExampleItem } from '../../components/examples/ExamplesList'; import Breadcrumbs from '../../components/Breadcrumbs'; @@ -147,6 +148,7 @@ const RefTemplate = ({ data, pageContext, ...props }) => { )} + ) : ( @@ -156,6 +158,7 @@ const RefTemplate = ({ data, pageContext, ...props }) => { {' '} {intl.formatMessage({ id: 'englishPage' })} + )} diff --git a/src/utils/paths.js b/src/utils/paths.js index b2b6f1caa..17efd029f 100644 --- a/src/utils/paths.js +++ b/src/utils/paths.js @@ -35,9 +35,15 @@ const referencePath = (name, libraryName, lang) => { **/ const pathToName = (name) => name.replace(/_$/g, '()').replace(/_/g, '::'); +const referenceSourceUrl = (name, libraryName, lang = 'en') => { + const filePath = `content/references/translations/${lang}/${libraryName}/${name}.json`; + return `https://github.com/processing/processing-website/blob/main/${filePath}`; +}; + module.exports = { exampleSlug, examplePath, referencePath, + referenceSourceUrl, pathToName };