fix: reverted es module & require conversions (#1348)

* fix: reverted es module & require conversions

* refactor: update require statements

* refactor: update require statement

analytics_dashboard/static/apps/learners/app/learners-main.js

@@ -1,8 +1,10 @@
 import 'backgrid-paginator/backgrid-paginator.min.css';
 import 'nprogress/nprogress.css';
-import page from 'load/init-page';
 
-define('apps/learners/app/app', LearnersApp => {
+require('jquery');
+const page = require('load/init-page');
+
+require(['apps/learners/app/app'], LearnersApp => {
   'use strict';
 
   const modelData = page.models.courseModel;

analytics_dashboard/static/js/application-main.js

@@ -1,16 +1,16 @@
 /**
  * Load scripts needed across the application.
 */
-import 'views/data-table-view';
-import '@babel/polyfill'; // EDUCATOR-1184: this defines Promise for IE11
-import 'sass/style-application.scss';
-import 'bootstrap-sass/assets/javascripts/bootstrap';
-import 'bootstrap-accessibility-plugin/plugins/js/bootstrap-accessibility';
+require('views/data-table-view');
+require('@babel/polyfill'); // EDUCATOR-1184: this defines Promise for IE11
+require('sass/style-application.scss');
+require('bootstrap-sass/assets/javascripts/bootstrap');
+require('bootstrap-accessibility-plugin/plugins/js/bootstrap-accessibility');
 
 // eslint-disable-next-line import/no-dynamic-require
 require(process.env.THEME_SCSS);
 
-define('views/announcement-view', AnnouncementView => {
+require(['views/announcement-view'], AnnouncementView => {
   'use strict';
 
   // Instantiate the announcement view(s)

analytics_dashboard/static/js/engagement-content-main.js

@@ -2,12 +2,11 @@
  * This is the first script called by the engagement page.  It loads
  * the libraries and kicks off the application.
  */
-import _, { template } from 'underscore';
-import DataTableView from 'views/data-table-view';
-import TrendsView from 'views/trends-view';
-import page from 'load/init-page';
+const _ = require('underscore');
+const DataTableView = require('views/data-table-view');
+const TrendsView = require('views/trends-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   // shared settings between the chart and table
@@ -78,7 +77,7 @@ require([], () => {
       key: 'count',
     },
     // Translators: <%=value%> will be replaced with a date.
-    interactiveTooltipHeaderTemplate: template(gettext('Week Ending <%=value%>')),
+    interactiveTooltipHeaderTemplate: _.template(gettext('Week Ending <%=value%>')),
   });
   engagementChart.renderIfDataAvailable();
 

analytics_dashboard/static/js/engagement-video-content-main.js

@@ -1,11 +1,12 @@
 /**
  * Called for displaying aggregate video charts and tables.  Each bar is a collection of video views.
  */
-import DataTableView from 'views/data-table-view';
-import StackedBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const model = page.models.courseModel;

analytics_dashboard/static/js/engagement-video-timeline-main.js

@@ -2,13 +2,13 @@
  * This is the first script called by the video timeline page and displays a
  * video timeline chart and data table.
  */
-import DisclosureView from 'edx-ui-toolkit/src/js/disclosure/disclosure-view';
-import DataTableView from 'views/data-table-view';
-import IFrameView from 'views/iframe-view';
-import StackedTimelineView from 'views/stacked-timeline-view';
-import page from 'load/init-page';
+require('underscore');
+const DisclosureView = require('edx-ui-toolkit/src/js/disclosure/disclosure-view');
+const DataTableView = require('views/data-table-view');
+const IFrameView = require('views/iframe-view');
+const StackedTimelineView = require('views/stacked-timeline-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const { courseModel } = page.models;

analytics_dashboard/static/js/engagement-videos-main.js

@@ -1,11 +1,12 @@
 /**
  * Called for displaying a collection of video charts and tables.  Each bar represents a single video.
  */
-import DataTableView from 'views/data-table-view';
-import StackedBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const model = page.models.courseModel;

analytics_dashboard/static/js/enrollment-activity-main.js

@@ -2,12 +2,11 @@
  * This is the first script called by the enrollment activity page.  It loads
  * the libraries and kicks off the application.
  */
-import _, { defaults } from 'underscore';
-import DataTableView from 'views/data-table-view';
-import StackedTrendsView from 'views/stacked-trends-view';
-import page from 'load/init-page';
+const _ = require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedTrendsView = require('views/stacked-trends-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   // this is your page specific code
@@ -22,33 +21,33 @@ require([], () => {
       title: gettext('Date'),
       type: 'date',
     },
-    defaults({}, numericColumn, {
+    _.defaults({}, numericColumn, {
       key: 'count',
       title: gettext('Current Enrollment'),
       color: colors[0],
     }),
-    defaults({}, numericColumn, {
+    _.defaults({}, numericColumn, {
       key: 'honor',
       // Translators: this describe the learner's enrollment track (e.g. Honor certificate)
       title: gettext('Honor'),
       color: colors[1],
     }),
-    defaults({}, numericColumn, {
+    _.defaults({}, numericColumn, {
       key: 'audit',
       title: gettext('Audit'),
       color: colors[2],
     }),
-    defaults({}, numericColumn, {
+    _.defaults({}, numericColumn, {
       key: 'verified',
       title: gettext('Verified'),
       color: colors[3],
     }),
-    defaults({}, numericColumn, {
+    _.defaults({}, numericColumn, {
       key: 'professional',
       title: gettext('Professional'),
       color: colors[4],
     }),
-    defaults({}, numericColumn, {
+    _.defaults({}, numericColumn, {
       key: 'credit',
       // Translators: this label indicates the learner has registered for academic credit
       title: gettext('Verified with Credit'),

analytics_dashboard/static/js/enrollment-demographics-age-main.js

@@ -2,12 +2,11 @@
  * This is the first script called by the enrollment demographics age page.  It loads
  * the libraries and kicks off the application.
  */
-import { template } from 'underscore';
-import DataTableView from 'views/data-table-view';
-import HistogramView from 'views/histogram-view';
-import page from 'load/init-page';
+const _ = require('underscore');
+const DataTableView = require('views/data-table-view');
+const HistogramView = require('views/histogram-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   // used in the table to show ages above this are binned--displayed as "100+"
@@ -25,7 +24,7 @@ require([], () => {
     x: { key: 'age' },
     y: { key: 'count' },
     // Translators: <%=value%> will be replaced with an age.
-    interactiveTooltipHeaderTemplate: template(gettext('Age: <%=value%>')),
+    interactiveTooltipHeaderTemplate: _.template(gettext('Age: <%=value%>')),
   });
   const ageTable = new DataTableView({
     el: '[data-role=enrollment-table]',

analytics_dashboard/static/js/enrollment-demographics-education-main.js

@@ -2,12 +2,11 @@
  * This is the first script called by the enrollment demographics education page.  It loads
  * the libraries and kicks off the application.
  */
-import { template } from 'underscore';
-import DataTableView from 'views/data-table-view';
-import DiscreteBarView from 'views/discrete-bar-view';
-import page from 'load/init-page';
+const _ = require('underscore');
+const DataTableView = require('views/data-table-view');
+const DiscreteBarView = require('views/discrete-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const educationChart = new DiscreteBarView({
@@ -23,7 +22,7 @@ require([], () => {
     x: { key: 'educationLevel' },
     y: { key: 'percent' },
     // Translators: <%=value%> will be replaced with a level of education (e.g. Doctorate).
-    interactiveTooltipHeaderTemplate: template(gettext('Education: <%=value%>')),
+    interactiveTooltipHeaderTemplate: _.template(gettext('Education: <%=value%>')),
   });
   const educationTable = new DataTableView({
     el: '[data-role=enrollment-table]',

analytics_dashboard/static/js/enrollment-demographics-gender-main.js

@@ -2,12 +2,11 @@
  * This is the first script called by the enrollment demographics gender page.  It loads
  * the libraries and kicks off the application.
  */
-import { template } from 'underscore';
-import DataTableView from 'views/data-table-view';
-import DiscreteBarView from 'views/discrete-bar-view';
-import page from 'load/init-page';
+const _ = require('underscore');
+const DataTableView = require('views/data-table-view');
+const DiscreteBarView = require('views/discrete-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const genderChart = new DiscreteBarView({
@@ -22,7 +21,7 @@ require([], () => {
     x: { key: 'gender' },
     y: { key: 'percent' },
     // Translators: <%=value%> will be replaced with a level of gender (e.g. Female).
-    interactiveTooltipHeaderTemplate: template(gettext('Gender: <%=value%>')),
+    interactiveTooltipHeaderTemplate: _.template(gettext('Gender: <%=value%>')),
   });
   // Daily enrollment table
   const genderTable = new DataTableView({

analytics_dashboard/static/js/enrollment-geography-main.js

@@ -2,11 +2,10 @@
  * This is the first script called by the enrollment geography page.  It loads
  * the libraries and kicks off the application.
  */
-import DataTableView from 'views/data-table-view';
-import WorldMapView from 'views/world-map-view';
-import page from 'load/init-page';
+const DataTableView = require('views/data-table-view');
+const WorldMapView = require('views/world-map-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   // this is your page specific code

analytics_dashboard/static/js/performance-answer-distribution-main.js

@@ -1,12 +1,12 @@
 /**
  * This is the first script called by the performance answer distribution page.
  */
-import { template } from 'underscore';
-import DataTableView from 'views/data-table-view';
-import DiscreteBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+const _ = require('underscore');
+const DataTableView = require('views/data-table-view');
+const DiscreteBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const { courseModel } = page.models;
@@ -57,7 +57,7 @@ require([], () => {
     x: { key: answerField },
     y: { key: 'count' },
     // Translators: <%=value%> will be replaced by a learner response to a question asked in a course.
-    interactiveTooltipHeaderTemplate: template(gettext('Answer: <%=value%>')),
+    interactiveTooltipHeaderTemplate: _.template(gettext('Answer: <%=value%>')),
   });
   performanceAnswerChart.renderIfDataAvailable();
 

analytics_dashboard/static/js/performance-content-main.js

@@ -1,8 +1,9 @@
-import DataTableView from 'views/data-table-view';
-import StackedBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const model = page.models.courseModel;

analytics_dashboard/static/js/performance-learning-outcomes-content-main.js

@@ -1,8 +1,9 @@
-import DataTableView from 'views/data-table-view';
-import StackedBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const model = page.models.courseModel;

analytics_dashboard/static/js/performance-learning-outcomes-section-main.js

@@ -1,8 +1,9 @@
-import DataTableView from 'views/data-table-view';
-import StackedBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const model = page.models.courseModel;

analytics_dashboard/static/js/performance-problems-main.js

@@ -1,8 +1,9 @@
-import DataTableView from 'views/data-table-view';
-import StackedBarView from 'views/stacked-bar-view';
-import page from 'load/init-page';
+require('d3');
+require('underscore');
+const DataTableView = require('views/data-table-view');
+const StackedBarView = require('views/stacked-bar-view');
 
-require([], () => {
+require(['load/init-page'], (page) => {
   'use strict';
 
   const model = page.models.courseModel;