Merge pull request #342 from AllenNeuralDynamics/release-v1.22.0

Release v1.22.0

Author: helen-m-lin

src/aind_data_transfer_service/__init__.py

@@ -2,7 +2,7 @@
 
 import os
 
-__version__ = "1.21.0"
+__version__ = "1.22.0"
 
 # Global constants
 OPEN_DATA_BUCKET_NAME = os.getenv("OPEN_DATA_BUCKET_NAME", "open")

src/aind_data_transfer_service/models/core.py

@@ -240,6 +240,33 @@ def validate_with_context(cls, v: str, info: ValidationInfo) -> str:
         else:
             return v
 
+    @field_validator("tasks", mode="after")
+    def validate_tasks(
+        cls, v: Dict[str, Union[Task, Dict[str, Task]]]
+    ) -> Dict[str, Union[Task, Dict[str, Task]]]:
+        """Validate that modality-specific tasks are keyed by valid
+        modality abbreviations."""
+        modality_tasks = [
+            "modality_transformation_settings",
+            "codeocean_pipeline_settings",
+        ]
+        for task_id, task_value in v.items():
+            if task_id in modality_tasks:
+                if isinstance(task_value, Task) and task_value.skip_task:
+                    continue
+                if not isinstance(task_value, dict):
+                    raise ValueError(
+                        f"{task_id} must be a dictionary of modality "
+                        f"abbreviations to Task objects."
+                    )
+                for modality_key in task_value.keys():
+                    if modality_key not in Modality.abbreviation_map:
+                        raise ValueError(
+                            f'Key {modality_key} in tasks["{task_id}"] is not '
+                            f"a valid modality abbreviation."
+                        )
+        return v
+
 
 class SubmitJobRequestV2(BaseSettings):
     """Main request that will be sent to the backend. Bundles jobs into a list

src/aind_data_transfer_service/templates/job_status.html

@@ -40,7 +40,7 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 <!-- filter by job status -->
                 <div class="input-group input-group-sm mb-1">
                     <span class="input-group-text" style="width:35%">Status</span>
-                    <select class="form-select" onchange="filterJobsByColumn(4, this.value);this.blur();">
+                    <select class="form-select" onchange="filterJobsByColumn(5, this.value);this.blur();">
                         {% for s in [
                             {"label": "all", "value": "", "class": "text-dark"},
                             {"label": "queued", "value": "queued", "class": "text-secondary"},
@@ -61,31 +61,31 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 <hr class="flex-grow-1 border-secondary">
                 <div class="input-group input-group-sm mb-1">
                     <span class="input-group-text" style="width:35%">Asset Name</span>
-                    <input id="filter-name-input" type="text" class="form-control" placeholder="asset name" oninput="filterJobsByColumn(0, this.value)">
-                    <button id="filter-name-clear" class="btn btn-outline-secondary" type="button" title="Clear" onclick="clearFilterJobsByColumn(0, '#filter-name-input')">
+                    <input id="filter-name-input" type="text" class="form-control" placeholder="asset name" oninput="filterJobsByColumn(1, this.value)">
+                    <button id="filter-name-clear" class="btn btn-outline-secondary" type="button" title="Clear" onclick="clearFilterJobsByColumn(1, '#filter-name-input')">
                         <i class="bi bi-x-lg"></i>
                     </button>
                 </div>
                 <!-- filter by job id-->
                 <div class="input-group input-group-sm mb-1">
                     <span class="input-group-text" style="width:35%">Job ID</span>
-                    <input id="filter-id-input" type="text" class="form-control" placeholder="job id" oninput="filterJobsByColumn(1, this.value)">
-                    <button id="filter-id-clear" class="btn btn-outline-secondary" type="button" title="Clear" onclick="clearFilterJobsByColumn(1, '#filter-id-input')">
+                    <input id="filter-id-input" type="text" class="form-control" placeholder="job id" oninput="filterJobsByColumn(2, this.value)">
+                    <button id="filter-id-clear" class="btn btn-outline-secondary" type="button" title="Clear" onclick="clearFilterJobsByColumn(2, '#filter-id-input')">
                         <i class="bi bi-x-lg"></i>
                     </button>
                 </div>
                 <!-- filter by job type-->
                 <div class="input-group input-group-sm mb-1">
                     <span class="input-group-text" style="width:35%">Job Type</span>
-                    <input id="filter-job-type-input" type="text" class="form-control" placeholder="job type" oninput="filterJobsByColumn(2, this.value)">
-                    <button id="filter-job-type-clear" class="btn btn-outline-secondary" type="button" title="Clear" onclick="clearFilterJobsByColumn(2, '#filter-job-type-input')">
+                    <input id="filter-job-type-input" type="text" class="form-control" placeholder="job type" oninput="filterJobsByColumn(3, this.value)">
+                    <button id="filter-job-type-clear" class="btn btn-outline-secondary" type="button" title="Clear" onclick="clearFilterJobsByColumn(3, '#filter-job-type-input')">
                         <i class="bi bi-x-lg"></i>
                     </button>
                 </div>
                 <!-- filter by dag id -->
                 <div class="input-group input-group-sm mb-1">
                     <span class="input-group-text" style="width:35%">Dag ID</span>
-                    <select class="form-select" onchange="filterJobsByColumn(3, this.value);this.blur();">
+                    <select class="form-select" onchange="filterJobsByColumn(4, this.value);this.blur();">
                         <option class="text-dark" value="">all</option>
                         {% for dag_id in dag_ids %}
                         <option class="text-secondary" value="^{{ dag_id }}$">{{ dag_id }}</option>
@@ -99,6 +99,7 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
             <table id="searchJobsTable" class="display compact table table-bordered table-sm" style="font-size: small">
                 <thead>
                     <tr>
+                        <th></th>
                         <th>Asset Name</th>
                         <th>Job ID</th>
                         <th>Job Type</th>
@@ -130,6 +131,45 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 </div>
                 </div>
             </div>
+            <!-- modal for cancelling a running job -->
+            <div class="modal fade" id="cancel-modal-full" tabindex="-1" aria-labelledby="cancel-modal-full-label" aria-hidden="true">
+                <div class="modal-dialog modal-l">
+                    <div class="modal-content">
+                        <div class="modal-header p-2">
+                            <div class="modal-title fw-bold" id="cancel-modal-full-label" style="font-size: small">Cancel Upload Job</div>
+                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                        </div>
+                        <div class="cancel-modal-body p-3" style="font-size: small">
+                            <div class="alert alert-danger mb-3" role="alert">
+                                <div class="mb-2"><strong>WARNING!</strong> You are about to cancel the following upload job:</div>
+                                <div><strong>Asset Name:</strong> <span id="cancel-modal-job-name"></span></div>
+                                <div><strong>Job ID:</strong> <span id="cancel-modal-job-id"></span></div>
+                            </div>
+                            <div class="mb-3">
+                                If data has already begun uploading to the cloud, please contact a data administrator to
+                                remove the partial upload.
+                            </div>
+                            <div class="mb-3">
+                                Please type <strong>YES</strong> to confirm:
+                                <input id="cancel-confirm-input" type="text" class="form-control"placeholder="YES"
+                                    oninput="onCancelConfirmationInput(this.value)"
+                                >
+                            </div>
+                            <button id="cancel-confirm-button" type="button" class="btn btn-danger" disabled
+                                onclick="cancelUploadJob()"
+                            >Confirm</button>
+                            <div id="cancel-feedback" class="mt-2">
+                                <div id="cancel-spinner" class="spinner-border text-primary ms-2" role="status" hidden><span class="visually-hidden">Loading...</span></div>
+                                </div>
+                                <div id="success-message" class="text-success mt-2" hidden>Cancellation request sent
+                                </div>
+                                <div id="error-message" class="alert alert-danger mt-2 p-2" hidden>Error sending cancellation request
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
     </div>
     <script>
@@ -140,7 +180,7 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
             const today = moment();
             const twoWeeksAgo = moment().subtract(13, 'days');
 
-            // initialize daterangepicker for submit date filter
+            // Initialize daterangepicker for submit date filter
             $('#submit-date-range').daterangepicker({
                 startDate: twoWeeksAgo,
                 endDate: today,
@@ -154,15 +194,15 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 }
             }, filterJobsBySubmitTimeRange);
 
-            // initialize job status table with default values
+            // Initialize job status table with default values
             const initialParams = {
                 // set default submit date range client-side for browser's local time
                 execution_date_gte: twoWeeksAgo.startOf('day').toISOString(),
                 execution_date_lte: today.endOf('day').toISOString(),
             };
             updateJobStatusTable(initialParams);
 
-            // tasks modal for full jobs table
+            // Tasks modal for full jobs table
             var tasksModal = document.getElementById('tasks-modal-full');
             tasksModal.addEventListener('show.bs.modal', function (event) {
                 var sourceData = event.relatedTarget?.dataset;
@@ -171,6 +211,20 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
             tasksModal.addEventListener('hidden.bs.modal', function (event) {
                 updateJobTasksModal(null, null, null, null);
             })
+            // Cancel modal
+            var cancelModal = document.getElementById('cancel-modal-full');
+            cancelModal.addEventListener('show.bs.modal', function (event) {
+                // Store source data in the modal's dataset
+                var sourceData = event.relatedTarget?.dataset;
+                cancelModal.dataset.dagId = sourceData?.dagId;
+                cancelModal.dataset.jobId = sourceData?.jobId;
+                cancelModal.dataset.jobName = sourceData?.jobName;
+                // update modal content
+                updateCancelJobModal();
+            })
+            cancelModal.addEventListener('hidden.bs.modal', function (event) {
+                resetCancelJobModal();
+            })
         });
         // FULL JOBS TABLE -----------------------------------------------
         // Helper functions for custom column rendering
@@ -195,6 +249,29 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
             }
             return data;
         }
+        // Cancel Job Button Renderer
+        function renderCancelJobButton(data, type, row) {
+            // Only generate HTML for the UI display
+            if (type !== 'display') {
+                return data; // fallback
+            }
+            const disabled = row.job_state !== "running" && row.job_state !== "queued";
+            return `
+                <button
+                    type="button"
+                    class="btn btn-outline-danger btn-sm rounded-circle"
+                    ${disabled ? "disabled" : ""}
+                    title="Cancel running job"
+                    data-bs-toggle="modal"
+                    data-bs-target="#cancel-modal-full"
+                    data-dag-id="${row.dag_id}"
+                    data-job-id="${row.job_id}"
+                    data-job-name="${row.name}"
+                >
+                    <i class="bi bi-x-lg"></i>
+                </button>
+            `;
+        }
         // Create DataTable for full jobs table
         function createFullJobsTable() {
             $('#searchJobsTable').DataTable({
@@ -204,6 +281,13 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 },
                 processing: true,
                 columns: [
+                    {
+                        data: null,
+                        orderable: false,
+                        searchable: false,
+                        width: '40px',
+                        render: renderCancelJobButton
+                    },
                     { data: 'name', searchable: true },
                     { data: 'job_id', searchable: true },
                     { data: 'job_type', searchable: true },
@@ -218,7 +302,7 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 initComplete: (settings, json) => updateJobsCount(json),
                 // layout options
                 pageLength: 25,
-                order: [5, 'desc'], // submit time descending
+                order: [6, 'desc'], // submit time descending
                 layout: {
                     topStart: null,
                     topEnd: null,
@@ -271,13 +355,96 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 tasksIframe.src = "";
             }
         }
+        // Modal for cancelling a job from full jobs table
+        function updateCancelJobModal() {
+            const cancelModal = document.getElementById('cancel-modal-full');
+            document.getElementById('cancel-modal-job-name').textContent = cancelModal.dataset.jobName;
+            document.getElementById('cancel-modal-job-id').textContent = cancelModal.dataset.jobId;
+        }
+        function resetCancelJobModal() {
+            // Clear modal content
+            document.getElementById('cancel-modal-job-name').textContent = '';
+            document.getElementById('cancel-modal-job-id').textContent = '';
+            document.getElementById('cancel-confirm-input').value = '';
+            document.getElementById('cancel-confirm-button').disabled = true;
+
+            // Hide messages and spinner
+            document.getElementById('success-message').hidden = true;
+            document.getElementById('error-message').hidden = true;
+            document.getElementById('cancel-spinner').hidden = true;
+
+            // Clear stored data in modal dataset
+            const cancelModal = document.getElementById('cancel-modal-full');
+            cancelModal.dataset.dagId = '';
+            cancelModal.dataset.jobId = '';
+            cancelModal.dataset.jobName = '';
+        }
+        function cancelUploadJob() {
+            // Get job data from modal dataset
+            const cancelModal = document.getElementById('cancel-modal-full');
+            const dagId = cancelModal.dataset.dagId;
+            const jobId = cancelModal.dataset.jobId;
+            const jobName = cancelModal.dataset.jobName;
+            if (!dagId || !jobId || !jobName) {
+                alert($`Error: Missing data to cancel job!\n\nDag ID: ${dagId}\nJob ID: ${jobId}\nAsset Name: ${jobName}`);
+                return;
+            }
+
+            // Disable confirm button to prevent double submission
+            const confirmButton = $('#cancel-confirm-button');
+            confirmButton.prop('disabled', true);
+
+            // Show spinner while waiting for server response to cancel job
+            const spinner = document.getElementById('cancel-spinner');
+            spinner.hidden = false;
+
+            // Log the payload for debugging
+            const payload = {
+                dag_run_id: jobId,
+                dag_id: dagId,
+                s3_prefix: jobName
+            };
+            console.log('Sending cancellation payload:', payload);
+
+            $.ajax({
+                type: 'POST',
+                url: '{{ url_for("cancel_job") }}',
+                contentType: 'application/json',
+                data: JSON.stringify({
+                    dag_run_id: jobId,
+                    dag_id: dagId,
+                    s3_prefix: jobName
+                }),
+                success: function(response) {
+                    spinner.hidden = true;
+                    document.getElementById('success-message').hidden = false;
+                    // Refresh table to reflect job cancellation
+                    $('#searchJobsTable').DataTable().ajax.reload(null, false);
+                },
+                error: function(xhr, status, error) {
+                    spinner.hidden = true;
+                    const errMsg = xhr.responseJSON?.data?.error || error;
+                    const errorDiv = document.getElementById('error-message');
+                    errorDiv.textContent = `Error sending cancellation request: ${errMsg}`;
+                    errorDiv.hidden = false;
+                    confirmButton.prop('disabled', false);
+                }
+            });
+        }
+        // Attach Enter key listener ONCE; triggers only if the user types "YES"
+        $('#cancel-confirm-input').on('keypress', function(e) {
+            if (e.key === 'Enter' && this.value === 'YES') {
+                cancelUploadJob();
+            }
+        });
+
         // EVENT HANDLERS ------------------------------------------------
         function updateJobStatusTable(newParams) {
             Object.entries(newParams).forEach(([key, value]) => {
                 tableUrl.searchParams.set(key, value);
             });
             if (DataTable.isDataTable('#searchJobsTable')) {
-                // load the table with new params and update total entries
+                // Load the table with new params and update total entries
                 $('#searchJobsTable').DataTable().ajax.url(tableUrl.toString()).load(
                     (data) => updateJobsCount(data)
                 );
@@ -286,12 +453,12 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
             }
         }
         function updateJobsCount(data) {
-            // data is the response from the server after ajax call
+            // Data is the response from the server after ajax call
             $('#total-entries').text(data?.data?.total_entries);
         }
         // Filters
         function filterJobsByColumn(columnIndex, value) {
-            if (columnIndex == 3 || columnIndex == 4) {
+            if (columnIndex == 4 || columnIndex == 5) {
                 //exact match for dag_id and job_state dropdowns
                 $('#searchJobsTable').DataTable().columns(columnIndex).search(value.trim(), true, false).draw();
             } else {
@@ -311,6 +478,12 @@ <h4 class="mb-2">Jobs Submitted: <span id="total-entries"></span></h4>
                 execution_date_lte: end.toISOString(),
             });
         }
+        function onCancelConfirmationInput(inputValue) {
+            // Enable cancel jobs confirm button only if input is "YES"
+            const confirmButton = $('#cancel-confirm-button');
+            const disabled = inputValue !== 'YES';
+            confirmButton.prop('disabled', disabled);
+        }
     </script>
     </body>
 </html>