[ENH] Implemented logic to allow for querying pipeline name and versi…

…on (#322)

* Added types for pipeline related fields

* Implemented logic for pipeline fields

* Implemented dropdowns for pipeline fields

* Implemented logic for displaying pipelines and their versions

* Implemented logic for displaying pipeline info in the downloadable files

* Updated fetching of diagnoses and assessment terms

* Added `RetrievedVersions` interface

* Implemented logic to retrieve pipeline names and versions

* Implemented logic to populate pipeline related fields

* Updated mocked responses

* Updated e2e tests

* Added tests for pipeline related responses

* Updated relevant component tests

* Added an assertion for pipeline info in `participants-level-results.tsv`

* Added a test for enabling of pipeline version field

* Added assertions for displaying available pipelines

* Implemented assertions for displaying pipeline related fields

* Added `All` option for pipeline version

* Fixed the `APIRequest` e2e test

* Remvoed the `only` method from `Form` e2e test

* Addressed suggested changes from PR review

cypress/component/QueryForm.cy.tsx

@@ -42,6 +42,11 @@ const props = {
   setIsControl: () => {},
   assessmentTool: null,
   imagingModality: null,
+  pipelineVersion: null,
+  pipelineName: null,
+  pipelines: {
+    'np:fmriprep': ['0.2.3', '23.1.3'],
+  },
   updateCategoricalQueryParams: () => {},
   updateContinuousQueryParams: () => {},
   loading: false,
@@ -66,6 +71,9 @@ describe('QueryForm', () => {
         setIsControl={props.setIsControl}
         assessmentTool={props.assessmentTool}
         imagingModality={props.imagingModality}
+        pipelineVersion={props.pipelineVersion}
+        pipelineName={props.pipelineName}
+        pipelines={props.pipelines}
         updateCategoricalQueryParams={props.updateCategoricalQueryParams}
         updateContinuousQueryParams={props.updateContinuousQueryParams}
         loading={props.loading}
@@ -85,6 +93,8 @@ describe('QueryForm', () => {
     );
     cy.get('[data-cy="Assessment tool-categorical-field"]').should('be.visible');
     cy.get('[data-cy="Imaging modality-categorical-field"]').should('be.visible');
+    cy.get('[data-cy="Pipeline name-categorical-field"]').should('be.visible');
+    cy.get('[data-cy="Pipeline version-categorical-field"]').should('be.visible');
     cy.get('[data-cy="submit-query-button"]').should('be.visible');
   });
   it('Fires updateCategoricalQueryParams event handler with the appropriate payload when a categorical field is selected', () => {
@@ -105,6 +115,9 @@ describe('QueryForm', () => {
         setIsControl={props.setIsControl}
         assessmentTool={props.assessmentTool}
         imagingModality={props.imagingModality}
+        pipelineVersion={props.pipelineVersion}
+        pipelineName={props.pipelineName}
+        pipelines={props.pipelines}
         updateCategoricalQueryParams={updateCategoricalQueryParamsSpy}
         updateContinuousQueryParams={props.updateContinuousQueryParams}
         loading={props.loading}
@@ -136,6 +149,9 @@ describe('QueryForm', () => {
         setIsControl={props.setIsControl}
         assessmentTool={props.assessmentTool}
         imagingModality={props.imagingModality}
+        pipelineVersion={props.pipelineVersion}
+        pipelineName={props.pipelineName}
+        pipelines={props.pipelines}
         updateCategoricalQueryParams={props.updateCategoricalQueryParams}
         updateContinuousQueryParams={updateContinuousQueryParamsSpy}
         loading={props.loading}
@@ -163,6 +179,9 @@ describe('QueryForm', () => {
         setIsControl={props.setIsControl}
         assessmentTool={props.assessmentTool}
         imagingModality={props.imagingModality}
+        pipelineVersion={props.pipelineVersion}
+        pipelineName={props.pipelineName}
+        pipelines={props.pipelines}
         updateCategoricalQueryParams={props.updateCategoricalQueryParams}
         updateContinuousQueryParams={props.updateContinuousQueryParams}
         loading={props.loading}

cypress/component/ResultCard.cy.tsx

@@ -10,12 +10,18 @@ const props = {
     'http://purl.org/nidash/nidm#ArterialSpinLabeling',
     'http://purl.org/nidash/nidm#DiffusionWeighted',
   ],
+  pipelines: {
+    'https://github.com/nipoppy/pipeline-catalog/tree/main/processing/fmriprep': [
+      '0.2.3',
+      '23.1.3',
+    ],
+  },
   checked: true,
   onCheckboxChange: () => {},
 };
 
 describe('ResultCard', () => {
-  it('Displays a MUI card with node name, dataset name, number of matched subjects, total number of subjects, and a checkbox', () => {
+  it('Displays a MUI card with node name, dataset name, number of matched subjects, total number of subjects, available pipelines, and a checkbox', () => {
     cy.mount(
       <ResultCard
         nodeName={props.nodeName}
@@ -24,6 +30,7 @@ describe('ResultCard', () => {
         datasetTotalSubjects={props.datasetTotalSubjects}
         numMatchingSubjects={props.numMatchingSubjects}
         imageModals={props.imageModals}
+        pipelines={props.pipelines}
         checked={props.checked}
         onCheckboxChange={props.onCheckboxChange}
       />
@@ -37,9 +44,14 @@ describe('ResultCard', () => {
       .should('contain', 'ASL')
       .should('have.class', 'bg-zinc-800');
     cy.get('[data-cy="card-some uuid"] button')
-      .eq(1)
+      .eq(2)
       .should('contain', 'DWI')
       .should('have.class', 'bg-red-700');
+
+    cy.get('[data-cy="card-some uuid-available-pipelines-button"]').trigger('mouseover', {
+      force: true,
+    });
+    cy.get('.MuiTooltip-tooltip').should('contain', 'fmriprep 0.2.3');
   });
   it('Fires onCheckboxChange event handler with the appropriate payload when the checkbox is clicked', () => {
     const onCheckboxChangeSpy = cy.spy().as('onCheckboxChangeSpy');
@@ -51,6 +63,7 @@ describe('ResultCard', () => {
         datasetTotalSubjects={props.datasetTotalSubjects}
         numMatchingSubjects={props.numMatchingSubjects}
         imageModals={props.imageModals}
+        pipelines={props.pipelines}
         checked={false}
         onCheckboxChange={onCheckboxChangeSpy}
       />