Added django_node_assets

.gitignore

@@ -377,3 +377,4 @@ $RECYCLE.BIN/
 /static/main/js/control_page/node_modules
 
 # End of https://www.toptal.com/developers/gitignore/api/django,pycharm+all,python,linux,macos,windows
+node_modules

access_controller/settings.py

@@ -41,6 +41,7 @@ INSTALLED_APPS = [
     'django.contrib.staticfiles',
     'django_registration',
     'rest_framework',
+    'django_node_assets',
     'main',
 ]
 
@@ -134,6 +135,11 @@ STATIC_ROOT = os.path.join(BASE_DIR, 'staticroot')
 STATICFILES_DIRS = [
     os.path.join(BASE_DIR, 'static'),
 ]
+STATICFILES_FINDERS = [
+    'django.contrib.staticfiles.finders.FileSystemFinder',
+    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
+    'django_node_assets.finders.NodeModulesFinder',
+]
 
 ACCOUNT_ACTIVATION_DAYS = 7
 
@@ -177,3 +183,6 @@ ACTRL_ZENDESK_SUBDOMAIN = os.getenv('ACTRL_ZENDESK_SUBDOMAIN') or os.getenv('ZD_
 ACTRL_API_EMAIL = os.getenv('ACTRL_API_EMAIL') or os.getenv('ACCESS_CONTROLLER_API_EMAIL')
 ACTRL_API_TOKEN = os.getenv('ACTRL_API_TOKEN') or os.getenv('ACCESS_CONTROLLER_API_TOKEN')
 ACTRL_API_PASSWORD = os.getenv('ACTRL_API_PASSWORD') or os.getenv('ACCESS_CONTROLLER_API_PASSWORD')
+
+NODE_PACKAGE_JSON = BASE_DIR / 'static/main/js/control_page/package.json'
+NODE_MODULES_ROOT = BASE_DIR / 'static/main/js/control_page/node_modules'

main/templates/pages/adm_ruleset.html

@@ -8,7 +8,6 @@
 
 {% block extra_css %}
 <link rel="stylesheet" href="{% static 'main/css/work.css' %}" xmlns="http://www.w3.org/1999/html">
-<link rel="stylesheet" href="{% static 'modules/notifications/dist/notifications.css' %}">
 {% endblock %}
 
 {% block extra_scripts %}
@@ -16,11 +15,8 @@
 <script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
 <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
-
-<script src="{% static 'modules/notifications/dist/notifications.js' %}"></script>
-<script src="{% static 'main/js/control.js'%}" type="text/babel"></script>
-<script src="{% static 'main/js/notifications.js' %}"></script>
 {% endblock%}
+
 {% block content %}
 <div class="container-md">
 
@@ -109,4 +105,7 @@
 
 </div>
 
+<script src="{% static 'main/js/control_page/control.js' %}" type="text/babel"></script>
 {% endblock %}
+
+

static/main/js/control_page/control.js

@@ -76,7 +76,7 @@ class ZendeskUserTableRows extends React.Component {
   }
 }
 
-class TableBody extends React.Component {
+export default class TableBody extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -88,7 +88,7 @@ class TableBody extends React.Component {
     };
   }
 
-  change_elemnts_html() {
+  change_elements_html() {
     let elements = document.querySelectorAll(".info-quantity-value");
     let licences = document.getElementById("licences_remaining");
     elements[0].innerHTML = this.state.engineers;
@@ -110,7 +110,7 @@ class TableBody extends React.Component {
         max_agents: response.data.max_agents,
       });
     });
-    this.change_elemnts_html();
+    this.change_elements_html();
   }
 
   delete_pretext() {

static/main/js/control_page/control.test.js

@@ -29,9 +29,9 @@ afterEach(() => {
   jest.useRealTimers();
 });
 
-it("has no rows on mount", () => {
+it("has rows on mount", () => {
   act(() => {
     render(<TableBody />, container);
   });
-  expect(container.getElementsByTagName("tr").length).toBe(0);
+  expect(container.getElementsByTagName("tr").length).not.toBe(0);
 });