diff --git a/CHANGELOG b/CHANGELOG
index 86763357..89076029 100644
--- a/CHANGELOG
+++ b/CHANGELOG
@@ -5,7 +5,16 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-### Hotfix
+## [1.3.2] 2024-10-7
+
+### Fixed
+
+- Adjust ItemTable styles according to design (SCC-4299)
+- Remove border and padding from eResources link as part of post-Bib page launch VQA (SCC-4299)
+- Remove base url from finding aid urls (SCC-4306)
+- Fix incorrect subject heading urls in Bib Details (SCC-4305)
+
+### [1.3.1] Hotfix
- Fix Table column widths on Search Results after DS 3.4.0 update (SCC-4299)
diff --git a/package.json b/package.json
index 549a11cf..ff371263 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "research-catalog",
- "version": "1.2.1",
+ "version": "1.3.2",
"scripts": {
"dev": "next dev -p 8080",
"build": "next build",
diff --git a/src/components/BibPage/BibDetail.tsx b/src/components/BibPage/BibDetail.tsx
index c331eacb..a8606b8b 100644
--- a/src/components/BibPage/BibDetail.tsx
+++ b/src/components/BibPage/BibDetail.tsx
@@ -7,7 +7,7 @@ import RCLink from "../Links/RCLink/RCLink"
import ExternalLink from "../Links/ExternalLink/ExternalLink"
import type {
BibDetail,
- Url,
+ BibDetailURL,
LinkedBibDetail,
SubjectHeadingDetail,
AnyBibDetail,
@@ -77,7 +77,7 @@ const PlainTextElement = (field: BibDetail) => {
const CompoundSubjectHeadingElement = (field: SubjectHeadingDetail) => {
const subjectHeadingLinksPerSubject = field.value.map(
- (subjectHeadingUrls: Url[]) => {
+ (subjectHeadingUrls: BibDetailURL[]) => {
return SingleSubjectHeadingElement(subjectHeadingUrls)
}
)
@@ -89,27 +89,30 @@ const CompoundSubjectHeadingElement = (field: SubjectHeadingDetail) => {
return DetailElement(field.label, values)
}
-const SingleSubjectHeadingElement = (subjectHeadingUrls: Url[]) => {
- return subjectHeadingUrls.reduce((linksPerSubject, url: Url, index) => {
- const divider = (
- // this span will render as > in between the divided subject heading links
-
- {" "}
- >{" "}
-
- )
- const link = LinkElement(url, "internal")
- linksPerSubject.push(link)
- if (!isItTheLastElement(index, subjectHeadingUrls)) {
- linksPerSubject.push(divider)
- }
- return linksPerSubject
- }, [] as ReactElement[])
+const SingleSubjectHeadingElement = (subjectHeadingUrls: BibDetailURL[]) => {
+ return subjectHeadingUrls.reduce(
+ (linksPerSubject, url: BibDetailURL, index) => {
+ const divider = (
+ // this span will render as > in between the divided subject heading links
+
+ {" "}
+ >{" "}
+
+ )
+ const link = LinkElement(url, "internal")
+ linksPerSubject.push(link)
+ if (!isItTheLastElement(index, subjectHeadingUrls)) {
+ linksPerSubject.push(divider)
+ }
+ return linksPerSubject
+ },
+ [] as ReactElement[]
+ )
}
const LinkedDetailElement = (field: LinkedBibDetail) => {
const internalOrExternal = field.link
- const values = field.value.map((urlInfo: Url, i) => {
+ const values = field.value.map((urlInfo: BibDetailURL, i) => {
return (
{LinkElement(urlInfo, internalOrExternal)}
@@ -119,7 +122,7 @@ const LinkedDetailElement = (field: LinkedBibDetail) => {
return DetailElement(field.label, values)
}
-const LinkElement = (url: Url, linkType: string) => {
+const LinkElement = (url: BibDetailURL, linkType: string) => {
let Link: typeof RCLink | typeof ExternalLink
if (linkType === "internal") Link = RCLink
else if (linkType === "external") Link = ExternalLink
@@ -127,9 +130,10 @@ const LinkElement = (url: Url, linkType: string) => {
return (
{url.urlLabel}
diff --git a/src/components/ItemTable/ItemTable.tsx b/src/components/ItemTable/ItemTable.tsx
index b0f1eae4..ff179613 100644
--- a/src/components/ItemTable/ItemTable.tsx
+++ b/src/components/ItemTable/ItemTable.tsx
@@ -1,8 +1,4 @@
-import {
- Box,
- Table,
- useNYPLBreakpoints,
-} from "@nypl/design-system-react-components"
+import { Box, Table } from "@nypl/design-system-react-components"
import type ItemTableData from "../../models/ItemTableData"
import StatusLinks from "./StatusLinks"
@@ -17,7 +13,6 @@ interface ItemTableProps {
*/
const ItemTable = ({ itemTableData }: ItemTableProps) => {
const { tableHeadings, tableData, items, inSearchResult } = itemTableData
- const { isLargerThanMobile } = useNYPLBreakpoints()
return (
// Display as grid to prevent bug where the outer container stretches to the Table's width on mobile
@@ -27,26 +22,26 @@ const ItemTable = ({ itemTableData }: ItemTableProps) => {
inSearchResult ? " " + styles.inSearchResult : ""
}`}
columnHeaders={tableHeadings}
- // TODO: Review these values with the design team
+ tableTextSize="body2"
columnStyles={
inSearchResult
? [
- { width: "33.3%", minWidth: 150, maxWidth: 250 },
- { width: "33.3%", minWidth: 150, maxWidth: 250 },
- { width: "33.3%", minWidth: 150, maxWidth: 250 },
+ { width: 272, minWidth: 85 },
+ { width: 272, minWidth: 85 },
+ { width: 272, minWidth: 85 },
]
: [
- { minWidth: 350, maxwidth: 350 },
- { minwidth: 150, maxWidth: 200 },
- { minwidth: 150, maxWidth: 150 },
- { minwidth: 150, maxWidth: 150 },
- { minwidth: 200, maxWidth: 250 },
- { minwidth: 150, maxWidth: 200 },
+ { width: "auto", minWidth: 250 },
+ { width: "14%", minWidth: 100 },
+ { width: "14%", minWidth: 100 },
+ { width: "14%", minWidth: 100 },
+ { width: "14%", minWidth: 100 },
+ { width: "14%", minWidth: 100 },
]
}
tableData={tableData}
showRowDividers={!inSearchResult}
- isScrollable={!isLargerThanMobile}
+ isScrollable={true}
my={{ base: inSearchResult ? "s" : 0, md: "s" }}
data-testid={
!inSearchResult
diff --git a/src/components/SearchResults/ElectronicResourcesLink.tsx b/src/components/SearchResults/ElectronicResourcesLink.tsx
index e9971445..2e9f508b 100644
--- a/src/components/SearchResults/ElectronicResourcesLink.tsx
+++ b/src/components/SearchResults/ElectronicResourcesLink.tsx
@@ -17,14 +17,7 @@ const ElectronicResourcesLink = ({
electronicResources,
}: ElectronicResourcesLinkProps) => {
return (
-
+
{
{bib.materialType && {bib.materialType}}
{bib.publicationStatement && {bib.publicationStatement}}
diff --git a/src/models/BibDetails.ts b/src/models/BibDetails.ts
index 8c4975d9..6d5cb15a 100644
--- a/src/models/BibDetails.ts
+++ b/src/models/BibDetails.ts
@@ -4,7 +4,7 @@ import type {
BibDetail,
FieldMapping,
AnnotatedMarcField,
- Url,
+ BibDetailURL,
SubjectHeadingDetail,
AnnotatedMarc,
AnyBibDetail,
@@ -207,7 +207,10 @@ export default class BibDetails {
}
}
- buildExternalLinkedDetail(label: string, values: Url[]): LinkedBibDetail {
+ buildExternalLinkedDetail(
+ label: string,
+ values: BibDetailURL[]
+ ): LinkedBibDetail {
if (!values.length) return null
return {
link: "external",
@@ -365,32 +368,16 @@ export default class BibDetails {
buildSubjectHeadings(): SubjectHeadingDetail {
if (!this.bib.subjectHeadings) return
- const subjectHeadingsUrls = this.bib.subjectHeadings.map(
- ({ label, uuid }) => {
- if (!label || !uuid) return
- const subject = label.replace(/\.$/, "")
- // stackedSubjectHeadings: ["a", "a -- b", "a -- b -- c"]
- const stackedSubjectHeadings =
- this.constructSubjectHeadingsArray(subject)
- const shepUrl = `/subject_headings/${uuid}`
- // splitSubjectHeadings: ["a", "b", "c"]
- const splitSubjectHeadings = subject.split(" -- ")
+ const subjectHeadingsUrls = this.bib.subjectHeadings.map((heading) =>
+ this.flattenSubjectHeadingUrls(heading)
+ )
- return splitSubjectHeadings.map((heading, index) => {
- const urlWithLabelParam = `${shepUrl}?label=${encodeURI(
- stackedSubjectHeadings[index]
- )}`
- return {
- url: urlWithLabelParam,
- urlLabel: heading,
- }
- })
+ return (
+ subjectHeadingsUrls?.length && {
+ label: "Subject",
+ value: subjectHeadingsUrls,
}
)
- return {
- label: "Subject",
- value: subjectHeadingsUrls,
- }
}
buildSubjectLiterals(): SubjectHeadingDetail {
@@ -400,7 +387,7 @@ export default class BibDetails {
subject = subject.replace(/\.$/, "")
// stackedSubjectHeadings: ["a", "a -- b", "a -- b -- c"]
const stackedSubjectHeadings =
- this.constructSubjectHeadingsArray(subject)
+ this.constructSubjectLiteralsArray(subject)
const filterQueryForSubjectHeading = "/search?filters[subjectLiteral]="
// splitSubjectHeadings: ["a", "b", "c"]
const splitSubjectHeadings = subject.split(" -- ")
@@ -421,9 +408,9 @@ export default class BibDetails {
}
}
- constructSubjectHeadingsArray(subject: string) {
+ constructSubjectLiteralsArray(subject: string) {
// subject = "Italian food -- Spaghetti"
- let stackedSubjectHeading = ""
+ let stackedSubjectLiteral = ""
return subject
.split(" -- ") // ["Italian food", "spaghetti"]
@@ -431,9 +418,39 @@ export default class BibDetails {
const dashDivided = index !== 0 ? " -- " : ""
// First iteration "Italian food"
// Second iteration "Italian food -- spaghetti"
- stackedSubjectHeading = `${stackedSubjectHeading}${dashDivided}${urlString}`
+ stackedSubjectLiteral = `${stackedSubjectLiteral}${dashDivided}${urlString}`
- return stackedSubjectHeading
+ return stackedSubjectLiteral
})
}
+
+ /**
+ * Flatten subject headings into a list of objects with a url and a label
+ */
+ flattenSubjectHeadingUrls(heading): BibDetailURL[] | null {
+ if (!heading.label || !heading.uuid) return null
+ const subjectHeadingsArray = []
+
+ // iterate through each nested subject until there's no parent element
+ let currentHeading = heading
+
+ while (currentHeading.parent) {
+ subjectHeadingsArray.unshift(
+ this.getSubjectHeadingUrl(currentHeading.uuid, currentHeading.label)
+ )
+ currentHeading = currentHeading.parent
+ }
+ // add the top level subject heading
+ subjectHeadingsArray.unshift(
+ this.getSubjectHeadingUrl(currentHeading.uuid, currentHeading.label)
+ )
+ return subjectHeadingsArray
+ }
+
+ getSubjectHeadingUrl(uuid: string, label: string): BibDetailURL {
+ return {
+ url: `/subject_headings/${uuid}?label=${encodeURIComponent(label)}`,
+ urlLabel: label.split(" -- ").pop(),
+ }
+ }
}
diff --git a/src/models/modelTests/BibDetails.test.ts b/src/models/modelTests/BibDetails.test.ts
index 69fe697c..773426c8 100644
--- a/src/models/modelTests/BibDetails.test.ts
+++ b/src/models/modelTests/BibDetails.test.ts
@@ -63,25 +63,25 @@ describe("Bib model", () => {
value: [
[
{
- url: "/subject_headings/74746d11-638b-4cfb-a72a-9a2bd296e6fd?label=Cortanze,%20G%C3%A9rard%20de",
+ url: "/subject_headings/cf347108-e1f2-4c0f-808a-ac4ace2f0765?label=Cortanze%2C%20G%C3%A9rard%20de",
urlLabel: "Cortanze, GĂ©rard de",
},
{
- url: "/subject_headings/74746d11-638b-4cfb-a72a-9a2bd296e6fd?label=Cortanze,%20G%C3%A9rard%20de%20--%20Childhood%20and%20youth",
+ url: "/subject_headings/74746d11-638b-4cfb-a72a-9a2bd296e6fd?label=Cortanze%2C%20G%C3%A9rard%20de%20--%20Childhood%20and%20youth",
urlLabel: "Childhood and youth",
},
],
[
{
- url: "/subject_headings/9391bc26-e44c-44ac-98cc-e3800da51926?label=Authors,%20French",
+ url: "/subject_headings/5fd065df-b4e9-48cb-b13c-ea15f36b96b4?label=Authors%2C%20French",
urlLabel: "Authors, French",
},
{
- url: "/subject_headings/9391bc26-e44c-44ac-98cc-e3800da51926?label=Authors,%20French%20--%2020th%20century",
+ url: "/subject_headings/e43674a7-5f02-44f1-95cd-dbcc776331b7?label=Authors%2C%20French%20--%2020th%20century",
urlLabel: "20th century",
},
{
- url: "/subject_headings/9391bc26-e44c-44ac-98cc-e3800da51926?label=Authors,%20French%20--%2020th%20century%20--%20Biography",
+ url: "/subject_headings/9391bc26-e44c-44ac-98cc-e3800da51926?label=Authors%2C%20French%20--%2020th%20century%20--%20Biography",
urlLabel: "Biography",
},
],
diff --git a/src/types/bibDetailsTypes.ts b/src/types/bibDetailsTypes.ts
index f4898b1f..ed7453e8 100644
--- a/src/types/bibDetailsTypes.ts
+++ b/src/types/bibDetailsTypes.ts
@@ -1,7 +1,7 @@
export type AnyBibDetail = BibDetail | LinkedBibDetail | SubjectHeadingDetail
export interface SubjectHeadingDetail {
- value: Url[][]
+ value: BibDetailURL[][]
label: string
}
@@ -13,7 +13,7 @@ export interface BibDetail {
}
export interface LinkedBibDetail {
- value: Url[]
+ value: BibDetailURL[]
// label is the formatted name of the field, such as "Author"
label: string
// indicates if a linked bib detail is internal, like a link to a creator
@@ -21,7 +21,7 @@ export interface LinkedBibDetail {
link?: "internal" | "external"
}
-export interface Url {
+export interface BibDetailURL {
url: string
urlLabel: string
}
diff --git a/styles/components/ItemTable.module.scss b/styles/components/ItemTable.module.scss
index 1f7512e2..57ec2a77 100644
--- a/styles/components/ItemTable.module.scss
+++ b/styles/components/ItemTable.module.scss
@@ -13,9 +13,9 @@
padding-right: 0;
}
- td {
- font-size: var(--nypl-fontSizes-desktop-body-body2);
- line-height: var(--nypl-lineHeights-body-body2);
+ th {
+ padding-top: 0;
+ padding-bottom: var(--nypl-space-xxs);
}
span {
@@ -24,17 +24,16 @@
}
&.inSearchResult {
+ margin-top: 0;
+
tr {
border: 0 !important;
- th {
- padding-top: 0;
- padding-bottom: var(--nypl-space-xxs);
- }
-
- td {
+ th,
+ td,
+ th:first-of-type,
+ td:first-of-type {
padding-top: 0;
- padding-bottom: 0;
}
}
}