diff --git a/package-lock.json b/package-lock.json index 9cc24ff30..7f57aad70 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,7 @@ "@dnd-kit/sortable": "8.0.0", "@dnd-kit/utilities": "3.2.2", "@faker-js/faker": "7.6.0", - "@iqss/dataverse-client-javascript": "2.0.0-alpha.48", + "@iqss/dataverse-client-javascript": "2.0.0-alpha.49", "@iqss/dataverse-design-system": "*", "@istanbuljs/nyc-config-typescript": "1.0.2", "@tanstack/react-table": "8.9.2", @@ -3561,9 +3561,9 @@ }, "node_modules/@iqss/dataverse-client-javascript": { "name": "@IQSS/dataverse-client-javascript", - "version": "2.0.0-alpha.48", - "resolved": "https://npm.pkg.github.com/download/@IQSS/dataverse-client-javascript/2.0.0-alpha.48/40c12b030381bb947bfd2771d512e37f4fd979b8", - "integrity": "sha512-GHbdb0JnYSQwseMGzsOAq4wZgwycqw554AVEI/Aqd/9H385Pj9YM7X/YcsYPRkUpHSVIcLZJs4714EObE6QWuA==", + "version": "2.0.0-alpha.49", + "resolved": "https://npm.pkg.github.com/download/@IQSS/dataverse-client-javascript/2.0.0-alpha.49/e408c52852e582909468df9978cd759e757f6785", + "integrity": "sha512-pX0GmwHz+VEsMorLwkcC42hFf8UlSzQ30W6T5qUq4aVSLHiMdQV98kjeXN//qsMe9OCpsb8KhGFAcGobvzGhSw==", "license": "MIT", "dependencies": { "@types/node": "^18.15.11", diff --git a/package.json b/package.json index b485cb47a..d203c8a7a 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,7 @@ "@dnd-kit/sortable": "8.0.0", "@dnd-kit/utilities": "3.2.2", "@faker-js/faker": "7.6.0", - "@iqss/dataverse-client-javascript": "2.0.0-alpha.48", + "@iqss/dataverse-client-javascript": "2.0.0-alpha.49", "@iqss/dataverse-design-system": "*", "@istanbuljs/nyc-config-typescript": "1.0.2", "@tanstack/react-table": "8.9.2", diff --git a/src/sections/collection/collection-items-panel/items-list/ItemsList.tsx b/src/sections/collection/collection-items-panel/items-list/ItemsList.tsx index 6f7014681..3225842a4 100644 --- a/src/sections/collection/collection-items-panel/items-list/ItemsList.tsx +++ b/src/sections/collection/collection-items-panel/items-list/ItemsList.tsx @@ -175,12 +175,15 @@ export const ItemsList = forwardRef(
  • {collectionItem?.type === CollectionItemType.COLLECTION && ( )} {collectionItem?.type === CollectionItemType.DATASET && ( - + )} {collectionItem?.type === CollectionItemType.FILE && ( diff --git a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.module.scss b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.module.scss index 2e4fc4163..fdbc1d1e9 100644 --- a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.module.scss +++ b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.module.scss @@ -20,15 +20,9 @@ @include link-hover-underlined; } - .left-side-content { - display: flex; - flex-wrap: wrap; - gap: 8px; - - .affiliation { - margin: 0; - color: $dv-subtext-color; - } + .affiliation { + margin-left: 6px; + color: $dv-subtext-color; } .title-and-labels { @@ -50,11 +44,6 @@ } } -.thumbnail-and-info-wrapper { - display: flex; - gap: 1rem; -} - .card-thumbnail-container { padding-block: 0.25rem; @@ -78,22 +67,16 @@ } } -.card-info-container { - align-self: flex-start; +.card-body-container { + align-items: flex-start; font-size: $dv-font-size-sm; - .date-link-wrapper { - display: flex; - flex-wrap: wrap; - column-gap: 0.5rem; - - .date { - color: $dv-subtext-color; - } + .release-or-create-date { + color: $dv-subtext-color; + } - a { - @include link-hover-underlined; - } + a { + @include link-hover-underlined; } .description { @@ -102,7 +85,8 @@ line-clamp: 3; -webkit-box-orient: vertical; width: 100%; + margin: 0; overflow: hidden; - color: black; + color: #000; } } diff --git a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.tsx b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.tsx index aaf5a56c5..92e5684b5 100644 --- a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.tsx +++ b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCard.tsx @@ -1,7 +1,6 @@ import { CollectionCardHeader } from './CollectionCardHeader' -import { CollectionCardThumbnail } from './CollectionCardThumbnail' -import { CollectionCardInfo } from './CollectionCardInfo' import { CollectionItemTypePreview } from '@/collection/domain/models/CollectionItemTypePreview' +import { CollectionCardBody } from './CollectionCardBody' import styles from './CollectionCard.module.scss' interface CollectionCardProps { @@ -13,13 +12,10 @@ export function CollectionCard({ collectionPreview, parentCollectionAlias }: Col return (
    -
    - - -
    +
    ) } diff --git a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardInfo.tsx b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardBody.tsx similarity index 55% rename from src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardInfo.tsx rename to src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardBody.tsx index 0aaaec08d..f4136324c 100644 --- a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardInfo.tsx +++ b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardBody.tsx @@ -1,46 +1,51 @@ import { Stack } from '@iqss/dataverse-design-system' import { CollectionItemTypePreview } from '@/collection/domain/models/CollectionItemTypePreview' +import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' -import { DateHelper } from '@/shared/helpers/DateHelper' import { Route } from '@/sections/Route.enum' -import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' +import { CollectionCardThumbnail } from './CollectionCardThumbnail' +import { DateHelper } from '@/shared/helpers/DateHelper' import styles from './CollectionCard.module.scss' -interface CollectionCardInfoProps { +interface CollectionCardBodyProps { collectionPreview: CollectionItemTypePreview parentCollectionAlias?: string } -export function CollectionCardInfo({ +export const CollectionCardBody = ({ collectionPreview, parentCollectionAlias -}: CollectionCardInfoProps) { +}: CollectionCardBodyProps) => { const isStandingOnParentCollectionPage = !!parentCollectionAlias && collectionPreview.parentCollectionAlias === parentCollectionAlias return ( -
    - -
    + + + + {!isStandingOnParentCollectionPage && ( - - {collectionPreview.parentCollectionName} - + + - + + {collectionPreview.parentCollectionName} + + )} -
    +     {collectionPreview.description && (

    {collectionPreview.description}

    )} -
    + ) } diff --git a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardHeader.tsx b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardHeader.tsx index e6530dd44..9f75fc669 100644 --- a/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardHeader.tsx +++ b/src/sections/collection/collection-items-panel/items-list/collection-card/CollectionCardHeader.tsx @@ -1,4 +1,4 @@ -import { Badge, Icon, IconName } from '@iqss/dataverse-design-system' +import { Badge, Icon, IconName, Stack } from '@iqss/dataverse-design-system' import { Route } from '@/sections/Route.enum' import { CollectionItemTypePreview } from '@/collection/domain/models/CollectionItemTypePreview' import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' @@ -12,28 +12,33 @@ interface CollectionCardHeaderProps { export function CollectionCardHeader({ collectionPreview }: CollectionCardHeaderProps) { return (
    -
    - - {collectionPreview.name} - - {collectionPreview.affiliation && ( -

    ({collectionPreview.affiliation})

    - )} - {!collectionPreview.isReleased && ( -
    - Unpublished -
    - )} - {collectionPreview.userRoles && - collectionPreview.userRoles.map((role, index) => ( -
    - {role} -
    - ))} -
    + + + + {collectionPreview.name} + + {collectionPreview.affiliation && ( + ({collectionPreview.affiliation}) + )} + + + + {!collectionPreview.isReleased && Unpublished} + + {collectionPreview.userRoles && ( + + {collectionPreview.userRoles.map((role, index) => ( + + {role} + + ))} + + )} + +
    diff --git a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.module.scss b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.module.scss index 06047e34d..01f178300 100644 --- a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.module.scss +++ b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.module.scss @@ -12,11 +12,6 @@ border-radius: 4px; } -.thumbnail-and-info-wrapper { - display: flex; - gap: 1rem; -} - .card-header-container { display: flex; gap: 1rem; @@ -68,23 +63,25 @@ } } -.card-info-container { - display: flex; - flex-direction: column; - gap: 4px; - align-self: flex-start; - width: 100%; +.card-body-container { + align-items: flex-start; font-size: $dv-font-size-sm; - .date { + .release-or-create-date { color: $dv-subtext-color; } + .link-to-collection-wrapper a { + @include link-hover-underlined; + } + .citation-box { display: -webkit-box; padding: 4px; overflow: hidden; + font-size: $dv-font-size-sm; background-color: color.adjust($dv-primary-color, $lightness: 51%); + border: solid 1px color.adjust($dv-primary-color, $lightness: 20%); border-radius: 4px; -webkit-line-clamp: 5; line-clamp: 5; @@ -96,6 +93,7 @@ &.deaccesioned { background-color: color.adjust($dv-danger-box-color, $lightness: 6%); + border: solid 1px color.adjust($dv-danger-color, $lightness: 20%); } & > div { @@ -109,6 +107,7 @@ line-clamp: 3; -webkit-box-orient: vertical; width: 100%; + margin: 0; overflow: hidden; color: #000; } diff --git a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.tsx b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.tsx index bf3c42f8c..eb4172ade 100644 --- a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.tsx +++ b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.tsx @@ -1,33 +1,26 @@ import { DatasetItemTypePreview } from '@/dataset/domain/models/DatasetItemTypePreview' import { DatasetCardHeader } from './DatasetCardHeader' -import { DatasetCardThumbnail } from './DatasetCardThumbnail' -import { DatasetCardInfo } from './DatasetCardInfo' +import { DatasetCardBody } from './DatasetCardBody' import styles from './DatasetCard.module.scss' interface DatasetCardProps { datasetPreview: DatasetItemTypePreview + parentCollectionAlias?: string } -export function DatasetCard({ datasetPreview }: DatasetCardProps) { +export function DatasetCard({ datasetPreview, parentCollectionAlias }: DatasetCardProps) { return (
    + -
    - - -
    ) } diff --git a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardBody.tsx b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardBody.tsx new file mode 100644 index 000000000..324bd63e1 --- /dev/null +++ b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardBody.tsx @@ -0,0 +1,68 @@ +import cn from 'classnames' +import { Stack } from '@iqss/dataverse-design-system' +import { DatasetItemTypePreview } from '@/dataset/domain/models/DatasetItemTypePreview' +import { DatasetPublishingStatus } from '@/dataset/domain/models/Dataset' +import { DateHelper } from '@/shared/helpers/DateHelper' +import { CitationDescription } from '@/sections/shared/citation/CitationDescription' +import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' +import { DatasetCardThumbnail } from './DatasetCardThumbnail' +import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' +import { Route } from '@/sections/Route.enum' +import styles from './DatasetCard.module.scss' + +interface DatasetCardBodyProps { + datasetPreview: DatasetItemTypePreview + parentCollectionAlias?: string +} + +export const DatasetCardBody = ({ + datasetPreview, + parentCollectionAlias +}: DatasetCardBodyProps) => { + const { version, releaseOrCreateDate, description } = datasetPreview + + const isStandingOnParentCollectionPage = + !!parentCollectionAlias && datasetPreview.parentCollectionAlias === parentCollectionAlias + + return ( + + + + + + + + {!isStandingOnParentCollectionPage && ( + + - + + {datasetPreview.parentCollectionName} + + + )} + + +
    + +
    +     +     +

    {description}

    +     + ) +} diff --git a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardHeader.tsx b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardHeader.tsx index e4e39110d..6f0db44d9 100644 --- a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardHeader.tsx +++ b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardHeader.tsx @@ -1,20 +1,30 @@ import { Route } from '@/sections/Route.enum' import { DatasetCardHelper } from './DatasetCardHelper' +import { Badge, Stack } from '@iqss/dataverse-design-system' import { DatasetVersion } from '@/dataset/domain/models/Dataset' import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' import { DatasetIcon } from '@/sections/dataset/dataset-icon/DatasetIcon' -import { DatasetLabels } from '@/sections/dataset/dataset-labels/DatasetLabels' import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' +import { PublicationStatus } from '@/shared/core/domain/models/PublicationStatus' import styles from './DatasetCard.module.scss' -import { Badge } from '@iqss/dataverse-design-system' interface DatasetCardHeaderProps { persistentId: string version: DatasetVersion + publicationStatuses: PublicationStatus[] userRoles?: string[] } -export function DatasetCardHeader({ persistentId, version, userRoles }: DatasetCardHeaderProps) { +export function DatasetCardHeader({ + persistentId, + version, + publicationStatuses, + userRoles +}: DatasetCardHeaderProps) { + const publicationStatusesFiltered = publicationStatuses + .filter((status) => status !== PublicationStatus.Published) + .sort((a, b) => a.localeCompare(b)) + return (
    @@ -28,13 +38,28 @@ export function DatasetCardHeader({ persistentId, version, userRoles }: DatasetC )}> {version.title} - - {userRoles && - userRoles.map((role, index) => ( -
    - {role} -
    - ))} + + + {publicationStatusesFiltered.length > 0 && ( + + {publicationStatusesFiltered.map((status) => ( + + {status} + + ))} + + )} + + {userRoles && ( + + {userRoles.map((role, index) => ( + + {role} + + ))} + + )} +
    @@ -43,3 +68,14 @@ export function DatasetCardHeader({ persistentId, version, userRoles }: DatasetC
    ) } + +const BADGE_VARIANT_BY_PUBLICATION_STATUS: Record< + PublicationStatus, + 'primary' | 'secondary' | 'success' | 'danger' | 'warning' +> = { + [PublicationStatus.Draft]: 'primary', + [PublicationStatus.InReview]: 'success', + [PublicationStatus.Deaccessioned]: 'danger', + [PublicationStatus.Unpublished]: 'warning', + [PublicationStatus.Published]: 'secondary' // This status is not shown but included for completeness +} diff --git a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardInfo.tsx b/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardInfo.tsx deleted file mode 100644 index 194ac622d..000000000 --- a/src/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardInfo.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import cn from 'classnames' -import { DatasetPublishingStatus, DatasetVersion } from '@/dataset/domain/models/Dataset' -import { DateHelper } from '@/shared/helpers/DateHelper' -import { CitationDescription } from '@/sections/shared/citation/CitationDescription' -import styles from './DatasetCard.module.scss' - -interface DatasetCardInfoProps { - version: DatasetVersion - releaseOrCreateDate: Date - description: string -} - -export function DatasetCardInfo({ - version, - releaseOrCreateDate, - description -}: DatasetCardInfoProps) { - return ( -
    - -
    - -
    -

    {description}

    -
    - ) -} diff --git a/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.module.scss b/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.module.scss index 492c48275..b06776058 100644 --- a/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.module.scss +++ b/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.module.scss @@ -87,22 +87,16 @@ } } -.card-info-container { +.card-body-container { align-self: flex-start; font-size: $dv-font-size-sm; - .date-link-wrapper { - display: flex; - flex-wrap: wrap; - column-gap: 0.5rem; - - .date { - color: $dv-subtext-color; - } + .release-or-create-date { + color: $dv-subtext-color; + } - a { - @include link-hover-underlined; - } + a { + @include link-hover-underlined; } .info { @@ -123,8 +117,9 @@ line-clamp: 3; -webkit-box-orient: vertical; width: 100%; + margin: 0; overflow: hidden; - color: black; + color: #000; } } diff --git a/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.tsx b/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.tsx index c1b67a446..2fcaf8c68 100644 --- a/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.tsx +++ b/src/sections/collection/collection-items-panel/items-list/file-card/FileCard.tsx @@ -1,7 +1,6 @@ import { FileItemTypePreview } from '@/files/domain/models/FileItemTypePreview' import { FileCardHeader } from './FileCardHeader' -import { FileCardThumbnail } from './FileCardThumbnail' -import { FileCardInfo } from './FileCardInfo' +import { FileCardBody } from './FileCardBody' import styles from './FileCard.module.scss' interface FileCardProps { @@ -12,10 +11,7 @@ export function FileCard({ filePreview }: FileCardProps) { return (
    -
    - - -
    +
    ) } diff --git a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardBody.tsx b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardBody.tsx new file mode 100644 index 000000000..1198e0fd5 --- /dev/null +++ b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardBody.tsx @@ -0,0 +1,66 @@ +import { Stack } from '@iqss/dataverse-design-system' +import { FileItemTypePreview } from '@/files/domain/models/FileItemTypePreview' +import { FileCardHelper } from './FileCardHelper' +import { FileCardThumbnail } from './FileCardThumbnail' +import styles from './FileCard.module.scss' +import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' +import { DateHelper } from '@/shared/helpers/DateHelper' +import { Route } from '@/sections/Route.enum' +import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' +import { PublicationStatus } from '@/shared/core/domain/models/PublicationStatus' +import { CopyToClipboardButton } from '@/sections/dataset/dataset-files/files-table/file-info/file-info-cell/file-info-data/copy-to-clipboard-button/CopyToClipboardButton' +import { FileLabels } from '@/sections/file/file-labels/FileLabels' + +interface FileCardBodyProps { + filePreview: FileItemTypePreview +} + +export const FileCardBody = ({ filePreview }: FileCardBodyProps) => { + const bytesFormatted = FileCardHelper.formatBytesToCompactNumber(filePreview.sizeInBytes) + const variables = filePreview.variables || 0 + const observations = filePreview.observations || 0 + + return ( + + + + + + + + - + + {filePreview.datasetName} + + + +
    + {filePreview.fileType} + {`- ${bytesFormatted}`} + {filePreview.fileType === 'Tab-Delimited' && ( + {`- ${variables} variables, ${observations} observations`} + )} + {filePreview.checksum && ( + + {`- ${filePreview.checksum.type}:`} + + + )} +
    + +     +     + {filePreview.description &&

    {filePreview.description}

    } +     + ) +} diff --git a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHeader.tsx b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHeader.tsx index af672762c..c934ed867 100644 --- a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHeader.tsx +++ b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHeader.tsx @@ -1,4 +1,4 @@ -import { Badge, Icon, IconName } from '@iqss/dataverse-design-system' +import { Badge, Icon, IconName, Stack } from '@iqss/dataverse-design-system' import { PublicationStatus } from '@/shared/core/domain/models/PublicationStatus' import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' import { FileItemTypePreview } from '@/files/domain/models/FileItemTypePreview' @@ -6,7 +6,6 @@ import { FileType } from '@/files/domain/models/FileMetadata' import { FileTypeToFileIconMap } from '@/sections/file/file-preview/FileTypeToFileIconMap' import { Route } from '@/sections/Route.enum' import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' -import { DatasetLabels } from '@/sections/dataset/dataset-labels/DatasetLabels' import { FileCardHelper } from './FileCardHelper' import { FileAccessRestrictedIcon } from '../../../../file/file-access/FileAccessRestrictedIcon' import styles from './FileCard.module.scss' @@ -19,6 +18,10 @@ export function FileCardHeader({ filePreview }: FileCardHeaderProps) { const iconFileType = new FileType(filePreview.fileContentType) const iconName = FileTypeToFileIconMap[iconFileType.value] || IconName.OTHER + const publicationStatusesFiltered = filePreview.publicationStatuses + .filter((status) => status !== PublicationStatus.Published) + .sort((a, b) => a.localeCompare(b)) + return (
    @@ -38,18 +41,28 @@ export function FileCardHeader({ filePreview }: FileCardHeaderProps) { )}> {filePreview.name} - + {publicationStatusesFiltered.length > 0 && ( + + {publicationStatusesFiltered.map((status) => ( + + {status} + + ))} + )} - /> - {filePreview.userRoles && - filePreview.userRoles.map((role, index) => ( -
    - {role} -
    - ))} + + {filePreview.userRoles && ( + + {filePreview.userRoles.map((role, index) => ( + + {role} + + ))} + + )} +
    @@ -58,3 +71,14 @@ export function FileCardHeader({ filePreview }: FileCardHeaderProps) {
    ) } + +const BADGE_VARIANT_BY_PUBLICATION_STATUS: Record< + PublicationStatus, + 'primary' | 'secondary' | 'success' | 'danger' | 'warning' +> = { + [PublicationStatus.Draft]: 'primary', + [PublicationStatus.InReview]: 'success', + [PublicationStatus.Deaccessioned]: 'danger', + [PublicationStatus.Unpublished]: 'warning', + [PublicationStatus.Published]: 'secondary' // This status is not shown but included for completeness +} diff --git a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHelper.ts b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHelper.ts index cdd60c36b..88f0541a6 100644 --- a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHelper.ts +++ b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardHelper.ts @@ -1,10 +1,4 @@ -import { - DatasetLabel, - DatasetLabelSemanticMeaning, - DatasetLabelValue, - DatasetNonNumericVersionSearchParam -} from '@/dataset/domain/models/Dataset' -import { PublicationStatus } from '@/shared/core/domain/models/PublicationStatus' +import { DatasetNonNumericVersionSearchParam } from '@/dataset/domain/models/Dataset' export class FileCardHelper { static getDatasetSearchParams(persistentId: string, isDraft: boolean): Record { @@ -22,22 +16,6 @@ export class FileCardHelper { return params } - static getDatasetLabels( - publicationStatuses: PublicationStatus[], - someDatasetVersionHasBeenReleased: boolean - ) { - const labels: DatasetLabel[] = [] - if (publicationStatuses.includes(PublicationStatus.Draft)) { - labels.push(new DatasetLabel(DatasetLabelSemanticMeaning.DATASET, DatasetLabelValue.DRAFT)) - } - if (!someDatasetVersionHasBeenReleased) { - labels.push( - new DatasetLabel(DatasetLabelSemanticMeaning.WARNING, DatasetLabelValue.UNPUBLISHED) - ) - } - return labels - } - static formatBytesToCompactNumber(bytes: number): string { const byteValueNumberFormatter = Intl.NumberFormat(undefined, { notation: 'compact', diff --git a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardInfo.tsx b/src/sections/collection/collection-items-panel/items-list/file-card/FileCardInfo.tsx deleted file mode 100644 index ea4c5da66..000000000 --- a/src/sections/collection/collection-items-panel/items-list/file-card/FileCardInfo.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import { Stack } from '@iqss/dataverse-design-system' -import { PublicationStatus } from '@/shared/core/domain/models/PublicationStatus' -import { FileItemTypePreview } from '@/files/domain/models/FileItemTypePreview' -import { DateHelper } from '@/shared/helpers/DateHelper' -import { FileCardHelper } from './FileCardHelper' -import { Route } from '@/sections/Route.enum' -import { DvObjectType } from '@/shared/hierarchy/domain/models/UpwardHierarchyNode' -import { LinkToPage } from '@/sections/shared/link-to-page/LinkToPage' -import { FileLabels } from '@/sections/file/file-labels/FileLabels' -import { CopyToClipboardButton } from '@/sections/dataset/dataset-files/files-table/file-info/file-info-cell/file-info-data/copy-to-clipboard-button/CopyToClipboardButton' -import styles from './FileCard.module.scss' - -interface FileCardInfoProps { - filePreview: FileItemTypePreview -} - -export function FileCardInfo({ filePreview }: FileCardInfoProps) { - const bytesFormatted = FileCardHelper.formatBytesToCompactNumber(filePreview.sizeInBytes) - const variables = filePreview.variables || 0 - const observations = filePreview.observations || 0 - - return ( -
    - -
    - - - {filePreview.datasetName} - -
    - -
    - {filePreview.fileType} - {`- ${bytesFormatted}`} - {filePreview.fileType === 'Tab-Delimited' && ( - {`- ${variables} variables, ${observations} observations`} - )} - {filePreview.checksum && ( - - {`- ${filePreview.checksum.type}:`} - - - )} -
    -
    - -
    - {filePreview.description &&

    {filePreview.description}

    } -     -
    - ) -} diff --git a/src/sections/file/file-labels/FileLabels.tsx b/src/sections/file/file-labels/FileLabels.tsx index 403671774..b6894d877 100644 --- a/src/sections/file/file-labels/FileLabels.tsx +++ b/src/sections/file/file-labels/FileLabels.tsx @@ -9,7 +9,7 @@ const VARIANT_BY_LABEL_TYPE: Record = { export function FileLabels({ labels }: { labels: FileLabel[] }) { return ( -
    +
    {labels.map((label, index) => ( {label.value} diff --git a/src/stories/collection/collection-items-panel/CollectionCard.stories.tsx b/src/stories/collection/collection-items-panel/CollectionCard.stories.tsx index e50285374..c3975d4f6 100644 --- a/src/stories/collection/collection-items-panel/CollectionCard.stories.tsx +++ b/src/stories/collection/collection-items-panel/CollectionCard.stories.tsx @@ -25,6 +25,7 @@ export const Default: Story = { export const WithLongDescription: Story = { render: () => { const collectionPreview = CollectionItemTypePreviewMother.create({ + name: 'Scientific Research Collection', description: FakerHelper.paragraph(20) }) return ( diff --git a/src/stories/collection/collection-items-panel/DatasetCard.stories.tsx b/src/stories/collection/collection-items-panel/DatasetCard.stories.tsx index 4edb1f002..ccf92b4ae 100644 --- a/src/stories/collection/collection-items-panel/DatasetCard.stories.tsx +++ b/src/stories/collection/collection-items-panel/DatasetCard.stories.tsx @@ -16,10 +16,24 @@ export const Default: Story = { render: () => } +export const Published: Story = { + render: () => +} + +export const DraftAndUnpublished: Story = { + render: () => ( + + ) +} + export const Deaccessioned: Story = { render: () => } +export const InReview: Story = { + render: () => +} + export const WithThumbnail: Story = { render: () => } diff --git a/tests/component/collection/domain/models/CollectionItemTypePreviewMother.ts b/tests/component/collection/domain/models/CollectionItemTypePreviewMother.ts index 73fd9ff2c..a54079217 100644 --- a/tests/component/collection/domain/models/CollectionItemTypePreviewMother.ts +++ b/tests/component/collection/domain/models/CollectionItemTypePreviewMother.ts @@ -75,6 +75,7 @@ export class CollectionItemTypePreviewMother { } static createUnpublished(): CollectionItemTypePreview { return CollectionItemTypePreviewMother.createWithOnlyRequiredFields({ + name: 'Scientific Research Collection', isReleased: false, affiliation: FakerHelper.affiliation() }) @@ -93,6 +94,7 @@ export class CollectionItemTypePreviewMother { static createWithThumbnail(): CollectionItemTypePreview { return CollectionItemTypePreviewMother.create({ + name: 'Scientific Research Collection', thumbnail: FakerHelper.getImageUrl() }) } diff --git a/tests/component/dataset/domain/models/DatasetItemTypePreviewMother.ts b/tests/component/dataset/domain/models/DatasetItemTypePreviewMother.ts index 0acb5b741..9b523dce0 100644 --- a/tests/component/dataset/domain/models/DatasetItemTypePreviewMother.ts +++ b/tests/component/dataset/domain/models/DatasetItemTypePreviewMother.ts @@ -57,7 +57,16 @@ export class DatasetItemTypePreviewMother { static createDraft(): DatasetItemTypePreview { return this.create({ version: DatasetVersionMother.createDraft(), - publicationStatuses: [PublicationStatus.Draft] + publicationStatuses: [PublicationStatus.Draft], + thumbnail: undefined + }) + } + + static createDraftAndUnpublished(): DatasetItemTypePreview { + return this.create({ + version: DatasetVersionMother.createNotReleased(), + publicationStatuses: [PublicationStatus.Unpublished, PublicationStatus.Draft], + thumbnail: undefined }) } @@ -71,7 +80,16 @@ export class DatasetItemTypePreviewMother { static createDeaccessioned(): DatasetItemTypePreview { return this.create({ - version: DatasetVersionMother.createDeaccessioned() + version: DatasetVersionMother.createDeaccessioned(), + publicationStatuses: [PublicationStatus.Deaccessioned] + }) + } + + static createInReview(): DatasetItemTypePreview { + return this.create({ + version: DatasetVersionMother.createDraft(), + publicationStatuses: [PublicationStatus.Draft, PublicationStatus.InReview], + thumbnail: undefined }) } } diff --git a/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCard.spec.tsx b/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCard.spec.tsx index c10dd9741..4fd60fe41 100644 --- a/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCard.spec.tsx +++ b/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCard.spec.tsx @@ -1,6 +1,8 @@ +import { Route } from '@/sections/Route.enum' import { DatasetCard } from '@/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard' import { DatasetItemTypePreviewMother } from '@tests/component/dataset/domain/models/DatasetItemTypePreviewMother' import { DateHelper } from '@/shared/helpers/DateHelper' +import styles from '@/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.module.scss' describe('DatasetCard', () => { it('should render the card', () => { @@ -14,6 +16,7 @@ describe('DatasetCard', () => { cy.findByText(DateHelper.toDisplayFormat(dataset.releaseOrCreateDate)).should('exist') cy.findByText(/Admin, Dataverse, 2023, "Dataset Title",/).should('exist') }) + it('should render the card with user roles', () => { const userRoles = ['Admin', 'Contributor'] const dataset = DatasetItemTypePreviewMother.create({ userRoles: userRoles }) @@ -29,4 +32,56 @@ describe('DatasetCard', () => { cy.findByText(role).should('exist') }) }) + + it('should render the dataset info correctly', () => { + const dataset = DatasetItemTypePreviewMother.createDraft() + cy.customMount() + + cy.findByText(DateHelper.toDisplayFormat(dataset.releaseOrCreateDate)).should('exist') + cy.findByText(/Admin, Dataverse, 2023, "Dataset Title",/) + .should('exist') + .parent() + .parent() + .should('have.class', styles['citation-box']) + cy.findByText(dataset.description).should('exist') + }) + + it('should render the citation with the deaccessioned background if the dataset is deaccessioned', () => { + const dataset = DatasetItemTypePreviewMother.createDeaccessioned() + cy.customMount() + + cy.findByText(/Admin, Dataverse, 2023, "Dataset Title",/) + .should('exist') + .parent() + .parent() + .should('have.class', styles['deaccesioned']) + }) + + describe('Parent Collection Link', () => { + it('should render it if parentCollectionAlias is not the one where the dataset card is being shown', () => { + const dataset = DatasetItemTypePreviewMother.create({ + parentCollectionAlias: 'parent-collection-alias', + parentCollectionName: 'Parent Collection Name' + }) + cy.customMount( + + ) + + cy.findByText('Parent Collection Name') + .should('exist') + .should('have.attr', 'href', `${Route.COLLECTIONS_BASE}/parent-collection-alias`) + }) + + it('should not render it if parentCollectionAlias is the same as the one where the dataset card is being shown', () => { + const dataset = DatasetItemTypePreviewMother.create({ + parentCollectionAlias: 'parent-collection-alias', + parentCollectionName: 'Parent Collection Name' + }) + cy.customMount( + + ) + + cy.findByText('Parent Collection Name').should('not.exist') + }) + }) }) diff --git a/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardHeader.spec.tsx b/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardHeader.spec.tsx index f649c6a6d..5bc17f397 100644 --- a/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardHeader.spec.tsx +++ b/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardHeader.spec.tsx @@ -1,11 +1,16 @@ import { DatasetCardHeader } from '@/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardHeader' +import { PublicationStatus } from '@/shared/core/domain/models/PublicationStatus' import { DatasetItemTypePreviewMother } from '@tests/component/dataset/domain/models/DatasetItemTypePreviewMother' describe('DatasetCardHeader', () => { it('should render the header', () => { const dataset = DatasetItemTypePreviewMother.create() cy.customMount( - + ) cy.findByText(dataset.version.title) @@ -18,19 +23,60 @@ describe('DatasetCardHeader', () => { }&version=${dataset.version.number.toString()}` ) - dataset.version.labels.forEach((label) => { - cy.findByText(label.value).should('exist') - }) cy.findByLabelText('icon-dataset').should('exist') }) it('should render the correct search param for draft version', () => { const dataset = DatasetItemTypePreviewMother.createDraft() cy.customMount( - + ) cy.findByText(dataset.version.title) .should('exist') .should('have.attr', 'href', `/datasets?persistentId=${dataset.persistentId}&version=DRAFT`) }) + + it('should sort the publication statuses by name', () => { + const dataset = DatasetItemTypePreviewMother.create({ + publicationStatuses: [ + PublicationStatus.Unpublished, + PublicationStatus.Draft, + PublicationStatus.InReview + ] + }) + cy.customMount( + + ) + + cy.findAllByText(PublicationStatus.Draft).should('exist') + cy.findAllByText(PublicationStatus.InReview).should('exist') + cy.findAllByText(PublicationStatus.Unpublished).should('exist') + + cy.get('.badge').then((badges) => { + expect(badges[0].textContent).to.equal(PublicationStatus.Draft) + expect(badges[1].textContent).to.equal(PublicationStatus.InReview) + expect(badges[2].textContent).to.equal(PublicationStatus.Unpublished) + }) + }) + + it('should filter out and dont render the Published status badge', () => { + const dataset = DatasetItemTypePreviewMother.create() + cy.customMount( + + ) + + cy.findByText(PublicationStatus.Published).should('not.exist') + }) }) diff --git a/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardInfo.spec.tsx b/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardInfo.spec.tsx deleted file mode 100644 index 9ef0f054f..000000000 --- a/tests/component/sections/collection/collection-items-panel/dataset-card/DatasetCardInfo.spec.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { DatasetCardInfo } from '@/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCardInfo' -import { DatasetItemTypePreviewMother } from '../../../../dataset/domain/models/DatasetItemTypePreviewMother' -import { DateHelper } from '@/shared/helpers/DateHelper' -import styles from '@/sections/collection/collection-items-panel/items-list/dataset-card/DatasetCard.module.scss' - -describe('DatasetCardInfo', () => { - it('should render the dataset info', () => { - const dataset = DatasetItemTypePreviewMother.createDraft() - cy.customMount( - - ) - - cy.findByText(DateHelper.toDisplayFormat(dataset.releaseOrCreateDate)).should('exist') - cy.findByText(/Admin, Dataverse, 2023, "Dataset Title",/) - .should('exist') - .parent() - .parent() - .should('have.class', styles['citation-box']) - cy.findByText(dataset.description).should('exist') - }) - - it('should render the citation with the deaccessioned background if the dataset is deaccessioned', () => { - const dataset = DatasetItemTypePreviewMother.createDeaccessioned() - cy.customMount( - - ) - - cy.findByText(/Admin, Dataverse, 2023, "Dataset Title",/) - .should('exist') - .parent() - .parent() - .should('have.class', styles['deaccesioned']) - }) -}) diff --git a/tests/component/sections/collection/collection-items-panel/file-card/FileCard.spec.tsx b/tests/component/sections/collection/collection-items-panel/file-card/FileCard.spec.tsx index 7ab9b3c30..0d4259211 100644 --- a/tests/component/sections/collection/collection-items-panel/file-card/FileCard.spec.tsx +++ b/tests/component/sections/collection/collection-items-panel/file-card/FileCard.spec.tsx @@ -67,4 +67,22 @@ describe('FileCard', () => { .should('have.attr', 'href') .and('include', 'version=DRAFT') }) + + it('should not show any tag if the file has no tags', () => { + const filePreview = FileItemTypePreviewMother.create({ tags: [] }) + cy.customMount() + + cy.findByTestId('file-labels').children().should('have.length', 0) + }) + + it('should default to 0 variables and 0 observations if file is tabular and they are not present', () => { + const filePreview = FileItemTypePreviewMother.create({ + fileType: 'Tab-Delimited', + variables: undefined, + observations: undefined + }) + cy.customMount() + + cy.contains('0 variables, 0 observations').should('exist') + }) })