Initial commit

src/example/ExamplePage.jsx

@@ -0,0 +1,12 @@
+import { Container } from '@openedx/paragon';
+
+const ExamplePage = () => (
+  <main>
+    <Container className="py-5">
+      <h1>Example Page</h1>
+      <p>Hello world!</p>
+    </Container>
+  </main>
+);
+
+export default ExamplePage;

src/example/ExamplePage.test.jsx

@@ -0,0 +1,5 @@
+describe('example', () => {
+  it('will pass because it is an example', () => {
+
+  });
+});

src/example/data/README.rst

@@ -0,0 +1,4 @@
+data folder
+===========
+
+This folder is the home for non-component files, such as redux reducers, actions, selectors, API client services, etc.  See `Feature-based Application Organization <https://github.com/openedx/frontend-template-application/blob/master/docs/decisions/0002-feature-based-application-organization.rst>`_. for more detail.

src/i18n/index.js

@@ -0,0 +1,2 @@
+// Placeholder be overridden by `make pull_translations`
+export default [];

src/index.jsx

@@ -0,0 +1,34 @@
+import 'core-js/stable';
+import 'regenerator-runtime/runtime';
+
+import {
+  APP_INIT_ERROR, APP_READY, subscribe, initialize,
+} from '@edx/frontend-platform';
+import { AppProvider, ErrorPage } from '@edx/frontend-platform/react';
+import ReactDOM from 'react-dom';
+
+import Header from '@edx/frontend-component-header';
+import { FooterSlot } from '@edx/frontend-component-footer';
+import messages from './i18n';
+import ExamplePage from './example/ExamplePage';
+
+import './index.scss';
+
+subscribe(APP_READY, () => {
+  ReactDOM.render(
+    <AppProvider>
+      <Header />
+      <ExamplePage />
+      <FooterSlot />
+    </AppProvider>,
+    document.getElementById('root'),
+  );
+});
+
+subscribe(APP_INIT_ERROR, (error) => {
+  ReactDOM.render(<ErrorPage message={error.message} />, document.getElementById('root'));
+});
+
+initialize({
+  messages,
+});

src/index.scss

@@ -0,0 +1,6 @@
+@use "@openedx/paragon/styles/css/core/custom-media-breakpoints" as paragonCustomMediaBreakpoints;
+
+@import './example/index.scss';
+
+@import "~@edx/frontend-component-header/dist/index";
+@import "~@edx/frontend-component-footer/dist/footer";

src/plugin-slots/FooterSlot/README.md

@@ -0,0 +1,53 @@
+# Footer Slot
+
+### Slot ID: `org.openedx.frontend.layout.footer.v1`
+
+### Slot ID Aliases
+* `footer_slot`
+
+## Description
+
+This slot is used to replace/modify/hide the footer.
+
+The implementation of the `FooterSlot` component lives in [the `frontend-component-footer` repository](https://github.com/openedx/frontend-component-footer/).
+
+## Example
+
+The following `env.config.jsx` will replace the default footer.
+
+![Screenshot of Default Footer](./images/default_footer.png)
+
+with a simple custom footer
+
+![Screenshot of Custom Footer](./images/custom_footer.png)
+
+```jsx
+import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-framework';
+
+const config = {
+  pluginSlots: {
+    'org.openedx.frontend.layout.footer.v1': {
+      plugins: [
+        {
+          // Hide the default footer
+          op: PLUGIN_OPERATIONS.Hide,
+          widgetId: 'default_contents',
+        },
+        {
+          // Insert a custom footer
+          op: PLUGIN_OPERATIONS.Insert,
+          widget: {
+            id: 'custom_footer',
+            type: DIRECT_PLUGIN,
+            RenderWidget: () => (
+              <h1 style={{textAlign: 'center'}}>🦶</h1>
+            ),
+          },
+        },
+      ]
+    }
+  },
+}
+
+export default config;
+```

src/plugin-slots/README.md

@@ -0,0 +1,3 @@
+# `frontend-app-profile` Plugin Slots
+
+* [`org.openedx.frontend.layout.footer.v1`](./FooterSlot/)

src/setupTest.js

@@ -0,0 +1,2 @@
+import 'core-js/stable';
+import 'regenerator-runtime/runtime';