From b373fae9a52a9bfb1849f5f85972aa7fe4b9a11f Mon Sep 17 00:00:00 2001 From: Nicholas Lee Date: Mon, 23 Sep 2024 12:19:41 -0400 Subject: [PATCH 1/3] fix: address feedback --- .../Extraction/components/ExtractionTable.tsx | 84 ++++++++++--------- .../components/ExtractionTableAuthor.tsx | 14 +++- .../components/ExtractionTableDOI.tsx | 12 ++- .../components/ExtractionTableFilterInput.tsx | 2 +- .../components/ExtractionTableJournal.tsx | 12 ++- .../ExtractionTableJournalAutocomplete.tsx | 2 +- .../components/ExtractionTableName.tsx | 12 ++- .../components/ExtractionTablePMID.tsx | 12 ++- .../components/ExtractionTableStatus.tsx | 15 +++- .../components/ExtractionTableYear.tsx | 12 ++- 10 files changed, 113 insertions(+), 64 deletions(-) diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx index f8937694..72c1229f 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx @@ -37,7 +37,6 @@ import { useNavigate } from 'react-router-dom'; import { EExtractionStatus } from '../ExtractionPage'; import styles from './ExtractionTable.module.css'; import { ExtractionTableAuthorCell, ExtractionTableAuthorHeader } from './ExtractionTableAuthor'; -import { ExtractionTableDOICell, ExtractionTableDOIHeader } from './ExtractionTableDOI'; import ExtractionTableFilterInput from './ExtractionTableFilterInput'; import { ExtractionTableJournalCell, ExtractionTableJournalHeader } from './ExtractionTableJournal'; import { ExtractionTableNameCell, ExtractionTableNameHeader } from './ExtractionTableName'; @@ -106,9 +105,9 @@ const ExtractionTable: React.FC = () => { return [ columnHelper.accessor(({ year }) => (year ? String(year) : ''), { id: 'year', - size: 5, - minSize: 5, - maxSize: 5, + size: 70, + minSize: 70, + maxSize: 70, cell: ExtractionTableYearCell, header: ExtractionTableYearHeader, enableSorting: true, @@ -121,9 +120,9 @@ const ExtractionTable: React.FC = () => { columnHelper.accessor('name', { id: 'name', cell: ExtractionTableNameCell, - size: 25, - minSize: 25, - maxSize: 25, + size: 500, + minSize: 500, + maxSize: 500, header: ExtractionTableNameHeader, enableSorting: true, sortingFn: 'text', @@ -134,9 +133,9 @@ const ExtractionTable: React.FC = () => { }), columnHelper.accessor('authors', { id: 'authors', - size: 20, - minSize: 20, - maxSize: 20, + size: 300, + minSize: 300, + maxSize: 300, enableSorting: true, enableColumnFilter: true, sortingFn: 'text', @@ -149,9 +148,9 @@ const ExtractionTable: React.FC = () => { }), columnHelper.accessor('publication', { id: 'journal', - size: 15, - minSize: 15, - maxSize: 15, + size: 100, + minSize: 100, + maxSize: 100, enableSorting: true, enableColumnFilter: true, cell: ExtractionTableJournalCell, @@ -160,26 +159,26 @@ const ExtractionTable: React.FC = () => { filterVariant: 'journal-autocomplete', }, }), - columnHelper.accessor('doi', { - id: 'doi', - size: 15, - minSize: 15, - maxSize: 15, - sortingFn: 'alphanumeric', - enableSorting: true, - enableColumnFilter: true, - filterFn: 'includesString', - cell: ExtractionTableDOICell, - header: ExtractionTableDOIHeader, - meta: { - filterVariant: 'text', - }, - }), + // columnHelper.accessor('doi', { + // id: 'doi', + // size: 10, + // minSize: 10, + // maxSize: 10, + // sortingFn: 'alphanumeric', + // enableSorting: true, + // enableColumnFilter: true, + // filterFn: 'includesString', + // cell: ExtractionTableDOICell, + // header: ExtractionTableDOIHeader, + // meta: { + // filterVariant: 'text', + // }, + // }), columnHelper.accessor('pmid', { id: 'pmid', - size: 10, - minSize: 10, - maxSize: 10, + size: 100, + minSize: 100, + maxSize: 100, enableColumnFilter: true, filterFn: 'includesString', cell: ExtractionTablePMIDCell, @@ -192,9 +191,9 @@ const ExtractionTable: React.FC = () => { }), columnHelper.accessor('status', { id: 'status', - size: 10, - minSize: 10, - maxSize: 10, + size: 120, + minSize: 120, + maxSize: 120, enableSorting: true, cell: ExtractionTableStatusCell, filterFn: (row, columnId, filterValue: EExtractionStatus | null) => { @@ -270,20 +269,16 @@ const ExtractionTable: React.FC = () => { onChange={handlePaginationChangeMuiPaginator} page={pagination.pageIndex + 1} /> - Total: {data.length} studies - +
{table.getHeaderGroups().map((headerGroup) => ( {headerGroup.headers.map((header) => ( {flexRender( @@ -416,7 +411,14 @@ const ExtractionTable: React.FC = () => { - Viewing {table.getFilteredRowModel().rows.length} / {data.length} + {columnFilters.length > 0 ? ( + + Viewing {table.getFilteredRowModel().rows.length} /{' '} + {data.length} + + ) : ( + Total: {data.length} studies + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx index 8cfac918..717ab712 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx @@ -33,19 +33,27 @@ export const ExtractionTableAuthorHeader: React.FC< } }} > - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + sx={{ width: '' }} + ) : ( table.setSorting([{ id: 'authors', desc: false }])} > - + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableDOI.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableDOI.tsx index bf36cf6e..5e4844cf 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableDOI.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableDOI.tsx @@ -37,19 +37,25 @@ export const ExtractionTableDOIHeader: React.FC - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + ) : ( table.setSorting([{ id: 'doi', desc: false }])} > - + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableFilterInput.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableFilterInput.tsx index 728bdcbe..86a4ec00 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableFilterInput.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableFilterInput.tsx @@ -41,7 +41,7 @@ const ExtractionTableFilterInput: React.FC<{ - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + ) : ( table.setSorting([{ id: 'journal', desc: false }])} > - + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableJournalAutocomplete.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableJournalAutocomplete.tsx index 07225d68..e4fa3cbe 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableJournalAutocomplete.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableJournalAutocomplete.tsx @@ -31,7 +31,7 @@ const ExtractionTableJournalAutocomplete: React.FC<{ } + renderInput={(params) => } onChange={handleChange} value={value || null} options={options} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableName.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableName.tsx index 21198759..f25011e3 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableName.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableName.tsx @@ -37,19 +37,25 @@ export const ExtractionTableNameHeader: React.FC - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + ) : ( table.setSorting([{ id: 'name', desc: false }])} > - + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTablePMID.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTablePMID.tsx index aefc1208..6ded5224 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTablePMID.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTablePMID.tsx @@ -33,19 +33,25 @@ export const ExtractionTablePMIDHeader: React.FC - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + ) : ( table.setSorting([{ id: 'pmid', desc: false }])} > - + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableStatus.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableStatus.tsx index 0be5f302..7a23808a 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableStatus.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableStatus.tsx @@ -28,6 +28,7 @@ export const ExtractionTableStatusCell: React.FC< disableElevation sx={{ paddingX: '0' }} color="warning" + size="small" variant={ status === undefined || status === EExtractionStatus.UNCATEGORIZED ? 'contained' @@ -47,6 +48,7 @@ export const ExtractionTableStatusCell: React.FC< disableElevation sx={{ paddingX: '0' }} color="info" + size="small" variant={status === EExtractionStatus.SAVEDFORLATER ? 'contained' : 'outlined'} > @@ -62,6 +64,7 @@ export const ExtractionTableStatusCell: React.FC< disableElevation sx={{ paddingX: '0' }} color="success" + size="small" variant={status === EExtractionStatus.COMPLETED ? 'contained' : 'outlined'} > @@ -92,19 +95,25 @@ export const ExtractionTableStatusHeader: React.FC< } }} > - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + ) : ( table.setSorting([{ id: 'status', desc: false }])} > - + )} diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableYear.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableYear.tsx index 84cd28a4..ce9d7d4f 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableYear.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableYear.tsx @@ -34,19 +34,25 @@ export const ExtractionTableYearHeader: React.FC - + ) : isSorted === 'asc' ? ( table.resetSorting()}> - + ) : ( table.setSorting([{ id: 'year', desc: false }])} > - + )} From 0ff3f4a1f77cc288ee1fa6f7bd2a476fb5f5575e Mon Sep 17 00:00:00 2001 From: Nicholas Lee Date: Mon, 23 Sep 2024 13:56:21 -0400 Subject: [PATCH 2/3] fix: extraction tests --- .../Extraction/ExtractionTable.cy.tsx | 92 +++++++++---------- compose/neurosynth_compose/openapi | 2 +- 2 files changed, 46 insertions(+), 48 deletions(-) diff --git a/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx b/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx index d2b039dd..30d6a675 100644 --- a/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx +++ b/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx @@ -370,46 +370,46 @@ describe('ExtractionTable', () => { }); }); - it('should sort by doi desc', () => { - cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); - - cy.wait('@studysetFixture').then((studysetFixture) => { - const studyset = studysetFixture.response?.body as StudysetReturn; - const studies = [...(studyset.studies || [])] as StudyReturn[]; - - const sortedStudies = studies.sort((a, b) => - (b.doi as string).localeCompare(a.doi as string) - ); - - console.log(sortedStudies); - - cy.get('tbody > tr').each((tr, index) => { - cy.wrap(tr).within(() => { - cy.get('td').eq(4).should('have.text', sortedStudies[index].doi); - }); - }); - }); - }); - it('should sort by doi asc', () => { - cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); - cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); - cy.get('[data-testid="ArrowUpwardIcon"]').should('exist'); - - cy.wait('@studysetFixture').then((studysetFixture) => { - const studyset = studysetFixture.response?.body as StudysetReturn; - const studies = [...(studyset.studies || [])] as StudyReturn[]; - - const sortedStudies = studies.sort((a, b) => - (a.doi as string).localeCompare(b.doi as string) - ); - - cy.get('tbody > tr').each((tr, index) => { - cy.wrap(tr).within(() => { - cy.get('td').eq(4).should('have.text', sortedStudies[index].doi); - }); - }); - }); - }); + // it('should sort by doi desc', () => { + // cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); + + // cy.wait('@studysetFixture').then((studysetFixture) => { + // const studyset = studysetFixture.response?.body as StudysetReturn; + // const studies = [...(studyset.studies || [])] as StudyReturn[]; + + // const sortedStudies = studies.sort((a, b) => + // (b.doi as string).localeCompare(a.doi as string) + // ); + + // console.log(sortedStudies); + + // cy.get('tbody > tr').each((tr, index) => { + // cy.wrap(tr).within(() => { + // cy.get('td').eq(4).should('have.text', sortedStudies[index].doi); + // }); + // }); + // }); + // }); + // it('should sort by doi asc', () => { + // cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); + // cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); + // cy.get('[data-testid="ArrowUpwardIcon"]').should('exist'); + + // cy.wait('@studysetFixture').then((studysetFixture) => { + // const studyset = studysetFixture.response?.body as StudysetReturn; + // const studies = [...(studyset.studies || [])] as StudyReturn[]; + + // const sortedStudies = studies.sort((a, b) => + // (a.doi as string).localeCompare(b.doi as string) + // ); + + // cy.get('tbody > tr').each((tr, index) => { + // cy.wrap(tr).within(() => { + // cy.get('td').eq(4).should('have.text', sortedStudies[index].doi); + // }); + // }); + // }); + // }); it('should sort by pmid desc', () => { cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); @@ -424,12 +424,10 @@ describe('ExtractionTable', () => { }) ); - console.log(sortedStudies); - cy.get('tbody > tr').each((tr, index) => { cy.wrap(tr).within(() => { cy.get('td') - .eq(5) + .eq(4) .should('have.text', sortedStudies[index].pmid ?? ''); }); }); @@ -437,8 +435,8 @@ describe('ExtractionTable', () => { }); it('should sort by pmid asc', () => { - cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); - cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); + cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); + cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); cy.get('[data-testid="ArrowUpwardIcon"]').should('exist'); cy.wait('@studysetFixture').then((studysetFixture) => { @@ -487,7 +485,7 @@ describe('ExtractionTable', () => { cy.get('tbody > tr').each((tr, index) => { cy.wrap(tr).within(() => { cy.get('td') - .eq(6) + .eq(5) .within(() => { const studyStatus = sortedStudies[index].status; const buttonIndex = @@ -545,7 +543,7 @@ describe('ExtractionTable', () => { cy.get('tbody > tr').each((tr, index) => { cy.wrap(tr).within(() => { cy.get('td') - .eq(6) + .eq(5) .within(() => { const studyStatus = sortedStudies[index].status; const buttonIndex = diff --git a/compose/neurosynth_compose/openapi b/compose/neurosynth_compose/openapi index ca2494f7..3e4cba60 160000 --- a/compose/neurosynth_compose/openapi +++ b/compose/neurosynth_compose/openapi @@ -1 +1 @@ -Subproject commit ca2494f73d0c88c013c7aab0b0de8f8a89b4bc11 +Subproject commit 3e4cba60f52a6c6bdd1ac5b55cb70d0ae3399aab From fc2281657b97389748d5b7e1c56be29d0cd3b445 Mon Sep 17 00:00:00 2001 From: Nicholas Lee Date: Mon, 23 Sep 2024 17:14:05 -0400 Subject: [PATCH 3/3] fix: tests --- .../Extraction/ExtractionTable.cy.tsx | 38 +++++++++---------- .../Extraction/components/ExtractionTable.tsx | 13 ++++++- .../components/ExtractionTableAuthor.tsx | 2 - 3 files changed, 30 insertions(+), 23 deletions(-) diff --git a/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx b/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx index 30d6a675..24b8054f 100644 --- a/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx +++ b/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx @@ -95,26 +95,26 @@ describe('ExtractionTable', () => { cy.get('tbody > tr').should('have.length', 1); }); - it('should filter the table by doi', () => { - cy.wait('@studysetFixture').then((studysetFixture) => { - const studyset = studysetFixture?.response?.body as StudysetReturn; - const studysetStudies = studyset.studies as StudyReturn[]; - cy.get('input').eq(4).click(); - cy.get(`input`) - .eq(4) - .type(studysetStudies[0].doi || ''); - }); + // it('should filter the table by doi', () => { + // cy.wait('@studysetFixture').then((studysetFixture) => { + // const studyset = studysetFixture?.response?.body as StudysetReturn; + // const studysetStudies = studyset.studies as StudyReturn[]; + // cy.get('input').eq(4).click(); + // cy.get(`input`) + // .eq(4) + // .type(studysetStudies[0].doi || ''); + // }); - cy.get('tbody > tr').should('have.length', 1); - }); + // cy.get('tbody > tr').should('have.length', 1); + // }); it('should filter the table by pmid', () => { cy.wait('@studysetFixture').then((studysetFixture) => { const studyset = studysetFixture?.response?.body as StudysetReturn; const studysetStudies = studyset.studies as StudyReturn[]; - cy.get('input').eq(5).click(); + cy.get('input').eq(4).click(); cy.get(`input`) - .eq(5) + .eq(4) .type(studysetStudies[0].pmid || ''); }); @@ -181,7 +181,7 @@ describe('ExtractionTable', () => { it('should change the study status', () => { // ARRANGE - cy.get('tbody > tr').eq(0).get('td').eq(6).as('getFirstRowStudyStatusCol'); + cy.get('tbody > tr').eq(0).get('td').eq(5).as('getFirstRowStudyStatusCol'); cy.get('@getFirstRowStudyStatusCol').within(() => { cy.get('button').eq(0).should('have.class', 'MuiButton-contained'); }); @@ -412,7 +412,7 @@ describe('ExtractionTable', () => { // }); it('should sort by pmid desc', () => { - cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); + cy.get('[data-testid="ArrowDownwardIcon"]').eq(4).click(); cy.wait('@studysetFixture').then((studysetFixture) => { const studyset = studysetFixture.response?.body as StudysetReturn; @@ -452,7 +452,7 @@ describe('ExtractionTable', () => { cy.get('tbody > tr').each((tr, index) => { cy.wrap(tr).within(() => { cy.get('td') - .eq(5) + .eq(4) .should('have.text', sortedStudies[index].pmid ?? ''); }); }); @@ -460,7 +460,7 @@ describe('ExtractionTable', () => { }); it('should sort by status desc', () => { - cy.get('[data-testid="ArrowDownwardIcon"]').eq(6).click(); + cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); cy.wait('@projectFixture').then((projectFixture) => { const project = projectFixture?.response?.body as INeurosynthProjectReturn; @@ -516,8 +516,8 @@ describe('ExtractionTable', () => { }); it('should sort by status asc', () => { - cy.get('[data-testid="ArrowDownwardIcon"]').eq(6).click(); - cy.get('[data-testid="ArrowDownwardIcon"]').eq(6).click(); + cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); + cy.get('[data-testid="ArrowDownwardIcon"]').eq(5).click(); cy.get('[data-testid="ArrowUpwardIcon"]').should('exist'); cy.wait('@projectFixture').then((projectFixture) => { diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx index 72c1229f..1024be82 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTable.tsx @@ -271,14 +271,23 @@ const ExtractionTable: React.FC = () => { /> -
+
{table.getHeaderGroups().map((headerGroup) => ( {headerGroup.headers.map((header) => ( {flexRender( diff --git a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx index 717ab712..0636a61c 100644 --- a/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx +++ b/compose/neurosynth-frontend/src/pages/Extraction/components/ExtractionTableAuthor.tsx @@ -40,7 +40,6 @@ export const ExtractionTableAuthorHeader: React.FC< ) : isSorted === 'asc' ? ( table.resetSorting()}> - sx={{ width: '' }} @@ -48,7 +47,6 @@ export const ExtractionTableAuthorHeader: React.FC< ) : ( table.setSorting([{ id: 'authors', desc: false }])} >