Skip to content

Commit

Permalink
new fields
Browse files Browse the repository at this point in the history
  • Loading branch information
raffazizzi committed Nov 5, 2024
1 parent 475deb1 commit 504f3a9
Show file tree
Hide file tree
Showing 4 changed files with 147 additions and 74 deletions.
7 changes: 7 additions & 0 deletions gatsby-config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,13 @@ const config: GatsbyConfig = {
queryName: `ScdFacets`,
separateNodeType: true
},
{
baseId,
tableName: `Metadata Dictionary NEW`,
tableView: `SCD Fields - Public Portal (Revised)`,
queryName: `ScdFields`,
separateNodeType: true
},
]
}
}
Expand Down
47 changes: 29 additions & 18 deletions gatsby-node.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,43 +23,54 @@ async function makeCollectionPages({createPage, graphql}: IMakePages) {
data {
collection_id
scd_publish_status
collection_holder_name
record_type
collection_content_category
collection_title
collection_description
extent
collectionFormats
collection_holder_category
collection_holder_name
collection_holder_city
collection_holder_state
collection_holder_country
content_types
dates
extent
historical_relevance
subjects
creators
physical_formats
access_statement
finding_aid_url
collection_holder_country
collection_holder_state
collection_holder_city
collection_catalog_url
inventory_description
supporting_documentation
languages
collection_notes
collection_usage_statement
website_url
record_type
collection_holder_category
collection_content_category
physical_formats
creators
subjects
inventory_description
}
}
}
allAirtableScdFields {
nodes {
data {
Fields
scd_field_label_revised
}
}
}
}
`)

const {nodes} = (results.data as Queries.qCollectionsQuery).allAirtableScdItems;
const r = results.data as Queries.qCollectionsQuery;
const {nodes} = r.allAirtableScdItems;
const fields = r.allAirtableScdFields.nodes;

for (const node of nodes) {
const collection = node.data
createPage({
path: `/collections/${collection?.collection_id}/`,
component: path.resolve(`./src/templates/collection.tsx`),
context: {
...collection
collection: {...collection},
fields
}
})
}
Expand Down
62 changes: 36 additions & 26 deletions src/pages/search.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,59 +8,61 @@ import FacetAccordion from "../components/FacetAccordion"

interface ResultProps {
results: Queries.qSearchPageQuery["allAirtableScdItems"]["nodes"]
fieldLabels: Queries.qSearchPageQuery["allAirtableScdFields"]["nodes"]
start: number
}

type PerPageValues = 10 | 20 | 50 | 100
type SortValues = "asc" | "desc"

const Results = ({results, start}: ResultProps) => (
<section className="px-0 mx-5">
const Results = ({results, fieldLabels, start}: ResultProps) => {
const getLabel = (label: string) => {
const f = fieldLabels.find(field => field.data!.Fields!.replace(/-/g, "_") === label)
if (f) {
return f.data!.scd_field_label_revised
}
return label
}

return (<section className="px-0 mx-5">
{results.map((r, i) => {
const d = r.data!
d.finding_aid_url
const faURL = d.finding_aid_url && d.finding_aid_url?.startsWith("http") ? d.finding_aid_url : `http://${d.finding_aid_url}`
const ctypes = d.content_types || []
return <article className="border-b border-dotted border-slate-300 mb-7 pt-4" key={d.collection_id}>
<h3 className="text-xl leading-5 mb-5 font-medium">
{start + i}. <Link to={`/collections/${d.collection_id}`} className="text-rose-800 hover:underline">{d.collection_title}</Link>
</h3>
<table className="mb-8 border-separate border-spacing-2">
<tbody>
{d.collection_description && <tr>
<td className="text-slate-500 text-right align-text-top">Description:</td>
<td className="text-slate-500 text-right align-text-top">{getLabel('collection_description')}:</td>
<td>{d.collection_description}</td>
</tr>}
{d.scd_publish_status !== "collection-owner-title-description-only" && <>
{ctypes.length > 0 &&
<tr>
<td className="text-slate-500 text-right align-text-top">Content type{ctypes.length > 1 ? 's': ''}:</td>
<td>{ctypes.join("; ")}</td>
</tr>
}
{d.collectionFormats && <tr>
<td className="text-slate-500 text-right align-text-top">Format:</td>
<td>{d.collectionFormats}</td>
{d.physical_formats && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel('physical_formats')}:</td>
<td>{d.physical_formats}</td>
</tr>}
{d.extent && <tr>
<td className="text-slate-500 text-right align-text-top">Extent:</td>
<td className="text-slate-500 text-right align-text-top">{getLabel('extent')}:</td>
<td>{d.extent}</td>
</tr>}
{d.finding_aid_url && <tr>
<td className="text-slate-500 text-right align-text-top">Online finding aid:</td>
<td className="text-slate-500 text-right align-text-top">{getLabel('finding_aid_url')}:</td>
<td><a className="underline break-all" href={faURL}>View on {new URL(faURL).hostname}</a></td>
</tr>}
</>}
<tr>
<td className="text-slate-500 text-right align-text-top">Repository/Collector:</td>
<td className="text-slate-500 text-right align-text-top">{getLabel('collection_holder_name')}:</td>
<td>{d.collection_holder_name}</td>
</tr>
</tbody>
</table>
</article>})
}
</section>
)
</section>)
}

