From de9a81892bda55cbc90d47eaabc694dfc6752529 Mon Sep 17 00:00:00 2001 From: Jason Wesson Date: Wed, 13 Mar 2024 16:50:32 +0000 Subject: [PATCH 1/3] fix: remove 'require' of env.config in webpack dev and prod * env.config.jsx won't be able to use 'import' statement for FPF if 'require' statement remains in webpack config * the 'require' statement was used in dev config to use PORT provided by env.config * the 'require' statment was used in prod config to assign some env variables if they existed in JS config --- patches/@openedx+frontend-build+13.0.28.patch | 63 +------------------ 1 file changed, 2 insertions(+), 61 deletions(-) diff --git a/patches/@openedx+frontend-build+13.0.28.patch b/patches/@openedx+frontend-build+13.0.28.patch index f88b39e..7982c67 100644 --- a/patches/@openedx+frontend-build+13.0.28.patch +++ b/patches/@openedx+frontend-build+13.0.28.patch @@ -22,48 +22,8 @@ index ac5f730..ddce396 100644 } module.exports = { -diff --git a/node_modules/@openedx/frontend-build/config/webpack.dev.config.js b/node_modules/@openedx/frontend-build/config/webpack.dev.config.js -index 5ce7716..2fbc646 100644 ---- a/node_modules/@openedx/frontend-build/config/webpack.dev.config.js -+++ b/node_modules/@openedx/frontend-build/config/webpack.dev.config.js -@@ -6,6 +6,7 @@ const { merge } = require('webpack-merge'); - const Dotenv = require('dotenv-webpack'); - const dotenv = require('dotenv'); - const HtmlWebpackPlugin = require('html-webpack-plugin'); -+const fs = require('fs'); - const path = require('path'); - const PostCssAutoprefixerPlugin = require('autoprefixer'); - const PostCssRTLCSS = require('postcss-rtlcss'); -@@ -17,6 +18,18 @@ const presets = require('../lib/presets'); - const resolvePrivateEnvConfig = require('../lib/resolvePrivateEnvConfig'); - const getLocalAliases = require('./getLocalAliases'); - -+// Provides the env.config object that is available in local development so that devserver port number -+// can be assigned below. If no env.config exists (JS or JSX), then it provides an empty object. -+let envConfig = {}; -+const envConfigPathJs = path.resolve(process.cwd(), './env.config.js'); -+const envConfigPathJsx = path.resolve(process.cwd(), './env.config.jsx'); -+ -+if (fs.existsSync(envConfigPathJs)) { -+ envConfig = require(envConfigPathJs); -+} else if (fs.existsSync(envConfigPathJsx)) { -+ envConfig = require(envConfigPathJsx); -+} -+ - // Add process env vars. Currently used only for setting the - // server port and the publicPath - dotenv.config({ -@@ -174,7 +187,7 @@ module.exports = merge(commonConfig, { - // reloading. - devServer: { - host: '0.0.0.0', -- port: process.env.PORT || 8080, -+ port: envConfig.PORT || process.env.PORT || 8080, - historyApiFallback: { - index: path.join(PUBLIC_PATH, 'index.html'), - disableDotRule: true, diff --git a/node_modules/@openedx/frontend-build/config/webpack.prod.config.js b/node_modules/@openedx/frontend-build/config/webpack.prod.config.js -index 2879dd9..1ddb07f 100644 +index 2879dd9..4783e17 100644 --- a/node_modules/@openedx/frontend-build/config/webpack.prod.config.js +++ b/node_modules/@openedx/frontend-build/config/webpack.prod.config.js @@ -11,6 +11,7 @@ const dotenv = require('dotenv'); @@ -74,7 +34,7 @@ index 2879dd9..1ddb07f 100644 const path = require('path'); const PostCssAutoprefixerPlugin = require('autoprefixer'); const PostCssRTLCSS = require('postcss-rtlcss'); -@@ -23,6 +24,25 @@ const HtmlWebpackNewRelicPlugin = require('../lib/plugins/html-webpack-new-relic +@@ -23,6 +24,22 @@ const HtmlWebpackNewRelicPlugin = require('../lib/plugins/html-webpack-new-relic const commonConfig = require('./webpack.common.config'); const presets = require('../lib/presets'); @@ -92,27 +52,8 @@ index 2879dd9..1ddb07f 100644 +if (envConfigPath) { + const envConfigFilename = envConfigPath.slice(envConfigPath.indexOf('env.config')); + fs.copyFileSync(envConfigPath, envConfigFilename); -+ -+ const newConfigFilepath = path.resolve(process.cwd(), envConfigFilename); -+ envConfig = require(newConfigFilepath); +} + // Add process env vars. Currently used only for setting the PUBLIC_PATH. dotenv.config({ path: path.resolve(process.cwd(), '.env'), -@@ -45,12 +65,12 @@ if (process.env.ENABLE_NEW_RELIC !== 'false') { - agentID: process.env.NEW_RELIC_AGENT_ID || 'undefined_agent_id', - trustKey: process.env.NEW_RELIC_TRUST_KEY || 'undefined_trust_key', - licenseKey: process.env.NEW_RELIC_LICENSE_KEY || 'undefined_license_key', -- applicationID: process.env.NEW_RELIC_APP_ID || 'undefined_application_id', -+ applicationID: envConfig.NEW_RELIC_APP_ID || process.env.NEW_RELIC_APP_ID || 'undefined_application_id', - })); - extraPlugins.push(new NewRelicSourceMapPlugin({ -- applicationId: process.env.NEW_RELIC_APP_ID, -+ applicationId: envConfig.NEW_RELIC_APP_ID || process.env.NEW_RELIC_APP_ID, - apiKey: process.env.NEW_RELIC_ADMIN_KEY, -- staticAssetUrl: process.env.BASE_URL, -+ staticAssetUrl: envConfig.BASE_URL || process.env.BASE_URL, - // upload source maps in prod builds only - noop: typeof process.env.NEW_RELIC_ADMIN_KEY === 'undefined', - })); From 50a125c56bcb96c928eb60ea73330a1625a9069b Mon Sep 17 00:00:00 2001 From: Jason Wesson Date: Thu, 14 Mar 2024 19:37:35 +0000 Subject: [PATCH 2/3] feat: wrap Footer with Plugin Slot --- package-lock.json | 97 +++++++++++++++++++++++++++++++++++++++++++++++ package.json | 1 + src/index.jsx | 7 +++- 3 files changed, 104 insertions(+), 1 deletion(-) diff --git a/package-lock.json b/package-lock.json index d843572..f754a07 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@edx/frontend-component-footer": "13.0.3", "@edx/frontend-component-header": "5.0.2", "@edx/frontend-platform": "7.1.1", + "@edx/frontend-plugin-framework": "openedx/frontend-plugin-framework", "@edx/openedx-atlas": "^0.6.0", "@fortawesome/fontawesome-svg-core": "6.5.1", "@fortawesome/free-brands-svg-icons": "6.5.1", @@ -2406,6 +2407,91 @@ } } }, + "node_modules/@edx/frontend-plugin-framework": { + "version": "0.1.0", + "resolved": "git+ssh://git@github.com/openedx/frontend-plugin-framework.git#31d16bb6fae1c7c38e3fb7e389ac6cbc3c9a1360", + "license": "AGPL-3.0", + "dependencies": { + "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2", + "@edx/frontend-component-footer": "13.0.3", + "@edx/frontend-component-header": "5.0.2", + "@edx/frontend-platform": "^7.1.0", + "@fortawesome/fontawesome-svg-core": "1.2.36", + "@fortawesome/free-brands-svg-icons": "5.15.4", + "@fortawesome/free-regular-svg-icons": "5.15.4", + "@fortawesome/free-solid-svg-icons": "5.15.4", + "@fortawesome/react-fontawesome": "0.2.0", + "@openedx/paragon": "^21.0.0", + "classnames": "^2.3.2", + "core-js": "3.36.0", + "prop-types": "15.8.1", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-error-boundary": "^4.0.11", + "react-redux": "7.2.9", + "react-router": "6.22.2", + "react-router-dom": "6.22.2", + "redux": "4.2.1", + "regenerator-runtime": "0.14.1" + } + }, + "node_modules/@edx/frontend-plugin-framework/node_modules/@fortawesome/fontawesome-common-types": { + "version": "0.2.36", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.36.tgz", + "integrity": "sha512-a/7BiSgobHAgBWeN7N0w+lAhInrGxksn13uK7231n2m8EDPE3BMCl9NZLTGrj9ZXfCmC6LM0QLqXidIizVQ6yg==", + "hasInstallScript": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-plugin-framework/node_modules/@fortawesome/fontawesome-svg-core": { + "version": "1.2.36", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.36.tgz", + "integrity": "sha512-YUcsLQKYb6DmaJjIHdDWpBIGCcyE/W+p/LMGvjQem55Mm2XWVAP5kWTMKWLv9lwpCVjpLxPyOMOyUocP1GxrtA==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "^0.2.36" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-plugin-framework/node_modules/@fortawesome/free-brands-svg-icons": { + "version": "5.15.4", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.15.4.tgz", + "integrity": "sha512-f1witbwycL9cTENJegcmcZRYyawAFbm8+c6IirLmwbbpqz46wyjbQYLuxOc7weXFXfB7QR8/Vd2u5R3q6JYD9g==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "^0.2.36" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-plugin-framework/node_modules/@fortawesome/free-regular-svg-icons": { + "version": "5.15.4", + "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.15.4.tgz", + "integrity": "sha512-9VNNnU3CXHy9XednJ3wzQp6SwNwT3XaM26oS4Rp391GsxVYA+0oDR2J194YCIWf7jNRCYKjUCOduxdceLrx+xw==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "^0.2.36" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-plugin-framework/node_modules/@fortawesome/free-solid-svg-icons": { + "version": "5.15.4", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.15.4.tgz", + "integrity": "sha512-JLmQfz6tdtwxoihXLg6lT78BorrFyCf59SAwBM6qV/0zXyVeDygJVb3fk+j5Qat+Yvcxp1buLTY5iDh1ZSAQ8w==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "^0.2.36" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/@edx/new-relic-source-map-webpack-plugin": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@edx/new-relic-source-map-webpack-plugin/-/new-relic-source-map-webpack-plugin-2.1.0.tgz", @@ -18219,6 +18305,17 @@ "react": ">= 16.8 || 18.0.0" } }, + "node_modules/react-error-boundary": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-4.0.13.tgz", + "integrity": "sha512-b6PwbdSv8XeOSYvjt8LpgpKrZ0yGdtZokYwkwV2wlcZbxgopHX/hgPl5VgpnoVOWd868n1hktM8Qm4b+02MiLQ==", + "dependencies": { + "@babel/runtime": "^7.12.5" + }, + "peerDependencies": { + "react": ">=16.13.1" + } + }, "node_modules/react-error-overlay": { "version": "6.0.11", "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz", diff --git a/package.json b/package.json index 1d50651..d9ae79c 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "@edx/frontend-component-footer": "13.0.3", "@edx/frontend-component-header": "5.0.2", "@edx/frontend-platform": "7.1.1", + "@edx/frontend-plugin-framework": "openedx/frontend-plugin-framework", "@edx/openedx-atlas": "^0.6.0", "@fortawesome/fontawesome-svg-core": "6.5.1", "@fortawesome/free-brands-svg-icons": "6.5.1", diff --git a/src/index.jsx b/src/index.jsx index ca06a6e..c76318d 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -7,6 +7,7 @@ import { APP_INIT_ERROR, APP_READY, subscribe, initialize, mergeConfig, getConfig, } from '@edx/frontend-platform'; import { AppProvider, ErrorPage, AuthenticatedPageRoute } from '@edx/frontend-platform/react'; +import { PluginSlot } from '@edx/frontend-plugin-framework/src'; import { HelmetProvider } from 'react-helmet-async'; import Header from '@edx/frontend-component-header'; import Footer from '@edx/frontend-component-footer'; @@ -45,7 +46,11 @@ subscribe(APP_READY, () => { /> )} -