Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[B5] Exports: create new export #35170

Merged
merged 18 commits into from
Oct 23, 2024
Merged

[B5] Exports: create new export #35170

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
9f64867
update BaseExportView to use b5 templates
AmitPhulera Sep 17, 2024
a9303cc
update cutomize_export_new.html as per b5 recommendations
AmitPhulera Sep 17, 2024
b6cd9fb
Migrated tooltip usage
orangejenny Oct 1, 2024
e973590
Replaced .has-error with B5 classes
orangejenny Oct 1, 2024
b99322e
Updated docs for has-success and has-error
orangejenny Oct 1, 2024
fe1e5fd
Updated modals
orangejenny Oct 1, 2024
175cae1
Updated CSS classes in JS
orangejenny Oct 1, 2024
d5b439c
Removed offsets that don't align with the vertical form layout (w=1)
orangejenny Oct 1, 2024
2bb9804
Updated new_customize_export_templates.html
orangejenny Oct 2, 2024
78bf5fb
Updated modals
orangejenny Oct 3, 2024
41d6435
Updated dropdown class
orangejenny Oct 3, 2024
aa0d0f6
Updated help link
orangejenny Oct 3, 2024
aefedd4
Merge branch 'master' into ap+js/b5-migration
orangejenny Oct 3, 2024
0d63435
"Bootstrap 5 Migration - Rebuilt diffs"
orangejenny Oct 22, 2024
9eba92c
Merge branch 'master' into ap+js/b5-migration
orangejenny Oct 22, 2024
48790bd
"Bootstrap 5 Migration - Rebuilt diffs"
orangejenny Oct 22, 2024
6e1b5d3
Updated tests to pass in both B3 and B5
orangejenny Oct 22, 2024
d3e0ea1
Fixed tests for real
orangejenny Oct 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion corehq/apps/export/static/export/js/bootstrap5/customize_export_new.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
hqDefine('export/js/bootstrap5/customize_export_new', [
'jquery',
'knockout',
'es6!hqwebapp/js/bootstrap5_loader',
'hqwebapp/js/initial_page_data',
'export/js/bootstrap5/models',
'hqwebapp/js/toggles',
'export/js/const',
], function (
$,
ko,
bootstrap,
initialPageData,
models,
toggles,
Expand All @@ -31,7 +33,9 @@ hqDefine('export/js/bootstrap5/customize_export_new', [
"build_schema", "/a/---/data/export/build_full_schema/"
);
$('#customize-export').koApplyBindings(customExportView);
$('.export-tooltip').tooltip(); /* todo B5: plugin:tooltip */
$('.export-tooltip').each(function (index, trigger) {
new bootstrap.Tooltip(trigger);
});

if (toggles.toggleEnabled('SUPPORT_GEO_JSON_EXPORT')) {
const exportFormat = initialPageData.get('export_instance').export_format;
Expand Down
6 changes: 4 additions & 2 deletions corehq/apps/export/static/export/js/bootstrap5/models.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ hqDefine('export/js/bootstrap5/models', [
'jquery',
'knockout',
'underscore',
'es6!hqwebapp/js/bootstrap5_loader',
'hqwebapp/js/initial_page_data',
'hqwebapp/js/toggles',
'analytix/js/google',
Expand All @@ -20,6 +21,7 @@ hqDefine('export/js/bootstrap5/models', [
$,
ko,
_,
bootstrap,
initialPageData,
toggles,
googleAnalytics,
Expand Down Expand Up @@ -451,7 +453,7 @@ hqDefine('export/js/bootstrap5/models', [
table.showDeleted(!table.showDeleted());

if (this.numberOfAppsToProcess > 0 && table.showDeleted()) {
$('#export-process-deleted-applications').modal('show'); /* todo B5: plugin:modal */
bootstrap.Modal.getOrCreateInstance('#export-process-deleted-applications').show();
}
};

Expand Down Expand Up @@ -576,7 +578,7 @@ hqDefine('export/js/bootstrap5/models', [
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
if (urlParams.get('load_deprecated') !== 'True' && table.showDeprecated()) {
$('#export-process-deprecated-properties').modal('show'); /* todo B5: plugin:modal */
bootstrap.Modal.getOrCreateInstance('#export-process-deprecated-properties').show();
}
};

Expand Down
6 changes: 3 additions & 3 deletions corehq/apps/export/static/export/js/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@ hqDefine('export/js/utils', [
constants
) {
var getTagCSSClass = function (tag) {
var cls = 'label';
var cls = window.USE_BOOTSTRAP5 ? 'badge' : 'label';
if (tag === constants.TAG_DELETED) {
return cls + ' label-warning';
return cls + (window.USE_BOOTSTRAP5 ? ' text-bg-warning' : ' label-warning');
} else {
return cls + ' label-default';
return cls + (window.USE_BOOTSTRAP5 ? ' text-bg-secondary' : ' label-default');
}
};

Expand Down
4 changes: 2 additions & 2 deletions corehq/apps/export/static/export/spec/bootstrap5/Exports.Utils.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,12 @@ hqDefine("export/spec/bootstrap5/Exports.Utils.spec", [
describe('#getTagCSSClass', function () {
it('Should get regular tag class', function () {
var cls = utils.getTagCSSClass('random-tag');
assert.equal(cls, 'label label-default');
assert.equal(cls, 'badge text-bg-secondary');
});

it('Should get warning tag class', function () {
var cls = utils.getTagCSSClass(constants.TAG_DELETED);
assert.equal(cls, 'label label-warning');
assert.equal(cls, 'badge text-bg-warning');
});
});

Expand Down
456 changes: 214 additions & 242 deletions corehq/apps/export/templates/export/bootstrap5/customize_export_new.html
View file
Open in desktop

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions corehq/apps/export/templates/export/dialogs/bootstrap5/process_deleted_questions.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@ <h4 class="modal-title">
{% trans "Unable to process applications. Please report an issue if this persists" %}
</p>
<div class="spacer"></div>
<div class="progress " data-bind="visible: showBuildSchemaProgressBar"> {# todo B5: css:progress #}
<div class="progress-bar" role="progressbar" data-bind="
<div class="progress" role="progressbar" data-bind="visible: showBuildSchemaProgressBar">
<div class="progress-bar" data-bind="
style: {
width: buildSchemaProgress() + '%'
}
Expand Down
128 changes: 56 additions & 72 deletions corehq/apps/export/templates/export/partials/bootstrap5/new_customize_export_templates.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<legend data-bind="visible: table.isVisible(),
visible: table.label() !== 'Case History'">
<span>
<input type="checkbox" {# todo B5: css:checkbox #}
<input type="checkbox"
data-bind="checked: table.selected, attr: { disabled: {{ disable_table_checkbox|JSON }} }" />
</span>
<span>
Expand All @@ -34,43 +34,36 @@
<div class="col-md-12"
data-bind="slideVisible: table.selected">
{% if not export_instance.is_odata_config %}
<div class="form-group"> {# todo B5: css:form-group #}
<label class="col-md-4 col-lg-3 col-xl-2 form-label">
<div class="mb-3">
<label class="form-label">
{% trans "Sheet Name" %}
</label>
<div class="col-md-9 col-lg-8 col-xl-6">
<input type="text"
class="form-control"
data-bind="value: table.label" />
</div>
<input type="text"
class="form-control"
data-bind="value: table.label" />
</div>
{% endif %}
<!-- ko if: table.is_user_defined -->
<div class="form-group"> {# todo B5: css:form-group #}
<label class="col-md-4 col-lg-3 col-xl-2 form-label">
<div class="mb-3">
<label class="form-label">
{% trans "Custom Path" %}
</label>
<div class="col-md-4 col-lg-3 col-xl-2">
<input type="text"
class="form-control"
data-bind="value: table.customPathString" />
</div>
<input type="text"
class="form-control"
data-bind="value: table.customPathString" />
</div>
<!-- /ko -->

{% if request|toggle_enabled:"SUPPORT_GEO_JSON_EXPORT" %}
<div id="select-geo-property" class="form-group" hidden> {# todo B5: css:form-group #}
<label class="col-md-4 col-lg-3 col-xl-2 form-label" for="geo-property-select">
<div id="select-geo-property" class="mb-3" hidden>
<label class="form-label" for="geo-property-select">
{% trans 'Select geo property' %}
</label>
<div class="col-md-9 col-lg-8 col-xl-6">
<select
id="geo-property-select"
class="control form-control"
data-bind="options: $parent.geoProperties,
value: table.selected_geo_property">
</select>
</div>
<select
id="geo-property-select"
class="control form-control"
data-bind="options: $parent.geoProperties, value: table.selected_geo_property">
</select>
</div>
{% endif %}

Expand Down Expand Up @@ -277,25 +270,25 @@ <h4>{{ terminology.choose_fields_label }}</h4>
success: column.selectedForSort,
'selected-for-sort': column.selectedForSort
}"
{% if request|request_has_privilege:"EXPORT_MULTISORT" %}style="cursor:pointer"{% endif %}> {# todo B5: inline style #}
{% if request|request_has_privilege:"EXPORT_MULTISORT" %}class="clickable"{% endif %}>
<td class="text-center">
<span class="sortable-handle">
<i class="fa-solid fa-up-down"></i>
</span>
&nbsp;&nbsp;&nbsp;
<!--ko if: ($root.is_deidentified() && column.item.isCaseName()) -->
<input type="checkbox" {# todo B5: css:checkbox #}
<input type="checkbox"
class="field-include"
disabled="disabled" />
disabled="disabled" />aaa
<!--/ko-->
<!--ko if: $root.isReservedOdataColumn(column, $parentContext.$index()) -->
<input type="checkbox" {# todo B5: css:checkbox #}
<input type="checkbox"
class="field-include"
checked="checked"
disabled="disabled" />
disabled="disabled" />bbb
<!--/ko-->
<!--ko ifnot: ($root.is_deidentified() && column.item.isCaseName()) || $root.isReservedOdataColumn(column, $parentContext.$index()) -->
<input type="checkbox" {# todo B5: css:checkbox #}
<input type="checkbox"
class="field-include export-table-checkbox"
data-bind="checked: column.selected" />
<!--/ko-->
Expand Down Expand Up @@ -337,11 +330,11 @@ <h4>{{ terminology.choose_fields_label }}</h4>
<span
data-bind="text: column.item.case_property_group_name"
class="badge text-bg-secondary"
style="background-color: #495057" {# todo B5: inline style #}
></span>
<!-- ko if: !column.isEditable() -->
<code data-bs-toggle="tooltip"
<span data-bs-toggle="tooltip"
data-placement="top"
class="font-monospace"
data-bind="text: column.formatProperty(),
attr: {
'data-original-title': column.help_text,
Expand All @@ -350,7 +343,7 @@ <h4>{{ terminology.choose_fields_label }}</h4>
css: {
'export-tooltip': column.translatedHelp(),
'break-all-words': 1,
}"></code>
}"></span>
<!-- /ko -->
<!-- ko if: column.isEditable() -->
<input type="text"
Expand All @@ -374,54 +367,45 @@ <h4>{{ terminology.choose_fields_label }}</h4>
<div class="form-horizontal col-sm-12"
data-bind="if: column.doc_type() === 'SplitUserDefinedExportColumn',
submit: column.addUserDefinedOption">
<div class="form-group"> {# todo B5: css:form-group #}
<select style="width:200px" {# todo B5: inline style #}
class="form-control"
data-bind="options: $root.splitTypes.userDefined,
value: column.split_type"></select>
</div>
<select style="width:200px"
class="form-select"
data-bind="options: $root.splitTypes.userDefined,
value: column.split_type"></select>
<!-- ko if: column.split_type() === $root.splitTypes.multiselect -->
<div class="form-group"> {# todo B5: css:form-group #}
<button class="btn btn-outline-primary btn-sm"
data-bind="visible: !column.showOptions(),
click: function() {
column.showOptions(true);
}">
{% trans "Show Options" %}
</button>
<button class="btn btn-outline-primary btn-sm my-2"
data-bind="visible: !column.showOptions(),
click: function() {
column.showOptions(true);
}">
{% trans "Show Options" %}
</button>

<button class="btn btn-outline-primary btn-sm"
data-bind="visible: column.showOptions(),
click: function() {
column.showOptions(false);
}">
{% trans "Hide Options" %}
</button>
</div>
<button class="btn btn-outline-primary btn-sm"
data-bind="visible: column.showOptions(),
click: function() {
column.showOptions(false);
}">
{% trans "Hide Options" %}
</button>
<div data-bind="visible: column.showOptions()">
<ul class="list-group"
data-bind="foreach: column.user_defined_options">
<li class="list-group-item">
<span data-bind="text: $data"></span>
<i style="cursor: pointer" {# todo B5: inline style #}
class="text-danger fa-regular fa-trash-can float-end"
<i class="clickable text-danger fa-regular fa-trash-can float-end"
data-bind="click: column.removeUserDefinedOption.bind(column)"></i>
</li>
</ul>
<div class="form-group"> {# todo B5: css:form-group #}
<div style="max-width: 200px" {# todo B5: inline style #}
class="input-group">
<input class="form-control input-sm"
type="text"
data-bind="value: column.userDefinedOptionToAdd"/>
<span class="input-group-btn"> {# todo B5: css:input-group-btn #}
<button type="submit"
class="btn btn-outline-primary btn-sm"
data-bind="click: column.addUserDefinedOption">
{% trans "Add" %}
</button>
</span>
</div>
<div style="max-width: 200px"
class="input-group">
<input class="form-control input-sm"
type="text"
data-bind="value: column.userDefinedOptionToAdd"/>
<button type="submit"
class="btn btn-outline-primary btn-sm"
data-bind="click: column.addUserDefinedOption">
{% trans "Add" %}
</button>
</div>
</div>
<!-- /ko -->
Expand Down
6 changes: 4 additions & 2 deletions corehq/apps/export/views/new.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
from memoized import memoized

from corehq.apps.accounting.decorators import requires_privilege_with_fallback
from corehq.apps.hqwebapp.decorators import use_bootstrap5
from corehq.apps.reports.analytics.esaccessors import get_case_types_for_domain
from dimagi.utils.web import json_response

Expand Down Expand Up @@ -61,9 +62,10 @@
from corehq.apps.data_dictionary.models import CaseProperty


@method_decorator(use_bootstrap5, name='dispatch')
class BaseExportView(BaseProjectDataView):
"""Base class for all create and edit export views"""
template_name = 'export/bootstrap3/customize_export_new.html'
template_name = 'export/bootstrap5/customize_export_new.html'
export_type = None
metric_name = None # Override
is_async = True
Expand Down Expand Up @@ -101,7 +103,7 @@ def terminology(self):
'help_text': mark_safe( # nosec: no user input
_("""
Learn more about exports on our <a
href="https://help.commcarehq.org/display/commcarepublic/Data+Export+Overview"
href="https://dimagi.atlassian.net/wiki/spaces/commcarepublic/pages/2143954661/Data+Exports"
target="_blank">Help Site</a>.
""")),
'name_label': _("Export Name"),
Expand Down
Loading
Loading