interface Facet {
cat: string, val: string
Expand All @@ -79,9 +81,10 @@ const SearchPage: React.FC<PageProps> = ({data}) => {
const [facets, setFacets] = React.useState<Facet[]>([]);

const facetsFromAirTable = (data as Queries.qSearchPageQuery).allAirtableScdFacets.nodes || []
const fieldsFromAirTable = (data as Queries.qSearchPageQuery).allAirtableScdFields.nodes || []

const facetData = facetsFromAirTable.map(f =>
[f.data!.scd_field_label_revised, f.data!.Fields!.replace('-', '_')] as [string, string]
[f.data!.scd_field_label_revised, f.data!.Fields!.replace(/-/g, '_')] as [string, string]
)

const facetFields = new Map<string, string>(facetData)
Expand Down Expand Up @@ -314,7 +317,7 @@ const SearchPage: React.FC<PageProps> = ({data}) => {
]} />
</div>
</div>
<Results results={paginatedResults} start={startIndex + 1}/>
<Results results={paginatedResults} fieldLabels={fieldsFromAirTable} start={startIndex + 1}/>
<Pagination count={totalPages} page={currentPage} onChange={handlePageChange}/>
</div>
</div>
Expand All @@ -334,19 +337,18 @@ export const query = graphql`
data {
collection_id
scd_publish_status
collection_title
collection_description
collection_holder_name
collection_title
extent
collectionFormats
content_types
physical_formats
finding_aid_url
collection_holder_country
collection_holder_state
record_type
collection_holder_state
collection_holder_category
collection_content_category
physical_formats
content_types
creators
subjects
}
Expand All @@ -360,6 +362,14 @@ export const query = graphql`
}
}
}
allAirtableScdFields {
nodes {
data {
scd_field_label_revised
Fields
}
}
}
}
`

Expand Down
105 changes: 75 additions & 30 deletions src/templates/collection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,25 @@ import { Link, type HeadFC, type PageProps } from "gatsby"
import Layout from "../components/Layout"

const Collection: React.FC<PageProps> = ({pageContext}) => {
const data = pageContext as Queries.qCollectionsQuery["allAirtableScdItems"]["nodes"][0]["data"]
const d = data!
const faURL = d.collection_finding_aid_url && d.collection_finding_aid_url.startsWith("http") ? d.collection_finding_aid_url : `http://${d.collection_finding_aid_url}`
const context = pageContext as {
collection: Queries.qCollectionsQuery["allAirtableScdItems"]["nodes"][0]["data"]
fields: Queries.qCollectionsQuery["allAirtableScdFields"]["nodes"]
}

const getLabel = (label: string) => {
const f = context.fields.find(field => field.data!.Fields!.replace(/-/g, "_") === label)
if (f) {
return f.data!.scd_field_label_revised
}
return label
}

