From ccad1e74c04a7d5ad0b617e6d1f13db75e4599fa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= Date: Thu, 8 Aug 2024 08:52:01 -0300 Subject: [PATCH 1/6] feat: route changing and related --- src/sections/Route.enum.ts | 3 ++- src/sections/collection/CollectionFactory.tsx | 6 +++--- .../dataset-card/DatasetCardHeader.tsx | 2 ++ .../dataset-card/DatasetCardThumbnail.tsx | 6 +++++- .../top-fields-section/IdentifierField.tsx | 4 +--- .../file-info-cell/file-info-data/FileTitle.tsx | 3 ++- .../shared/hierarchy/BreadcrumbsGenerator.tsx | 8 ++++++-- src/sections/shared/link-to-page/LinkToPage.tsx | 15 +++++++++++++-- 8 files changed, 34 insertions(+), 13 deletions(-) diff --git a/src/sections/Route.enum.ts b/src/sections/Route.enum.ts index 56a3ad867..6842bcdbe 100644 --- a/src/sections/Route.enum.ts +++ b/src/sections/Route.enum.ts @@ -8,11 +8,12 @@ export enum Route { UPLOAD_DATASET_FILES = '/datasets/upload-files', EDIT_DATASET_METADATA = '/datasets/edit-metadata', FILES = '/files', - COLLECTIONS = '/collections', + COLLECTIONS = '/collections/:collectionId', CREATE_COLLECTION = '/collections/:ownerCollectionId/create' } export const RouteWithParams = { + COLLECTIONS: (collectionId?: string) => `/collections/${collectionId ?? 'root'}`, CREATE_COLLECTION: (ownerCollectionId?: string) => `/collections/${ownerCollectionId ?? 'root'}/create` } diff --git a/src/sections/collection/CollectionFactory.tsx b/src/sections/collection/CollectionFactory.tsx index 6654a6a05..3d6af655c 100644 --- a/src/sections/collection/CollectionFactory.tsx +++ b/src/sections/collection/CollectionFactory.tsx @@ -1,7 +1,7 @@ import { ReactElement } from 'react' import { Collection } from './Collection' import { DatasetJSDataverseRepository } from '../../dataset/infrastructure/repositories/DatasetJSDataverseRepository' -import { useLocation, useSearchParams } from 'react-router-dom' +import { useLocation, useParams, useSearchParams } from 'react-router-dom' import { CollectionJSDataverseRepository } from '../../collection/infrastructure/repositories/CollectionJSDataverseRepository' import { INFINITE_SCROLL_ENABLED } from './config' @@ -15,9 +15,9 @@ export class CollectionFactory { function CollectionWithSearchParams() { const [searchParams] = useSearchParams() + const { collectionId = 'root' } = useParams<{ collectionId: string }>() const location = useLocation() const page = searchParams.get('page') ? parseInt(searchParams.get('page') as string) : undefined - const id = searchParams.get('id') ? (searchParams.get('id') as string) : 'root' const state = location.state as { created: boolean } | undefined const created = state?.created ?? false @@ -26,7 +26,7 @@ function CollectionWithSearchParams() { repository={repository} datasetRepository={datasetRepository} page={page} - id={id} + id={collectionId} created={created} infiniteScrollEnabled={INFINITE_SCROLL_ENABLED} /> diff --git a/src/sections/collection/datasets-list/dataset-card/DatasetCardHeader.tsx b/src/sections/collection/datasets-list/dataset-card/DatasetCardHeader.tsx index 995177fc4..942f338f9 100644 --- a/src/sections/collection/datasets-list/dataset-card/DatasetCardHeader.tsx +++ b/src/sections/collection/datasets-list/dataset-card/DatasetCardHeader.tsx @@ -8,6 +8,7 @@ import { DatasetVersion, DatasetNonNumericVersionSearchParam } from '../../../../dataset/domain/models/Dataset' +import { DvObjectType } from '../../../../shared/hierarchy/domain/models/UpwardHierarchyNode' interface DatasetCardHeaderProps { persistentId: string @@ -29,6 +30,7 @@ export function DatasetCardHeader({ persistentId, version }: DatasetCardHeaderPr
{version.title} diff --git a/src/sections/collection/datasets-list/dataset-card/DatasetCardThumbnail.tsx b/src/sections/collection/datasets-list/dataset-card/DatasetCardThumbnail.tsx index d8065b0fa..78af22d41 100644 --- a/src/sections/collection/datasets-list/dataset-card/DatasetCardThumbnail.tsx +++ b/src/sections/collection/datasets-list/dataset-card/DatasetCardThumbnail.tsx @@ -3,6 +3,7 @@ import { LinkToPage } from '../../../shared/link-to-page/LinkToPage' import { Route } from '../../../Route.enum' import { DatasetThumbnail } from '../../../dataset/dataset-thumbnail/DatasetThumbnail' import { DatasetPublishingStatus, DatasetVersion } from '../../../../dataset/domain/models/Dataset' +import { DvObjectType } from '../../../../shared/hierarchy/domain/models/UpwardHierarchyNode' interface DatasetCardThumbnailProps { persistentId: string @@ -17,7 +18,10 @@ export function DatasetCardThumbnail({ }: DatasetCardThumbnailProps) { return (
- + { render={({ field: { onChange, ref, value }, fieldState: { invalid, error } }) => ( - - {window.location.origin}/spa/collections/?id= - + {window.location.origin}/spa/collections/ + {name} ) diff --git a/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx b/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx index 769b4c5bb..d45e41921 100644 --- a/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx +++ b/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx @@ -1,5 +1,8 @@ import { Breadcrumb } from '@iqss/dataverse-design-system' -import { UpwardHierarchyNode } from '../../../shared/hierarchy/domain/models/UpwardHierarchyNode' +import { + DvObjectType, + UpwardHierarchyNode +} from '../../../shared/hierarchy/domain/models/UpwardHierarchyNode' import { LinkToPage } from '../link-to-page/LinkToPage' import { Route } from '../../Route.enum' @@ -81,7 +84,7 @@ const LinkToDvObject = ({ version }: { name: string - type: string + type: DvObjectType id: string persistentId?: string version?: string @@ -89,6 +92,7 @@ const LinkToDvObject = ({ return ( + type: DvObjectType } -export function LinkToPage({ children, page, searchParams }: PropsWithChildren) { +export function LinkToPage({ + children, + page, + searchParams, + type +}: PropsWithChildren) { const searchParamsString: string = searchParams ? '?' + encodeSearchParamsToURI(searchParams) : '' + if (type === DvObjectType.COLLECTION && searchParams && 'id' in searchParams) { + return {children} + } + return {children} } From 4dc781422dbbcba5609d3b1ccbba855ed1deea42 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= Date: Thu, 8 Aug 2024 08:59:02 -0300 Subject: [PATCH 2/6] test: add cases --- .../hierarchy/BreadcrumbsGenerator.spec.tsx | 2 +- .../shared/link-to-page/LinkToPage.spec.tsx | 18 ++++++++++++++++-- .../e2e/sections/collection/Collection.spec.ts | 4 ++-- 3 files changed, 19 insertions(+), 5 deletions(-) diff --git a/tests/component/sections/shared/hierarchy/BreadcrumbsGenerator.spec.tsx b/tests/component/sections/shared/hierarchy/BreadcrumbsGenerator.spec.tsx index 725c12341..6f66aca45 100644 --- a/tests/component/sections/shared/hierarchy/BreadcrumbsGenerator.spec.tsx +++ b/tests/component/sections/shared/hierarchy/BreadcrumbsGenerator.spec.tsx @@ -27,7 +27,7 @@ describe('BreadcrumbsGenerator', () => { .should('have.attr', 'href', '/datasets?persistentId=doi:10.5072/FK2/ABC123&version=1.0') cy.findByRole('link', { name: 'Collection' }) .should('exist') - .should('have.attr', 'href', '/collections?id=collection1') + .should('have.attr', 'href', '/collections/collection1') cy.findByRole('link', { name: 'Root' }).should('have.attr', 'href', '/') }) diff --git a/tests/component/sections/shared/link-to-page/LinkToPage.spec.tsx b/tests/component/sections/shared/link-to-page/LinkToPage.spec.tsx index 25d166231..49ed6a6bc 100644 --- a/tests/component/sections/shared/link-to-page/LinkToPage.spec.tsx +++ b/tests/component/sections/shared/link-to-page/LinkToPage.spec.tsx @@ -1,14 +1,28 @@ import { LinkToPage } from '../../../../../src/sections/shared/link-to-page/LinkToPage' import { Route } from '../../../../../src/sections/Route.enum' +import { DvObjectType } from '../../../../../src/shared/hierarchy/domain/models/UpwardHierarchyNode' describe('LinkToPage', () => { it('renders a link to the page with the given search params', () => { - cy.customMount() + cy.customMount( + + ) cy.findByRole('link').should('have.attr', 'href', '/datasets?foo=bar') }) it('renders a link to the page without search params', () => { - cy.customMount() + cy.customMount() cy.findByRole('link').should('have.attr', 'href', '/datasets') }) + + it('renders a link to the collection page with the given id', () => { + cy.customMount( + + ) + cy.findByRole('link').should('have.attr', 'href', '/collections/collection1') + }) }) diff --git a/tests/e2e-integration/e2e/sections/collection/Collection.spec.ts b/tests/e2e-integration/e2e/sections/collection/Collection.spec.ts index 43dc2193e..8ac0dcd21 100644 --- a/tests/e2e-integration/e2e/sections/collection/Collection.spec.ts +++ b/tests/e2e-integration/e2e/sections/collection/Collection.spec.ts @@ -123,7 +123,7 @@ describe('Collection Page', () => { it('displays a collection different from the root when accessing a subcollection', () => { cy.wrap(CollectionHelper.create('collection-1')).then(() => { - cy.visit('/spa/collections?id=collection-1') + cy.visit('/spa/collections/collection-1') cy.findAllByText(/Scientific Research/i).should('exist') cy.findByText(/Dataverse Admin/i).should('exist') @@ -135,7 +135,7 @@ describe('Collection Page', () => { cy.wrap(CollectionHelper.create(collectionId)).then(() => { cy.wrap(DatasetHelper.createMany(12, collectionId), { timeout: 10_000 }).then(() => { cy.wait(2_000) // Wait for the datasets to be created - cy.visit(`/spa/collections?id=${collectionId}`) + cy.visit(`/spa/collections/${collectionId}`) cy.findAllByText(/Scientific Research/i).should('exist') cy.findByText(/Dataverse Admin/i).should('exist') From 9b20818e3ba091f1ed28fddf4173952df696316f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= Date: Thu, 8 Aug 2024 09:21:59 -0300 Subject: [PATCH 3/6] test: change viewport size to see if solves tests failing sometimes --- .../dataset/dataset-files/DatasetFilesScrollable.spec.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/tests/component/sections/dataset/dataset-files/DatasetFilesScrollable.spec.tsx b/tests/component/sections/dataset/dataset-files/DatasetFilesScrollable.spec.tsx index c4fe9cc1e..674c70782 100644 --- a/tests/component/sections/dataset/dataset-files/DatasetFilesScrollable.spec.tsx +++ b/tests/component/sections/dataset/dataset-files/DatasetFilesScrollable.spec.tsx @@ -67,6 +67,7 @@ const settingsRepository = {} as SettingRepository describe('DatasetFilesScrollable', () => { beforeEach(() => { + cy.viewport(1280, 720) fileRepository.getAllByDatasetPersistentIdWithCount = cy.stub().resolves(testFiles) fileRepository.getFilesCountInfoByDatasetPersistentId = cy.stub().resolves(testFilesCountInfo) fileRepository.getFilesTotalDownloadSizeByDatasetPersistentId = cy.stub().resolves(19900) @@ -494,7 +495,9 @@ describe('DatasetFilesScrollable', () => { cy.findByRole('columnheader', { name: '10 of 200 Files displayed' }).should('exist') cy.get('table > thead > tr > th > input[type=checkbox]').click() cy.findByText('10 files are currently selected.').should('exist') - cy.findByRole('button', { name: 'Select all 200 files in this dataset.' }).click() + cy.findByRole('button', { name: 'Select all 200 files in this dataset.' }).click({ + force: true + }) cy.findByText('200 files are currently selected.').should('exist') cy.findByTestId('scrollable-files-container').as('scrollableFilesContainer') From e717e2b61eab0c50d2b3172075293467ca3e804c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= Date: Thu, 8 Aug 2024 09:53:22 -0300 Subject: [PATCH 4/6] test: fix e2e test --- .../create-collection/collection-form/useSubmitCollection.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sections/create-collection/collection-form/useSubmitCollection.ts b/src/sections/create-collection/collection-form/useSubmitCollection.ts index 41c6a183c..19e8fb09d 100644 --- a/src/sections/create-collection/collection-form/useSubmitCollection.ts +++ b/src/sections/create-collection/collection-form/useSubmitCollection.ts @@ -60,7 +60,7 @@ export function useSubmitCollection( setSubmitError(null) setSubmissionStatus(SubmissionStatus.SubmitComplete) - navigate(`${Route.COLLECTIONS}?id=${newCollection.alias}`, { + navigate(`${Route.COLLECTIONS}/${newCollection.alias}`, { state: { created: true } }) return From 802703235ba082f10038d6c53ea54f6c53f99bc3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= Date: Thu, 8 Aug 2024 10:20:48 -0300 Subject: [PATCH 5/6] tests: new fix --- .../collection-form/useSubmitCollection.ts | 4 ++-- .../create-collection/CreateCollection.spec.tsx | 10 ++++++++-- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/src/sections/create-collection/collection-form/useSubmitCollection.ts b/src/sections/create-collection/collection-form/useSubmitCollection.ts index 19e8fb09d..c917ed0cd 100644 --- a/src/sections/create-collection/collection-form/useSubmitCollection.ts +++ b/src/sections/create-collection/collection-form/useSubmitCollection.ts @@ -5,7 +5,7 @@ import { createCollection } from '../../../collection/domain/useCases/createColl import { CollectionRepository } from '../../../collection/domain/repositories/CollectionRepository' import { CollectionDTO } from '../../../collection/domain/useCases/DTOs/CollectionDTO' import { CollectionFormData, CollectionFormValuesOnSubmit } from './CollectionForm' -import { Route } from '../../Route.enum' +import { RouteWithParams } from '../../Route.enum' import { JSDataverseWriteErrorHandler } from '../../../shared/helpers/JSDataverseWriteErrorHandler' export enum SubmissionStatus { @@ -60,7 +60,7 @@ export function useSubmitCollection( setSubmitError(null) setSubmissionStatus(SubmissionStatus.SubmitComplete) - navigate(`${Route.COLLECTIONS}/${newCollection.alias}`, { + navigate(RouteWithParams.COLLECTIONS(newCollection.alias), { state: { created: true } }) return diff --git a/tests/e2e-integration/e2e/sections/create-collection/CreateCollection.spec.tsx b/tests/e2e-integration/e2e/sections/create-collection/CreateCollection.spec.tsx index 093871cb8..948efddd4 100644 --- a/tests/e2e-integration/e2e/sections/create-collection/CreateCollection.spec.tsx +++ b/tests/e2e-integration/e2e/sections/create-collection/CreateCollection.spec.tsx @@ -1,4 +1,5 @@ import { TestsUtils } from '../../../shared/TestsUtils' +import { faker } from '@faker-js/faker' describe('Create Collection', () => { before(() => { @@ -12,13 +13,18 @@ describe('Create Collection', () => { it('navigates to the collection page after submitting a valid form', () => { cy.visit('/spa/collections/root/create') - cy.findByLabelText(/^Identifier/i).type('some-alias') + const collectionName = faker.lorem.words(3) + + cy.findByLabelText(/^Collection Name/i).clear() + cy.findByLabelText(/^Collection Name/i).type(collectionName) + + cy.findByRole('button', { name: 'Apply suggestion' }).click() cy.findByLabelText(/^Category/i).select(1) cy.findByRole('button', { name: 'Create Collection' }).click() - cy.findByRole('heading', { name: 'Dataverse Admin Collection' }).should('exist') + cy.findByRole('heading', { name: collectionName }).should('exist') cy.findByText('Success!').should('exist') }) }) From 2d38d97f0501ff5e14d03d6428774271e5546af4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= Date: Tue, 13 Aug 2024 14:22:54 -0300 Subject: [PATCH 6/6] improve interface --- src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx b/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx index d45e41921..507b218d0 100644 --- a/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx +++ b/src/sections/shared/hierarchy/BreadcrumbsGenerator.tsx @@ -70,7 +70,7 @@ export function BreadcrumbsGenerator({ ) } -const dvObjectTypeToRoute: Record = { +const dvObjectTypeToRoute: Record = { dataset: Route.DATASETS, collection: Route.COLLECTIONS, file: Route.FILES