diff --git a/README.md b/README.md
index 9c42ab660..a84784317 100644
--- a/README.md
+++ b/README.md
@@ -113,6 +113,24 @@ const ExampleComponent = () => {
};
```
+#### Overriding default external links
+
+A `getExternalLinkUrl` function is provided in `config.js` which can be used to override default external links. To make use of this function, provide an object that maps default links to custom links. This object should be added to the `config` object defined in the `env.config.[js,jsx,ts,tsx]`, and must be named `externalLinkUrlOverrides`. Here is an example:
+
+```js
+// env.config.js
+
+const config = {
+ // other custom configuration here
+ externalLinkUrlOverrides: {
+ "https://docs.openedx.org/en/latest/educators/index.html": "https://custom.example.com/educators/index.html",
+ "https://creativecommons.org/licenses": "https://www.tldrlegal.com/license/creative-commons-attribution-cc",
+ },
+};
+
+export default config;
+```
+
### Service interfaces
Each service (analytics, auth, i18n, logging) provided by frontend-platform has an API contract which all implementations of that service are guaranteed to fulfill. Applications that use frontend-platform can use its configured services via a convenient set of exported functions. An application that wants to use the service interfaces need only initialize them via the initialize() function, optionally providing custom service interfaces as desired (you probably won't need to).
diff --git a/env.config.js b/env.config.js
index f4585f66d..15227c4fe 100644
--- a/env.config.js
+++ b/env.config.js
@@ -3,6 +3,9 @@
// Also note that in an actual application this file would be added to .gitignore.
const config = {
JS_FILE_VAR: 'JS_FILE_VAR_VALUE_FOR_EXAMPLE_APP',
+ externalLinkUrlOverrides: {
+ "https://github.com/openedx/docs.openedx.org/": "https://docs.openedx.org/",
+ }
};
export default config;
diff --git a/example/ExamplePage.jsx b/example/ExamplePage.jsx
index 522512698..9d31fd8c2 100644
--- a/example/ExamplePage.jsx
+++ b/example/ExamplePage.jsx
@@ -5,7 +5,9 @@ import { Link } from 'react-router-dom';
import { injectIntl, useIntl } from '@edx/frontend-platform/i18n';
import { logInfo } from '@edx/frontend-platform/logging';
import { AppContext } from '@edx/frontend-platform/react';
-import { ensureConfig, mergeConfig, getConfig } from '@edx/frontend-platform';
+import {
+ ensureConfig, mergeConfig, getConfig, getExternalLinkUrl,
+} from '@edx/frontend-platform';
/* eslint-enable import/no-extraneous-dependencies */
import messages from './messages';
@@ -49,6 +51,8 @@ function ExamplePage() {
EXAMPLE_VAR env var came through: {getConfig().EXAMPLE_VAR}
JS_FILE_VAR var came through: {getConfig().JS_FILE_VAR}
+External link to Open edX docs (customized link).
+External link to Open edX OEPs (non-customized link).
Visit authenticated page.
Visit error page.
diff --git a/src/config.js b/src/config.js index ebbb3be99..43486d18e 100644 --- a/src/config.js +++ b/src/config.js @@ -307,6 +307,34 @@ export function ensureConfig(keys, requester = 'unspecified application code') { }); } +/** + * Get an external link URL based on the URL provided. If the passed in URL is overridden in the + * `externalLinkUrlOverrides` object, it will return the overridden URL. Otherwise, it will return + * the provided URL. + * + * + * @param {string} url - The default URL. + * @returns {string} - The external link URL. Defaults to the input URL if not found in the + * `externalLinkUrlOverrides` object. If the input URL is invalid, '#' is returned. + * + * @example + * import { getExternalLinkUrl } from '@edx/frontend-platform'; + * + *