Merge pull request #317 from nulib/deploy/staging

Production push
nulib · Mar 13, 2024 · 9a401b4 · 9a401b4
2 parents 9a42df8 + 08484c7
commit 9a401b4
Show file tree

Hide file tree

Showing 20 changed files with 1,697 additions and 918 deletions.
diff --git a/.github/workflows/run-tests.yml b/.github/workflows/run-tests.yml
@@ -0,0 +1,32 @@
+name: Run Unit Tests
+
+on:
+  push:
+    branches:
+      - "**" # This will run the action on push to any branch
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    env:
+      NEXT_PUBLIC_DCAPI_ENDPOINT: "https://dcapi.rdc-staging.library.northwestern.edu/api/v2"
+      NEXT_PUBLIC_DC_URL: "https://dc-next.rdc-staging.library.northwestern.edu"
+
+    steps:
+      - name: Cancel Previous Runs
+        uses: styfle/[email protected]
+
+      - name: Get files
+        uses: actions/checkout@v3
+
+      - name: Setup NodeJS
+        uses: actions/setup-node@v3
+        with:
+          node-version: "lts/*"
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests
+        run: npm run test:ci
diff --git a/.prettierrc.json b/.prettierrc.json
diff --git a/.vscode/settings.json b/.vscode/settings.json
diff --git a/components/Clover/ViewerWrapper.tsx b/components/Clover/ViewerWrapper.tsx
@@ -2,12 +2,15 @@ import {
   AnnouncementContent,
   ViewerWrapperStyled,
 } from "@/components/Clover/ViewerWrapper.styled";
+import type {
+  CloverViewerProps,
+  ViewerConfigOptions,
+} from "@samvera/clover-iiif";
 
 import Announcement from "@/components/Shared/Announcement";
 import { IconInfo } from "@/components/Shared/SVG/Icons";
 import React from "react";
 import { UserContext } from "@/context/user-context";
-import type { ViewerConfigOptions } from "@samvera/clover-iiif";
 import type { Work } from "@nulib/dcapi-types";
 import dynamic from "next/dynamic";
 
