fix: make Tutor-MFE config compatible with React Router v6

As part of the React Router v5 -> v6 upgrade, history was no longer
being passed in. This broke the Tutor deployment method of MFEs, which
puts all the MFEs in a common server and uses different top-level dirs
to separate them.

The fix for this is to pass in an explicit basename to the Router.

src/initialize.js

@@ -102,6 +102,26 @@ export const history = (typeof window !== 'undefined')
     basename: getPath(getConfig().PUBLIC_PATH),
   }) : createMemoryHistory();
 
+/**
+ * The string basename that is the root directory of this MFE.
+ *
+ * In devstack, this should always just return an empty string, because each MFE is in its own
+ * server/domain.
+ *
+ * In Tutor, all MFEs are deployed to a common server, each under a different top-level directory.
+ * The basename is the root path for a given MFE, e.g. "/library-authoring". It is set by tutor-mfe
+ * as an ENV variable in the Docker file, and we read it here from that configuration so that it
+ * can be passed into a Router later.
+ *
+ * By convention, our basenames do not have a trailing slash. So it's "/library-authoring", and not
+ * "/library-authoring/". Our configuration is inconsistent on this, so this function always strips
+ * off the trailing slash from any value entered in configuration.
+ */
+export function basename() {
+  const configBasename = getPath(getConfig().PUBLIC_PATH);
+  return configBasename.endsWith('/') ? configBasename.slice(0, -1) : configBasename;
+}
+
 /**
  * The default handler for the initialization lifecycle's `initError` phase.  Logs the error to the
  * LoggingService using `logError`

src/react/AppProvider.jsx

@@ -16,6 +16,7 @@ import {
   IntlProvider,
   LOCALE_CHANGED,
 } from '../i18n';
+import { basename } from '../initialize';
 
 /**
  * A wrapper component for React-based micro-frontends to initialize a number of common data/
@@ -72,7 +73,7 @@ export default function AppProvider({ store, children, wrapWithRouter }) {
         >
           <OptionalReduxProvider store={store}>
             {wrapWithRouter ? (
-              <Router>
+              <Router basename={basename()}>
                 {children}
               </Router>
             ) : children}