Merge branch 'master' into jls/update-bootstrap-docs

dimagi · Sep 18, 2024 · 51a9daa · 51a9daa
2 parents 0338ba6 + ab1c8e0
commit 51a9daa
Show file tree

Hide file tree

Showing 39 changed files with 9,795 additions and 6,056 deletions.
diff --git a/DEV_FAQ.md b/DEV_FAQ.md
@@ -38,6 +38,11 @@ Formplayer isn't running properly. See [Formplayer](https://github.com/dimagi/co
 
 It happens, try restarting.
 
+> I'm getting TemplateSyntaxErrors related to Webpack.
+
+Please run `yarn dev`. If this build is failing, and you didn't make any changes to JavaScript files on your branch,
+please raise this as an issue.
+
 ## Generating Sample Data
 
 ### SMS

diff --git a/DEV_SETUP.md b/DEV_SETUP.md
@@ -762,7 +762,23 @@ This can also be used to promote a user created by signing up to a superuser.
 Note that promoting a user to superuser status using this command will also give them the
 ability to assign other users as superuser in the in-app Superuser Management page.
 
-### Step 11: Running CommCare HQ
+### Step 11: Running `yarn dev`
+
+In order to build JavaScript bundles with Webpack, you will need to have `yarn dev`
+running in the background. It will watch any existing Webpack Entry Point, aka modules
+included on a page using the `webpack_main` template tag.
+
+When you add a new entry point (`webpack_main` tag), please remember to restart `yarn dev` so
+that it can identify the new entry point it needs to watch.
+
+To build Webpack bundles like it's done in production environments, pleas use `yarn build`.
+This command does not have a watch functionality, so it needs to be re-run every time you make
+changes to javascript files bundled by Webpack.
+
+For more information about JavaScript and Static Files, please see the
+[Dimagi JavaScript Guide](https://commcare-hq.readthedocs.io/js-guide/README.html) on Read the Docs.
+
+### Step 12: Running CommCare HQ
 
 Make sure the required services are running (PostgreSQL, Redis, CouchDB, Kafka,
 Elasticsearch).
@@ -794,6 +810,9 @@ yarn install --frozen-lockfile
 ./manage.py fix_less_imports_collectstatic
 ```
 
+See the [Dimagi JavaScript Guide](https://commcare-hq.readthedocs.io/js-guide/README.html) for additional
+useful background and tips.
+
 ## Running Formplayer and submitting data with Web Apps
 
 Formplayer is a Java service that allows us to use applications on the web  instead of on a mobile device.

diff --git a/corehq/apps/export/static/export/js/bootstrap3/download_data_files.js b/corehq/apps/export/static/export/js/bootstrap3/download_data_files.js
diff --git a/...port/js/bootstrap5/download_data_files.js → ...t/static/export/js/download_data_files.js b/...port/js/bootstrap5/download_data_files.js → ...t/static/export/js/download_data_files.js
@@ -1,4 +1,4 @@
-hqDefine("export/js/bootstrap5/download_data_files",[
+hqDefine("export/js/download_data_files",[
     'jquery',
     'hqwebapp/js/bootstrap5/alert_user',
     'hqwebapp/js/initial_page_data',

diff --git a/corehq/apps/export/templates/export/bootstrap3/download_data_files.html b/corehq/apps/export/templates/export/bootstrap3/download_data_files.html
diff --git a/...xport/bootstrap5/download_data_files.html → ...templates/export/download_data_files.html b/...xport/bootstrap5/download_data_files.html → ...templates/export/download_data_files.html
@@ -6,7 +6,7 @@
 {% block title %}{% trans "Download Files" %}{% endblock %}
 
 
-{% requirejs_main_b5 'export/js/bootstrap5/download_data_files' %}
+{% requirejs_main_b5 'export/js/download_data_files' %}
 
 
 {% block page_content %}
@@ -29,12 +29,12 @@ <h2>{% trans "Download Files" %}</h2>
                 </td>
                 <td>
                   {{ data_file.description }}
-                  <textarea id="url_{{ data_file.id }}" style="display: none">{{ url_base }}{% url 'download_data_file' domain data_file.id data_file.filename %}</textarea>  {# todo B5: inline style #}
+                  <textarea id="url_{{ data_file.id }}" class="d-none">{{ url_base }}{% url 'download_data_file' domain data_file.id data_file.filename %}</textarea>
                 </td>
                 <td>
                   {% trans "Available until" %}: {{ data_file.delete_after|to_user_time:request }}
                 </td>
-                <td style="width: 6em; text-align: right;">  {# todo B5: inline style #}
+                <td class="text-end" style="width: 6em;">
                   <a href="#"
                      class="copy-data-file"
                      data-id={{ data_file.id }}
@@ -75,41 +75,36 @@ <h2>{% trans "Download Files" %}</h2>
             <fieldset>
               <legend>{% trans "Upload file for transfer" %}</legend>
 
-              <div class="form-group">  {# todo B5: css:form-group #}
-                <label class="form-label col-lg-2 requiredField">
+              <div class="mb-3">
+                <label class="form-label requiredField">
                   {% trans "Description" %}<span class="asteriskField">*</span>
                 </label>
-                <div class="controls col-lg-6">
-                  <input class="textinput textInput form-control"
-                         name="description"
-                         required=""
-                         type="text" />
-                </div>
+                <input class="form-control"
+                       name="description"
+                       required=""
+                       type="text" />
               </div>
 
-              <div class="form-group">  {# todo B5: css:form-group #}
-                <label class="form-label col-lg-2 requiredField">
+              <div class="mb-3">
+                <label class="requiredField form-label">
                   {% trans "File" %}<span class="asteriskField">*</span>
                 </label>
-                <div class="controls col-lg-6">
-                  <input name="file"
-                         required=""
-                         type="file" />
-                </div>
+                <input name="file"
+                       class="form-control"
+                       required=""
+                       type="file" />
               </div>
 
-              <div class="form-group">  {# todo B5: css:form-group #}
-                <label class="form-label col-lg-2 requiredField">
+              <div class="mb-3">
+                <label class="form-label requiredField">
                   {% trans "Delete after" %}<span class="asteriskField">*</span>
                 </label>
-                <div class="controls col-lg-6">
-                  <select name="ttl" class="form-control">
-                    <option value="12">{% trans "12 hours" %}</option>
-                    <option selected="selected" value="24">{% trans "1 day" %}</option>
-                    <option value="48">{% trans "2 days" %}</option>
-                    <option value="72">{% trans "3 days" %}</option>
-                  </select>
-                </div>
+                <select name="ttl" class="form-select">
+                  <option value="12">{% trans "12 hours" %}</option>
+                  <option selected="selected" value="24">{% trans "1 day" %}</option>
+                  <option value="48">{% trans "2 days" %}</option>
+                  <option value="72">{% trans "3 days" %}</option>
+                </select>
               </div>
 
             </fieldset>

diff --git a/corehq/apps/export/views/utils.py b/corehq/apps/export/views/utils.py
@@ -38,6 +38,7 @@
 )
 from corehq.apps.export.models.new import DataFile, DatePeriod, CaseExportInstance
 from corehq.apps.export.tasks import generate_schema_for_all_builds, process_populate_export_tables
+from corehq.apps.hqwebapp.decorators import use_bootstrap5
 from corehq.apps.locations.models import SQLLocation
 from corehq.apps.locations.permissions import location_safe
 from corehq.apps.reports.util import datespan_from_beginning
@@ -310,9 +311,10 @@ class DashboardFeedPaywall(BaseProjectDataView):
 
 @location_safe
 @method_decorator(login_and_domain_required, name='dispatch')
+@method_decorator(use_bootstrap5, name='dispatch')
 class DataFileDownloadList(BaseProjectDataView):
     urlname = 'download_data_files'
-    template_name = 'export/bootstrap3/download_data_files.html'
+    template_name = 'export/download_data_files.html'
     page_title = gettext_lazy("Secure File Transfer")
 
     def dispatch(self, request, *args, **kwargs):