@@ -67,7 +70,7 @@ const WorkViewerWrapper: React.FC<WrapperProps> = ({
     withCredentials: true,
   };
 
-  const options = {
+  const options: CloverViewerProps["options"] = {
     ...defaultOptions,
     ...viewerOptions,
   };

diff --git a/components/Facets/WorkType/WorkType.tsx b/components/Facets/WorkType/WorkType.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { FACETS_WORK_TYPE } from "@/lib/constants/facets-model";
 import RadioGroup from "./RadioGroup";
-import { WorkType } from "@nulib/dcapi-types";
+import { type WorkType } from "@nulib/dcapi-types";
 import useQueryParams from "@/hooks/useQueryParams";
 import { useRouter } from "next/router";
 

diff --git a/components/Figure/Figure.tsx b/components/Figure/Figure.tsx
@@ -11,6 +11,7 @@ import {
   FigureVariants,
 } from "@/components/Figure/Figure.styled";
 import React, { ReactNode } from "react";
+
 import { IconLock } from "@/components/Shared/SVG/Icons";
 import { width } from "@/styles/media";
 
@@ -33,6 +34,8 @@ const Figure: React.FC<FigureProps & FigureVariants> = (props) => {
   const { data, orientation } = props;
   const { aspectRatio, isRestricted, title, supplementalInfo, src } = data;
 
+  if (!src) return null;
+
   const handleOnLoad = () => setIsLoaded(true);
   const handleOnError = () => console.error("image loading error");
 

diff --git a/components/layout.tsx b/components/layout.tsx
@@ -2,31 +2,36 @@ import "swiper/css";
 import "swiper/css/effect-fade";
 import "swiper/css/navigation";
 import "swiper/css/pagination";
+
 import Footer from "@/components/Footer/Footer";
 import Head from "next/head";
 import Header from "@/components/Header/Header";
 import React from "react";
+import { defaultOpenGraphData } from "@/lib/open-graph";
 import { styled } from "@/stitches.config";
 
-export const siteTitle = "Digital Collections v2";
-
 const MainStyled = styled("main", {
   minHeight: "300px",
 });
 
 interface LayoutProps {
   children: React.ReactNode;
+  description?: string;
   header?: "default" | "hero";
   title?: string;
 }
 
 const Layout: React.FC<LayoutProps> = ({
   children,
+  description = defaultOpenGraphData["og:description"],
   header = "default",
-  title = "Digital Collections - Northwestern University Libraries",
+  title
 }) => {
   const [isLoaded, setIsLoaded] = React.useState(false);
 
+  const titleTagText = `${title ? `${title} - ` : ''}${defaultOpenGraphData["og:site_name"]}`;
+  const metaDescriptionContent = description;
+
   React.useEffect(() => {
     setIsLoaded(true);
   }, []);
@@ -37,15 +42,12 @@ const Layout: React.FC<LayoutProps> = ({
     <>
       <Head>
         <link rel="icon" href="/favicon.ico" />
-        <meta name="description" content="NUL Digital Collections v2" />
-        <title>{title}</title>
+        <meta name="description" content={metaDescriptionContent} />
+        <title>{titleTagText}</title>
       </Head>
       <Header isHero={header === "hero"} />
       <MainStyled>{children}</MainStyled>
       <Footer />
-
-      {/* De-activated temporarily */}
-      {/* <Message /> */}
     </>
   );
 };

diff --git a/lib/constants/head-meta.ts b/lib/constants/head-meta.ts
@@ -0,0 +1,18 @@
+export const HEAD_META = {
+  ABOUT: {
+    description:
+      "Learn more about the Northwestern University Libraries Digital Collections and its contents.",
+    title: "About",
+  },
+  COLLECTIONS: {
+    title: "All Collections",
+  },
+  CONTACT: {
+    description:
+      "Contact the Northwestern University Libraries Digital Collections team.",
+    title: "Contact",
+  },
+  SEARCH: {
+    title: "Search",
+  },
+};
diff --git a/lib/open-graph.test.ts b/lib/open-graph.test.ts
@@ -1,20 +1,20 @@
 import * as og from "@/lib/open-graph";
+
 import { sampleWork1 } from "@/mocks/sample-work1";
 
 describe("open-graph.ts helper file", () => {
   it("should return openGraphData for a Work", () => {
     const response = og.buildWorkOpenGraphData(sampleWork1);
+
     expect(response).toMatchObject({
       "og:description":
         "Ima description - The images on this web site are from material in the collections of the University Archives of Northwestern University Libraries, are provided for use by its students, faculty and staff, and by other researchers visiting this site, for research consultation and scholarly purposes only. Further distribution and/or any commercial use of the images from this site is not permitted.",
       "og:image":
         "https://iiif.stack.rdc-staging.library.northwestern.edu/iiif/2/93d75ffe-20d8-48ea-9206-8db9114f2731/full/1200,630/0/default.jpg",
       "og:image:secure_url":
         "https://iiif.stack.rdc-staging.library.northwestern.edu/iiif/2/93d75ffe-20d8-48ea-9206-8db9114f2731/full/1200,630/0/default.jpg",
-      "og:site_name":
-        "Hawking dental products in outdoor market, Cuernavaca, Mexico - Digital Collections - Libraries - Northwestern University",
       "og:title":
-        "Hawking dental products in outdoor market, Cuernavaca, Mexico - Digital Collections - Libraries - Northwestern University",
+        "Hawking dental products in outdoor market, Cuernavaca, Mexico",
       "og:type": "website",
       "og:url":
         "https://digitalcollections.library.northwestern.edu/items/c16029ff-d027-496a-98b7-6f259395a8f7",

diff --git a/lib/open-graph.ts b/lib/open-graph.ts
@@ -12,12 +12,20 @@ export const defaultOpenGraphData: OpenGraphData = {
     "Explore digital resources from the Northwestern University Library collections – including letters, photographs, diaries, maps, and audiovisual materials - as well as licensed art historical images for teaching and reference.",
   "og:image": defaultOpenGraphImage,
   "og:image:secure_url": defaultOpenGraphImage,
-  "og:site_name": "Digital Collections - Libraries - Northwestern University",
-  "og:title": "Digital Collections - Libraries - Northwestern University",
+  "og:site_name": "Digital Collections - Northwestern University Libraries",
+  "og:title": "Digital Collections - Northwestern University Libraries",
   "og:type": "website",
   "og:url": PRODUCTION_URL,
 };
 
+export function buildWorkDescription(work: Work | null) {
+  let ogDescription = "";
+  if (work?.description && work.description.length > 0) {
+    ogDescription = `${work.description.join(" ")}`;
+  }
+  return ogDescription;
+}
+
 export function buildWorkOpenGraphData(
   work: Work | null
 ): ObjectLiteral | OpenGraphData {
@@ -32,12 +40,9 @@ export function buildWorkOpenGraphData(
         : ""
       : work?.thumbnail;
 
-  let ogDescription = "";
-  if (work?.description && work.description.length > 0) {
-    ogDescription = `${work.description.join(" ")} - `;
-  }
+  let ogDescription = buildWorkDescription(work);
   if (work?.terms_of_use) {
-    ogDescription += work?.terms_of_use;
+    ogDescription += ` - ${work?.terms_of_use}`;
   }
 
   const openGraphData = !work
@@ -48,8 +53,7 @@ export function buildWorkOpenGraphData(
         ...(isPublic && { "og:image:height": "630" }),
         "og:image:secure_url": imageUrl,
         ...(isPublic && { "og:image:width": "1200" }),
-        "og:site_name": `${ogTitle} - Digital Collections - Libraries - Northwestern University`,
-        "og:title": `${ogTitle} - Digital Collections - Libraries - Northwestern University`,
+        "og:title": `${ogTitle}`,
         "og:type": "website",
         "og:url": `${PRODUCTION_URL}/items/${work.id}`,
       };