chore: [MICROBA-1498] Add bulk email component structure (#2)
* chore: Add bulk email component structure
This commit is contained in:
Thomas Tracy
@@ -1,7 +1,7 @@
|
||||
NODE_ENV='development'
|
||||
PORT=8080
|
||||
PORT=1984
|
||||
ACCESS_TOKEN_COOKIE_NAME='edx-jwt-cookie-header-payload'
|
||||
BASE_URL='http://localhost:8080'
|
||||
BASE_URL='http://localhost:1984'
|
||||
CREDENTIALS_BASE_URL='http://localhost:18150'
|
||||
CSRF_TOKEN_API_PATH='/csrf/api/v1/token'
|
||||
ECOMMERCE_BASE_URL='http://localhost:18130'
|
||||
|
||||
@@ -1,75 +0,0 @@
|
||||
|Build Status| |Codecov| |npm_version| |npm_downloads| |license| |semantic-release| ## As many of these as you'd like to include, or others if you wish!
|
||||
|
||||
frontend-app-[YOUR NAME HERE]
|
||||
==============================
|
||||
|
||||
Please tag **@edx/[YOUR-TEAM]** on any PRs or issues. Thanks!
|
||||
|
||||
Introduction
|
||||
------------
|
||||
|
||||
*What is this MFE? Add a 2-3 sentence description of what it is and what it does.*
|
||||
|
||||
*What is the _domain_ of this MFE? That is, what is in here, what belongs here? What's*
|
||||
*_not_ in here that people might think could belong here, but is purposefully excluded?*
|
||||
|
||||
*Add any additional detail/notes relevant to understanding the whats/whys of this*
|
||||
*MFE: could be links to publically available wikis/documents.*
|
||||
|
||||
Installation
|
||||
------------
|
||||
|
||||
This MFE is bundled with `Devstack <https://github.com/edx/devstack>`_, see the `Getting Started <https://github.com/edx/devstack#getting-started>`_ section for setup instructions.
|
||||
|
||||
1. Enumerated list of steps & code blocks, like this:
|
||||
|
||||
.. code-block::
|
||||
|
||||
mkdir -p ~/workspace/
|
||||
cd ~/workspace/
|
||||
git clone https://github.com/edx/devstack.git
|
||||
|
||||
2. Include as many screenshots as you can, to make your guide easier to follow! Include images with the following syntax:
|
||||
|
||||
|
||||
.. image:: ./docs/images/example_image.png
|
||||
|
||||
Environment Variables/Setup Notes
|
||||
---------------------------------
|
||||
|
||||
*Does this MFE rely on other MFEs, or LMS/Studio? Does it require use of specific APIs? Do certain settings*
|
||||
*need to be enabled?*
|
||||
|
||||
Any Other Relevant Sections
|
||||
---------------------------
|
||||
|
||||
*This is optional, but you might have additional sections you wish to cover such as i18n notes, build process*
|
||||
*notes, stuff about ADRs, stuff about architecture, or more.*
|
||||
|
||||
Known Issues
|
||||
------------
|
||||
|
||||
* A bulleted list of issues, ideally with JIRA ticket numbers attached
|
||||
|
||||
* OR - a link to a publically available wiki/document
|
||||
|
||||
Development Roadmap
|
||||
-------------------
|
||||
|
||||
The following is a list of current short-term development targets, in (rough) descending order of priority:
|
||||
|
||||
* A bulleted list of roadmap items, ideally with JIRA ticket numbers attached (but could just be
|
||||
a high-level overview of upcoming features/epics)
|
||||
|
||||
* OR - a link to a publically available wiki/document
|
||||
|
||||
|
||||
==============================
|
||||
|
||||
References (for authors of the README; delete this section before publishing)
|
||||
|
||||
* https://github.com/edx/frontend-app-library-authoring/blob/master/README.rst has many of the above discussed
|
||||
sections and implements them well
|
||||
|
||||
* https://opencraft.com/blog/introducing-open-edx-publisher/#how-does-it-work is an example of explaining when
|
||||
env variables/settings are required
|
||||
77
README.rst
77
README.rst
@@ -1,76 +1,51 @@
|
||||
|Build Status| |Codecov| |license|
|
||||
|Build Status| |Codecov| |license| |semantic-release| ## As many of these as you'd like to include, or others if you wish!
|
||||
|
||||
frontend-app-communications
|
||||
=================================
|
||||
==============================
|
||||
|
||||
Please tag **@edx/fedx-team** on any PRs or issues. Thanks.
|
||||
Please tag **edx-aperture** on any PRs or issues. Thanks!
|
||||
|
||||
Introduction
|
||||
------------
|
||||
|
||||
This repository is a template for Open edX micro-frontend applications. It is flagged as a Template Repository, meaning it can be used as a basis for new GitHub repositories by clicking the green "Use this template" button above. The rest of this document describes how to work with your new micro-frontend after you've created a new repository from the template.
|
||||
A tool used by course teams to communicate with thier learners. The interface for anything related to instructor to learner communications. Instructor bulk email, for example.
|
||||
|
||||
After Copying The Template
|
||||
--------------------------
|
||||
|
||||
You'll want to do a find-and-replace to replace all instances of ``frontend-app-communications`` with the name of your new repository. Also edit index.html to replace "Application Template" with a friendly name for this application that users will see in their browser tab.
|
||||
Getting started
|
||||
------------
|
||||
|
||||
**Prerequisite**
|
||||
For now, this repo is not intergrated with devstack. You'll be running the app locally and not through docker. This does make setup a little easier.
|
||||
|
||||
`Devstack <https://edx.readthedocs.io/projects/edx-installing-configuring-and-running/en/latest/installation/index.html>`_. If you start Devstack with ``make dev.up.ecommerce`` that should give you everything you need as a companion to this frontend.
|
||||
1. Clone the repo into your usual workspace
|
||||
|
||||
**Installation and Startup**
|
||||
.. code-block::
|
||||
|
||||
In the following steps, replace "frontend-app-communications' with the name of the repo you created when copying this template above.
|
||||
mkdir -p ~/workspace/
|
||||
cd ~/workspace/
|
||||
git clone https://github.com/edx/devstack.git
|
||||
|
||||
1. Clone your new repo:
|
||||
2. Install frontend dependencies
|
||||
|
||||
``git clone https://github.com/edx/frontend-app-communications.git``
|
||||
.. code-block::
|
||||
|
||||
2. Use node v12.x.
|
||||
npm i
|
||||
|
||||
The micro-frontend build scripts support node 12. Using other major versions of node *may* work, but is unsupported. For convenience, this repository includes an .nvmrc file to help in setting the correct node version via `nvm <https://github.com/nvm-sh/nvm>`_.
|
||||
3. start the devserver. The app will be running at `localhost:8585`, or whatever port you change it too.
|
||||
|
||||
3. Install npm dependencies:
|
||||
.. code-block::
|
||||
|
||||
``cd frontend-app-communications && npm install``
|
||||
npm i
|
||||
|
||||
4. Update the application port to use for local development:
|
||||
Environment Variables/Setup Notes
|
||||
---------------------------------
|
||||
|
||||
Default port is 8080. If this does not work for you, update the line `PORT=8080` to your port in all .env.* files
|
||||
TBD
|
||||
|
||||
5. Start the dev server:
|
||||
Running Tests
|
||||
---------------------------
|
||||
|
||||
``npm start``
|
||||
tests use jest as usual. To run all the tests for this repo:
|
||||
|
||||
The dev server is running at `http://localhost:8080 <http://localhost:8080>`_ or whatever port you setup.
|
||||
.. code-block::
|
||||
|
||||
Making Your New Project's README File
|
||||
-------------------------------------
|
||||
|
||||
Move the file ``README-template-frontend-app.rst`` to your project's ``README.rst`` file. Please fill out all
|
||||
the sections - this helps out all developers understand your MFE, how to install it, and how to use it.
|
||||
|
||||
Project Structure
|
||||
-----------------
|
||||
|
||||
The source for this project is organized into nested submodules according to the ADR `Feature-based Application Organization <https://github.com/edx/frontend-app-communications/blob/master/docs/decisions/0002-feature-based-application-organization.rst>`_.
|
||||
|
||||
Build Process Notes
|
||||
-------------------
|
||||
|
||||
**Production Build**
|
||||
|
||||
The production build is created with ``npm run build``.
|
||||
|
||||
Internationalization
|
||||
--------------------
|
||||
|
||||
Please see `edx/frontend-platform's i18n module <https://edx.github.io/frontend-platform/module-Internationalization.html>`_ for documentation on internationalization. The documentation explains how to use it, and the `How To <https://github.com/edx/frontend-i18n/blob/master/docs/how_tos/i18n.rst>`_ has more detail.
|
||||
|
||||
.. |Build Status| image:: https://api.travis-ci.com/edx/frontend-app-communications.svg?branch=master
|
||||
:target: https://travis-ci.com/edx/frontend-app-communications
|
||||
.. |Codecov| image:: https://codecov.io/gh/edx/frontend-app-communications/branch/master/graph/badge.svg
|
||||
:target: https://codecov.io/gh/edx/frontend-app-communications
|
||||
.. |license| image:: https://img.shields.io/npm/l/@edx/frontend-app-communications.svg
|
||||
:target: @edx/frontend-app-communications
|
||||
npm test
|
||||
5
src/components/bulk-email-tool/BulkEmailBody.jsx
Normal file
5
src/components/bulk-email-tool/BulkEmailBody.jsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import React from 'react';
|
||||
|
||||
export default function BulkEmailBody() {
|
||||
return <div />;
|
||||
}
|
||||
5
src/components/bulk-email-tool/BulkEmailRecepient.jsx
Normal file
5
src/components/bulk-email-tool/BulkEmailRecepient.jsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import React from 'react';
|
||||
|
||||
export default function BulkEmailRecepient() {
|
||||
return <div />;
|
||||
}
|
||||
5
src/components/bulk-email-tool/BulkEmailTaskManager.jsx
Normal file
5
src/components/bulk-email-tool/BulkEmailTaskManager.jsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import React from 'react';
|
||||
|
||||
export default function BulkEmailTaskManager() {
|
||||
return <div />;
|
||||
}
|
||||
27
src/components/bulk-email-tool/InstructorBulkEmailTool.jsx
Normal file
27
src/components/bulk-email-tool/InstructorBulkEmailTool.jsx
Normal file
@@ -0,0 +1,27 @@
|
||||
import React from 'react';
|
||||
import { Container } from '@edx/paragon';
|
||||
import InstructorToolbar from './InstructorToolbar';
|
||||
import BulkEmailRecepient from './BulkEmailRecepient';
|
||||
import BulkEmailBody from './BulkEmailBody';
|
||||
import BulkEmailTaskManager from './BulkEmailTaskManager';
|
||||
|
||||
export default function BulkEmailTool() {
|
||||
return (
|
||||
<div>
|
||||
<Container>
|
||||
<div className="row">
|
||||
<InstructorToolbar />
|
||||
</div>
|
||||
<div className="row">
|
||||
<BulkEmailRecepient />
|
||||
</div>
|
||||
<div className="row">
|
||||
<BulkEmailBody />
|
||||
</div>
|
||||
<div className="row">
|
||||
<BulkEmailTaskManager />
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
5
src/components/bulk-email-tool/InstructorToolbar.jsx
Normal file
5
src/components/bulk-email-tool/InstructorToolbar.jsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import React from 'react';
|
||||
|
||||
export default function InstructorToolbar() {
|
||||
return <div />;
|
||||
}
|
||||
1
src/components/bulk-email-tool/index.js
Normal file
1
src/components/bulk-email-tool/index.js
Normal file
@@ -0,0 +1 @@
|
||||
export { default } from './InstructorBulkEmailTool';
|
||||
@@ -13,11 +13,13 @@ import Footer, { messages as footerMessages } from '@edx/frontend-component-foot
|
||||
import appMessages from './i18n';
|
||||
|
||||
import './index.scss';
|
||||
import BulkEmailTool from './components/bulk-email-tool';
|
||||
|
||||
subscribe(APP_READY, () => {
|
||||
ReactDOM.render(
|
||||
<AppProvider>
|
||||
<Header />
|
||||
<BulkEmailTool />
|
||||
<Footer />
|
||||
</AppProvider>,
|
||||
document.getElementById('root'),
|
||||
|
||||
Reference in New Issue
Block a user