const d = context.collection!
const faURL = d.finding_aid_url && d.finding_aid_url.startsWith("http") ? d.finding_aid_url : `http://${d.finding_aid_url}`
const catURL = d.collection_catalog_url && d.collection_catalog_url.startsWith("http") ? d.collection_catalog_url : `http://${d.collection_catalog_url}`
const webURL = d.collection_website_url && d.collection_website_url.startsWith("http") ? d.collection_website_url : `http://${d.collection_website_url}`
const ctypes = d.content_types || []
const subjects = d.subjects || []
const formats = d.physical_formats || []
const langs = d.languages || []
const loc = []
d.collection_holder_city ? loc.push(d.collection_holder_city) : false;
Expand All @@ -27,47 +40,81 @@ const Collection: React.FC<PageProps> = ({pageContext}) => {
<table className="mb-8 border-separate border-spacing-2">
<tbody>
{d.collection_description && <tr>
<td className="text-slate-500 text-right align-text-top">Description:</td>
<td className="text-slate-500 text-right align-text-top">{getLabel("collection_description")}:</td>
<td>{d.collection_description}</td>
</tr>}
{ // additional fields for public entries.
d.scd_publish_status !== "collection-owner-title-description-only" && <>
{d.record_type && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("record_type")}:</td>
<td>{d.record_type}</td>
</tr>}
{ctypes.length > 0 &&
<tr>
<td className="text-slate-500 text-right align-text-top">Content type{ctypes.length > 1 ? 's': ''}:</td>
<td className="text-slate-500 text-right align-text-top">{getLabel("content_types")}:</td>
<td>{ctypes.join("; ")}</td>
</tr>
{d.collectionFormats && <tr>
<td className="text-slate-500 text-right align-text-top">Format:</td>
<td>{d.collectionFormats}</td>
}
{d.collection_content_category && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("collection_content_category")}:</td>
<td>{d.collection_content_category}</td>
</tr>}
{d.collection_extent && <tr>
<td className="text-slate-500 text-right align-text-top">Extent:</td>
<td>{d.collection_extent}</td>
{d.collection_holder_category && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("collection_holder_category")}:</td>
<td>{d.collection_holder_category}</td>
</tr>}
{langs.length > 0 &&
{d.extent && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("extent")}:</td>
<td>{d.extent}</td>
</tr>}
{d.dates && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("dates")}:</td>
<td>{d.dates}</td>
</tr>}
{d.historical_relevance && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("historical_relevance")}:</td>
<td>{d.historical_relevance}</td>
</tr>}
{subjects.length > 0 &&
<tr>
<td className="text-slate-500 text-right align-text-top">Language{langs.length > 1 ? 's': ''}:</td>
<td>{langs.join("; ")}</td>
<td className="text-slate-500 text-right align-text-top">{getLabel("subjects")}:</td>
<td>{subjects.join("; ")}</td>
</tr>
}
{d.collection_notes &&
{d.creators && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("creators")}:</td>
<td>{d.creators}</td>
</tr>}
{formats.length > 0 && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("physical_formats")}:</td>
<td>{formats}</td>
</tr>}
{langs.length > 0 &&
<tr>
<td className="text-slate-500 text-right align-text-top">Additional notes:</td>
<td>{d.collection_notes}</td>
<td className="text-slate-500 text-right align-text-top">{getLabel("languages")}:</td>
<td>{langs.join("; ")}</td>
</tr>
}
{d.collection_finding_aid_url && <tr>
<td className="text-slate-500 text-right align-text-top">Online finding aid:</td>
{d.finding_aid_url && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("finding_aid_url")}:</td>
<td><a className="underline break-all" href={faURL}>View on {new URL(faURL).hostname}</a></td>
</tr>}
{d.supporting_documentation &&
<tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("supporting_documentation")}:</td>
<td>{d.supporting_documentation}</td>
</tr>
}
{d.inventory_description &&
<tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("inventory_description")}:</td>
<td>{d.inventory_description}</td>
</tr>
}
{d.collection_catalog_url && <tr>
<td className="text-slate-500 text-right align-text-top">Online catalog:</td>
<td><a className="underline break-all" href={catURL}>View on {new URL(catURL).hostname}</a></td>
</tr>}
{d.collection_website_url && <tr>
<td className="text-slate-500 text-right align-text-top">Collection website:</td>
<td><a className="underline break-all" href={webURL}>View on {new URL(webURL).hostname}</a></td>
</tr>}
</>
}
<tr>
Expand All @@ -80,12 +127,10 @@ const Collection: React.FC<PageProps> = ({pageContext}) => {
<td className="text-slate-500 text-right align-text-top">Location:</td>
<td>{loc.join(", ")}</td>
</tr>
{d.collection_usage_statement &&
<tr>
<td className="text-slate-500 text-right align-text-top">Usage statement:</td>
<td>{d.collection_usage_statement}</td>
</tr>
}
{d.access_statement && <tr>
<td className="text-slate-500 text-right align-text-top">{getLabel("access_statement")}:</td>
<td>{d.access_statement}</td>
</tr>}
</>}
</tbody>
</table>
Expand Down

0 comments on commit 504f3a9

Please sign in to comment.