feat: add tenant stats view

chore: update essentials version

chore: update styles to remove background

eox_nelp/edxapp_wrapper/test_backends/edxmako_m_v1.py

@@ -1,3 +1,4 @@
+from django.shortcuts import render
 from mock import MagicMock
 
 
@@ -7,4 +8,10 @@ def get_edxmako():
     Returns:
         Mock class.
     """
-    return MagicMock()
+    def render_wrapper(template_name, dictionary, namespace, request, **kwargs):
+        return render(request, template_name, context=dictionary)
+
+    edxmako = MagicMock()
+    edxmako.shortcuts.render_to_response = render_wrapper
+
+    return edxmako

eox_nelp/settings/test.py

@@ -110,6 +110,7 @@ def plugin_settings(settings):  # pylint: disable=function-redefined
         'BACKEND': 'django.template.backends.django.DjangoTemplates',
         'DIRS': [
             os.path.join(BASE_DIR, 'course_experience/frontend/templates'),
+            os.path.join(BASE_DIR, 'stats/templates'),
         ],
         'APP_DIRS': True,
         'OPTIONS': {
@@ -119,10 +120,6 @@ def plugin_settings(settings):  # pylint: disable=function-redefined
                 'django.contrib.auth.context_processors.auth',
                 'django.contrib.messages.context_processors.messages',
             ],
-            # 'loaders': [
-            #     'django.template.loaders.filesystem.Loader',
-            #     'django.template.loaders.app_directories.Loader',
-            # ],
             'debug': True,
         },
     },

eox_nelp/static/tenant_stats/js/tenant_stats.js.LICENSE.txt

@@ -0,0 +1,80 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+
+/*!
+    localForage -- Offline Storage, Improved
+    Version 1.10.0
+    https://localforage.github.io/localForage
+    (c) 2013-2017 Mozilla, Apache License 2.0
+*/
+
+/*!
+ * cookie
+ * Copyright(c) 2012-2014 Roman Shtylman
+ * Copyright(c) 2015 Douglas Christopher Wilson
+ * MIT Licensed
+ */
+
+/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
+
+/**
+ * @mui/styled-engine v5.13.2
+ *
+ * @license MIT
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v0.19.1
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

eox_nelp/stats/frontend/src/components/TenantStats/index.jsx

@@ -0,0 +1,29 @@
+import React, { useState} from 'react';
+import ReactDOM from 'react-dom';
+import { APP_INIT_ERROR, APP_READY, subscribe, initialize } from '@edx/frontend-platform';
+import { getLocale, getMessages, IntlProvider } from '@edx/frontend-platform/i18n';
+import { StatsContainer, messages as essentialsMessages } from '@edunext/frontend-essentials'
+
+import './index.scss';
+
+function LaunchStatsContainer() {
+  const [locale, setLocale] = useState(getLocale());
+
+  return (
+    <IntlProvider locale={locale} messages={getMessages()}>
+      <StatsContainer
+        showVideos={showVideos}
+        showCourses={showCourses}
+        showProblems={showProblems}
+        showLearners={showLearners}
+        showInstructors={showInstructors}
+      />
+    </IntlProvider>
+  );
+}
+
+subscribe(APP_READY, () => {
+  ReactDOM.render(<LaunchStatsContainer />, document.getElementById('tenant-stats'));
+});
+
+initialize({  messages: [essentialsMessages]});

eox_nelp/stats/frontend/src/components/TenantStats/index.scss

@@ -0,0 +1,16 @@
+@import "~@edx/brand/paragon/fonts";
+@import "~@edx/brand/paragon/variables";
+@import "~@edx/paragon/scss/core/core";
+@import "~@edx/brand/paragon/overrides";
+
+body {
+  background-color: transparent;
+
+  #tenant-stats{
+    .stats-container{
+      margin: 0;
+      width: auto;
+    }
+  }
+}
+

eox_nelp/stats/templates/tenant_stats.html

@@ -0,0 +1,19 @@
+<%namespace name='static' file='static_content.html'/>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Tenant Stats</title>
+    <link rel="stylesheet" href="${static.url('tenant_stats/css/tenant_stats.css')}">
+</head>
+<body>
+    <div id="tenant-stats"></div>
+    <script>
+      var showVideos = "true" === "${showVideos}";
+      var showCourses = "true" === "${showCourses}";
+      var showProblems = "true" === "${showProblems}";
+      var showLearners = "true" === "${showLearners}";
+      var showInstructors = "true" === "${showInstructors}";
+    </script>
+    <script src="${static.url('tenant_stats/js/tenant_stats.js')}"></script>
+</body>
+</html>

eox_nelp/stats/tests/test_views.py

@@ -0,0 +1,62 @@
+"""This file contains all the test for the stats views.py file.
+
+Classes:
+    GetTenantStatsTestCase: Test get_tenant_stats function based view.
+"""
+from ddt import data, ddt
+from django.test import Client, TestCase
+from django.urls import reverse
+from rest_framework import status
+
+
+@ddt
+class GetTenantStatsTestCase(TestCase):
+    """ Test get_tenant_stats function based view."""
+
+    def setUp(self):  # pylint: disable=invalid-name
+        """
+        Set base variables and objects across experience test cases.
+        """
+        self.client = Client()
+        self.template_name = "tenant_stats.html"
+
+    def test_get_default_stats(self):
+        """
+        Test that the default behavior, that is just render the tenant-stats div
+
+        Expected behavior:
+            - Status code 200.
+            - template name is as expected.
+            - tenant-stats div exist
+        """
+        url_endpoint = reverse("stats:tenant")
+
+        response = self.client.get(url_endpoint)
+
+        self.assertEqual(status.HTTP_200_OK, response.status_code)
+        self.assertEqual(self.template_name, response.templates[0].name)
+        self.assertContains(response, '<div id="tenant-stats"></div')
+
+    @data("showVideos", "showCourse", "showProblems", "showInstructors", "showLearners")
+    def test_get_specific_stat(self, query_param):
+        """
+        Test that the view render successfully when a query param is included
+
+        Expected behavior:
+            - Status code 200.
+            - template name is as expected.
+            - tenant-stats div exist
+            - the query param is 'true'
+            - CSS was included
+            - JS was included
+        """
+        url_endpoint = f"{reverse('stats:tenant')}?{query_param}=true"
+
+        response = self.client.get(url_endpoint)
+
+        self.assertEqual(status.HTTP_200_OK, response.status_code)
+        self.assertEqual(self.template_name, response.templates[0].name)
+        self.assertContains(response, '<div id="tenant-stats"></div')
+        self.assertEqual("true", response.context[query_param])
+        self.assertContains(response, "tenant_stats/css/tenant_stats.css")
+        self.assertContains(response, "tenant_stats/js/tenant_stats.js")

eox_nelp/stats/urls.py

@@ -0,0 +1,10 @@
+"""frontend templates urls for course_experience"""
+from django.urls import path
+
+from eox_nelp.stats.views import get_tenant_stats
+
+app_name = "eox_nelp"  # pylint: disable=invalid-name
+
+urlpatterns = [
+    path('tenant/', get_tenant_stats, name='tenant')
+]

eox_nelp/stats/views.py

@@ -0,0 +1,40 @@
+"""Stats Views file.
+
+Contains all the views for stats
+
+classes:
+    get_tenant_stats: function based view.
+"""
+
+from eox_nelp.templates_config import render_to_response
+
+
+def get_tenant_stats(request):
+    """
+    Simple function based view that renders the StatsContainer essential component.
+    By default this show nothing since this requires the specific query para to show the content.
+
+    Examples:
+        renders just video card /eox-nelp/stats/tenant/?showVideos=true
+
+        render multiple components
+        /eox-nelp/stats/tenant/?showVideos=true&showCourses=true&showInstructors=true
+
+    The available options are:
+        showVideos
+        showCourses
+        showLearners
+        showInstructors
+        showProblems
+    """
+
+    context = {
+        "showCourses": "false",
+        "showVideos": "false",
+        "showProblems": "false",
+        "showLearners": "false",
+        "showInstructors": "false",
+    }
+    context.update(request.GET.dict())
+
+    return render_to_response("tenant_stats.html", context)

eox_nelp/templates_config.py

@@ -3,8 +3,10 @@
 
 import eox_nelp.course_experience.frontend.templates as course_experience_templates
 from eox_nelp.edxapp_wrapper.edxmako import edxmako
+from eox_nelp.stats import templates as stats_templates
 
 module_templates_to_include = [
+    stats_templates,
     course_experience_templates,
 ]
 

eox_nelp/urls.py

@@ -29,4 +29,5 @@
         include('eox_nelp.course_experience.frontend.urls', namespace='course-experience-frontend'),
     ),
     path('api/stats/', include('eox_nelp.stats.api.urls', namespace='stats-api')),
+    path('stats/', include('eox_nelp.stats.urls', namespace='stats')),
 ]

package.json

@@ -15,8 +15,8 @@
   "license": "ISC",
   "homepage": "https://bitbucket.org/edunext/eox-nelp#readme",
   "dependencies": {
-    "@edunext/frontend-essentials": "^1.1.0-feedback-carousel",
-    "@edx/brand": "npm:@edx/brand-openedx@^1.2.0",
+    "@edunext/frontend-essentials": "^1.3.0",
+    "@edx/brand": "github:nelc/brand-openedx#ednx-release/mango.nelp",
     "@edx/frontend-platform": "npm:@edunext/frontend-platform@^3.3.1",
     "@edx/paragon": "npm:@edunext/paragon@^20.22.48",
     "babel-loader": "^8.2.3",

webpack.common.config.js

@@ -8,6 +8,7 @@ const config = createConfig('webpack-prod');
 // Override entries.
 config.entry = {
   feedback_carousel: './eox_nelp/course_experience/frontend/src/components/FeedbackCarousel/index',
+  tenant_stats: './eox_nelp/stats/frontend/src/components/TenantStats/index',
 }
 
 // Override output configuration in order to get a unique folder per entry.