diff --git a/app/views/app_groups/_applications.html.slim b/app/views/app_groups/_applications.html.slim index fe74616d..a8af9a77 100644 --- a/app/views/app_groups/_applications.html.slim +++ b/app/views/app_groups/_applications.html.slim @@ -68,6 +68,9 @@ h4.mb-3 All Applications td.col-1 .btn.btn-primary.btn-sm data-toggle="modal" data-target="#manage-label-modal" data-app-name=app.name data-app-path=update_labels_app_path(app) i.fa.fa-tag.text-light + + .btn.btn-primary.btn-sm data-toggle="modal" data-target="#manage-redact-modal" data-app-name=app.name data-app-path=update_labels_app_path(app) + i.fa.fa-user-shield.text-light - if allow_delete .btn.btn-danger.btn-sm diff --git a/app/views/app_groups/_redact-modal.html.slim b/app/views/app_groups/_redact-modal.html.slim new file mode 100644 index 00000000..620803aa --- /dev/null +++ b/app/views/app_groups/_redact-modal.html.slim @@ -0,0 +1,173 @@ +div.modal.fade id="manage-redact-modal" tabindex="-1" role="dialog" aria-labeledby="manage-redact-modal-title" aria-hidden=true + div.modal-dialog role="document" + div.modal-content + = form_with(url: update_labels_app_group_path, method: 'patch', local: true, id: 'update-redacts') + div.modal-header + h5.modal-title#manage-redact-modal-title + = "Manage PII Redact Data Rules #{app_group}" + button.close data-dismiss="modal" aria-label="close" type="button" + span aria-hidden=true + | × + div.modal-body + table.table + thead + tr + th[scope="col"] + | PII + th[scope="col"] + | Value + - if @allow_manage_labels + th[scope="col"] + | Actions + tbody#redact-body + div.modal-footer + - if @allow_manage_labels + button#remove-all-redacts.btn.btn-danger type="button" + | remove all PII + button#add-redact.btn.btn-success type="button" + | add PII + button#submit-redact.btn.btn-primary type="submit" + | update + +javascript: + const redacts = #{labels.to_json.html_safe} + const allow_manage_redacts = #{allow_manage_labels} + + const removeAllRedacts = () => { + const rows = $(`tbody#redact-body tr[data-idx]`) + for (let row of rows) { + row.remove() + } + } + + const removeRedact = idx => { + let row = $(`tbody#redact-body tr[data-idx="${idx}"]`) + if (row.length < 1) { + console.log(`rows with redact ${idx} not found`) + } + + row[0].remove() + } + + const generateRowRedact = (pii, val, idx) => { + let delete_button = "" + if (allow_manage_labels) { + delete_button = ` + + ` + } + return ` + + + + + + + ${delete_button} + ` + console.log("Generated row:", row); + return row; + } + + const addRedact = (pii, val, idx) => { + console.log("Adding label:", pii, val, idx) + let tbody = $('tbody#redact-body') + let lastIdx = idx || Number($(tbody.children().last()).attr('data-idx'))+1 + let lastPii = pii || "" + let lastVal = val || "" + tbody.append(generateRowRedact(lastPii, lastVal, lastIdx)) + } + + const getIdFromClickedButtonRedact = event => { + return event.currentTarget.id + } + + const getRowNumberFromClickedButtonRedact = event => { + return $(event.currentTarget).attr('data-idx') + } + + const onModalButtonClickedRedact = event => { + console.log("Button clicked:", event.currentTarget.id) + const buttonId = getIdFromClickedButtonRedact(event) + switch(buttonId) { + case "remove-all-redacts": + removeAllRedacts() + break + case "remove-redact": + const idx = getRowNumberFromClickedButtonRedact(event) + removeRedact(idx) + break + case "add-redact": + addRedact() + break + } + } + + const removeAppNameFieldRedact = () => { + $(`input[name="app_name"]`).remove() + } + + const resetModalFieldsRedact = () => { + removeAllRedacts() + removeAppNameFieldRedact() + modifyTitle(`Manage PII redact Data #{app_group}`) + modifyFormAction(`#{update_labels_app_group_path}`) + } + + const getApplicationURLFromClickedButtonRedact = event => { + return $(event.relatedTarget).attr('data-app-path') + } + const getApplicationNameFromClickedButtonRedact = event => { + return $(event.relatedTarget).attr('data-app-name') + } + const isManageAppGroupRedactsEventRedact = event => { + return getApplicationNameFromClickedButtonRedact(event) === undefined + } + + const modifyTitleRedact = text => { + $('#manage-redact-modal-title').text(text) + } + + const modifyFormActionRedact = action => { + $('form#update-redacts').attr('action', action) + } + + const modifyModalForManageApplicationRedacts = event => { + let appName = getApplicationNameFromClickedButtonRedact(event) + modifyFormAction(getApplicationURLFromClickedButtonRedact(event)) + + modifyTitleRedact(`Manage PII Redact Data #{app_group}: ${appName}`) + + $('tbody#redact-body').append(``) + + return appName + } + + const showCurrentRedacts = redacts => { + Object.piis(redacts).map((pii, idx) => addRedact(pii, redacts[pii], idx+1)) + } + + const onModalOpenRedact = event => { + resetModalFieldsRedact() + + let shownRedact = [] + if (isManageAppGroupRedactsEvent(event)) { + shownRedact = redacts['app-group'] + } else { + let appName = modifyModalForManageApplicationRedacts(event) + shownRedact = redacts[appName] + } + + showCurrentRedacts(shownRedact) + } + + if (typeof $ === 'undefined') { + console.log("jQuery is not loaded!"); + } else { + console.log("jQuery is loaded and ready to use."); + } + + $('body').on('click', '#manage-redact-modal button.btn', onModalButtonClickedRedact) + $('#manage-redact-modal').on('show.bs.modal', onModalOpen) \ No newline at end of file diff --git a/app/views/app_groups/show.html.slim b/app/views/app_groups/show.html.slim index eefe641b..534e9dea 100644 --- a/app/views/app_groups/show.html.slim +++ b/app/views/app_groups/show.html.slim @@ -106,6 +106,11 @@ = link_to 'Show Helm Infrastructure', helm_infrastructure_path(@app_group.helm_infrastructure), class: 'text-light', style: 'text-decoration: none' - else = link_to 'Create Helm Infrastructure', new_app_group_helm_infrastructure_path(@app_group), class: 'text-light', style: 'text-decoration: none' + + .btn.btn-primary.btn-sm.mr-2 data-toggle="modal" data-target="#manage-redact-modal" + i.fa.fa-user-shield.mr-1 + | Redact PII Data Rules + - if @allow_delete_helm_infrastructure div class=("btn btn-danger btn-sm text-light #{!@allow_delete_helm_infrastructure ? 'disabled' : ''}") id=("delete_helm_infrastructure_#{@app_group.helm_infrastructure.id}") i.far.fa-trash-alt.mr-1 @@ -116,3 +121,4 @@ br = render 'app_groups/applications', new_app: @new_app, app_group: @app_group, apps: @apps, allow_delete: @allow_delete_barito_app, allow_add: @allow_add_barito_app = render 'app_groups/modal', labels: @labels, app_group: @app_group.name, allow_manage_labels:@allow_manage_labels += render 'app_groups/redact-modal', labels: @labels, app_group: @app_group.name, allow_manage_labels:@allow_manage_labels