SFR-2200: Update license page to copyright

CHANGELOG.md

@@ -1,5 +1,9 @@
 # CHANGE LOG
 
+## [Prerelease]
+
+- Update License page to Copyright and add section for "In Copyright" explanation
+
 ## [0.18.3]
 
 - Fix error when collections are empty

playwright/support/mappings.ts

@@ -27,8 +27,8 @@ export const pages: { [name: string]: Pages } = {
   about: {
     route: "/about",
   },
-  license: {
-    route: "/license",
+  copyright: {
+    route: "/copyright",
   },
   "read online": {
     route: "/read/4440666",
@@ -117,7 +117,7 @@ export const elements = {
   "item featured edition year": "a:has-text('Edition') >> nth=0",
   "item featured edition publisher": "div:text('Published by') >> nth=0",
   "item featured edition language": "div:text('Languages') >> nth=0",
-  "item featured edition license": "[href='/license'] >> nth=0",
+  "item featured edition license": "[href='/copyright'] >> nth=0",
   "item details heading": "#details-list-heading",
   "item details authors heading": "dt:text('Authors')",
   "item details authors": "dd > a[href*='display=author'] >> nth=0",

src/__tests__/Search.test.tsx

@@ -367,7 +367,7 @@ describe("Renders Search Results Page", () => {
       test("Shows license with links", () => {
         expect(
           screen.getByText("License: Public Domain").closest("a").href
-        ).toContain("/license");
+        ).toContain("/copyright");
       });
       test("Shows cover", () => {
         expect(
@@ -416,7 +416,7 @@ describe("Renders Search Results Page", () => {
       test("Shows Unknown license with links", () => {
         expect(
           screen.getByText("License: Unknown").closest("a").href
-        ).toContain("/license");
+        ).toContain("/copyright");
       });
       test("Shows Placeholder cover", () => {
         expect(
@@ -486,7 +486,7 @@ describe("Renders Search Results Page", () => {
               "License: Public Domain Public Domain Public Domain Public Domain Public Domain Public Domain Public Domain Public Domain Public Domain"
             )
             .closest("a").href
-        ).toContain("/license");
+        ).toContain("/copyright");
       });
       test("Shows cover", () => {
         expect(

src/components/About/About.tsx

@@ -39,10 +39,10 @@ const About: React.FC = () => {
         All the materials in Digital Research Books Beta are completely free to
         read and most of them you can download and keep, with no library card
         required. The books are either in the{" "}
-        <Link to="/license">public domain</Link>, with no restrictions on your
+        <Link to="/copyright">public domain</Link>, with no restrictions on your
         use of them, or under{" "}
-        <Link to="/license">Creative Commons licences</Link> that may have some
-        conditions, but only on redistribution or adaptation.
+        <Link to="/copyright">Creative Commons licences</Link> that may have
+        some conditions, but only on redistribution or adaptation.
       </p>
 
       <p>

src/components/About/__snapshots__/About.test.tsx.snap

@@ -142,15 +142,15 @@ exports[`renders about unchanged 1`] = `
 
         <a
           class="chakra-link css-qsaw8"
-          href="/license"
+          href="/copyright"
         >
           public domain
         </a>
         , with no restrictions on your use of them, or under
 
         <a
           class="chakra-link css-qsaw8"
-          href="/license"
+          href="/copyright"
         >
           Creative Commons licences
         </a>

src/components/Collection/Collection.test.tsx

@@ -100,7 +100,7 @@ describe("Renders Collection Page", () => {
     test("Shows license with links", () => {
       expect(
         screen.getByText("License: Public Domain").closest("a").href
-      ).toContain("/license");
+      ).toContain("/copyright");
     });
   });
 });

src/components/CollectionItemCard/CollectionItemCard.test.tsx

@@ -30,7 +30,7 @@ describe("Collection Item Card", () => {
   });
   test("shows license", () => {
     expect(screen.getByText("License: Unknown").closest("a").href).toContain(
-      "/license"
+      "/copyright"
     );
   });
 });

src/components/CollectionItemCard/LicenseLink.tsx

@@ -4,7 +4,7 @@ import Link from "~/src/components/Link/Link";
 
 const LicenseLink: React.FC<{ rights: Rights }> = ({ rights }) => {
   return (
-    <Link to="/license">
+    <Link to="/copyright">
       {rights ? `License: ${rights.rightsStatement}` : "License: Unknown"}
     </Link>
   );

src/components/Copyright/Copyright.test.tsx

@@ -0,0 +1,77 @@
+import React from "react";
+import { render } from "~/src/__tests__/testUtils/render";
+import { screen } from "@testing-library/react";
+import Copyright from "./Copyright";
+
+it("renders Copyright page unchanged", async () => {
+  const tree = render(<Copyright />);
+  expect(tree.container.firstChild).toMatchSnapshot();
+});
+
+describe("Copyright Page", () => {
+  beforeEach(() => {
+    render(<Copyright />);
+  });
+
+  it("renders the Copyright Explanations heading", () => {
+    expect(
+      screen.getByRole("heading", { name: "Copyright Explanations" })
+    ).toBeInTheDocument();
+  });
+
+  it("renders the Public Domain headings", () => {
+    expect(
+      screen.getByRole("heading", { name: "Public Domain" })
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("heading", { name: "Public Domain (US Only)" })
+    ).toBeInTheDocument();
+  });
+
+  it("renders the Creative Commons section", () => {
+    expect(
+      screen.getByRole("heading", { name: "Creative Commons Licenses" })
+    ).toBeInTheDocument();
+
+    expect(
+      screen.getByRole("link", { name: "Creative Commons licenses" })
+    ).toHaveAttribute("href", "https://creativecommons.org/");
+
+    expect(
+      screen.getByRole("link", { name: "Attribution 3.0 Unported (CC BY 3.0)" })
+    ).toHaveAttribute("href", "https://creativecommons.org/licenses/by/3.0/");
+  });
+
+  it("renders the CC0 section", () => {
+    expect(
+      screen.getByRole("heading", { name: "CC0 Public Domain Dedication" })
+    ).toBeInTheDocument();
+
+    expect(
+      screen.getByRole("link", {
+        name: "CC0 1.0 Universal (CC0 1.0) Public Domain Dedication",
+      })
+    ).toHaveAttribute(
+      "href",
+      "https://creativecommons.org/publicdomain/zero/1.0/"
+    );
+  });
+
+  it("renders the GNU section", () => {
+    expect(
+      screen.getByRole("heading", { name: "GNU General Public License" })
+    ).toBeInTheDocument();
+
+    expect(
+      screen.getByRole("link", {
+        name: "GNU General Public License",
+      })
+    ).toHaveAttribute("href", "http://www.gnu.org/licenses/gpl.html");
+  });
+
+  it("renders the In Copyright heading", () => {
+    expect(
+      screen.getByRole("heading", { name: "In Copyright" })
+    ).toBeInTheDocument();
+  });
+});

src/components/License/License.tsx → src/components/Copyright/Copyright.tsx

@@ -8,13 +8,13 @@ import {
 import Link from "../Link/Link";
 import DrbBreakout from "../DrbBreakout/DrbBreakout";
 
-const License: React.FC = () => {
+const Copyright: React.FC = () => {
   const breakoutElement = (
-    <DrbBreakout breadcrumbsData={[{ url: "/license", text: "License" }]} />
+    <DrbBreakout breadcrumbsData={[{ url: "/copyright", text: "Copyright" }]} />
   );
   const contentPrimaryElement = (
     <>
-      <Heading level="h1">License Explanations</Heading>
+      <Heading level="h1">Copyright Explanations</Heading>
       <Heading level="h2">Public Domain</Heading>
       <p>
         Works in the public domain have no copyright (in most cases because the
@@ -159,6 +159,13 @@ const License: React.FC = () => {
         , you may copy, distribute and modify the work as long as any
         modifications are also made available under the GPL.
       </p>
+      <Heading level="h2">In Copyright</Heading>
+      <p>
+        Works that are In Copyright are protected by copyright and/or related
+        rights. You are free to use this Item in any way that is permitted by
+        the copyright and related rights legislation that applies to your use.
+        For other uses you need to obtain permission from the rights-holder(s).
+      </p>
     </>
   );
   return (
@@ -169,4 +176,4 @@ const License: React.FC = () => {
   );
 };
 
-export default License;
+export default Copyright;

src/components/License/__snapshots__/License.test.tsx.snap → src/components/Copyright/__snapshots__/Copyright.test.tsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`renders License page unchanged 1`] = `
+exports[`renders Copyright page unchanged 1`] = `
 <div
   class="css-1u8qly9"
 >
@@ -101,12 +101,12 @@ exports[`renders License page unchanged 1`] = `
             <a
               aria-current="page"
               class="chakra-breadcrumb__link css-0"
-              href="/license"
+              href="/copyright"
             >
               <span
                 class="breadcrumb-label"
               >
-                License
+                Copyright
               </span>
             </a>
           </li>
@@ -124,7 +124,7 @@ exports[`renders License page unchanged 1`] = `
       <h1
         class="chakra-heading css-1xdhyk6"
       >
-        License Explanations
+        Copyright Explanations
       </h1>
       <h2
         class="chakra-heading css-1xdhyk6"
@@ -316,6 +316,14 @@ exports[`renders License page unchanged 1`] = `
         </a>
         , you may copy, distribute and modify the work as long as any modifications are also made available under the GPL.
       </p>
+      <h2
+        class="chakra-heading css-1xdhyk6"
+      >
+        In Copyright
+      </h2>
+      <p>
+        Works that are In Copyright are protected by copyright and/or related rights. You are free to use this Item in any way that is permitted by the copyright and related rights legislation that applies to your use. For other uses you need to obtain permission from the rights-holder(s).
+      </p>
     </div>
   </main>
 </div>

src/components/EditionCard/EditionCard.test.tsx

@@ -37,7 +37,7 @@ describe("Edition Card with Valid Data", () => {
   test("Shows license with links", () => {
     expect(
       screen.getByText("License: test rights statement").closest("a").href
-    ).toContain("/license");
+    ).toContain("/copyright");
   });
   test("Shows cover", () => {
     expect(
@@ -80,7 +80,7 @@ describe("Edition Year with Minimal Data", () => {
   });
   test("Shows Unknown license with links", () => {
     expect(screen.getByText("License: Unknown").closest("a").href).toContain(
-      "/license"
+      "/copyright"
     );
   });
   test("Shows Placeholder cover", () => {

src/components/EditionCard/EditionCard.tsx

@@ -19,6 +19,7 @@ import FeaturedEditionBadge from "./FeaturedEditionBadge";
 import PhysicalEditionBadge from "./PhysicalEditionBadge";
 import ScanAndDeliverBlurb from "./ScanAndDeliverBlurb";
 import UpBlurb from "./UpBlurb";
+import LicenseLink from "./LicenseLink";
 
 export const EditionCard: React.FC<{
   edition: WorkEdition;
@@ -114,9 +115,7 @@ export const EditionCard: React.FC<{
               publishers={edition.publishers}
             />
             <LanguageDisplayText edition={edition} />
-            <Link to="/license">
-              {EditionCardUtils.getLicense(previewItem)}
-            </Link>
+            <LicenseLink rights={previewItem?.rights} />
           </Box>
           {isPhysicalEdition && <ScanAndDeliverBlurb />}
           {isUniversityPress && <UpBlurb publishers={edition.publishers} />}

src/components/EditionCard/LicenseLink.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+import { Rights } from "~/src/types/DataModel";
+import Link from "~/src/components/Link/Link";
+
+const LicenseLink: React.FC<{ rights: Rights[] }> = ({ rights }) => {
+  return (
+    <Link to="/copyright">
+      {rights && rights.length > 0
+        ? `License: ${rights[0].rightsStatement}`
+        : "License: Unknown"}
+    </Link>
+  );
+};
+
+export default LicenseLink;

src/components/EditionDetail/Edition.test.tsx

@@ -75,7 +75,7 @@ describe("Renders edition component when given valid edition", () => {
       screen
         .getAllByText("License: Public Domain when viewed in the US")[0]
         .closest("a").href
-    ).toContain("/license");
+    ).toContain("/copyright");
   });
 
   test("Featured Card, which has publisher 'Miller', shows up once", () => {

src/components/InstanceCard/InstanceCard.test.tsx

@@ -41,7 +41,7 @@ describe("Instance Card with Valid Data", () => {
   test("shows license", () => {
     expect(
       screen.getByText("License: test rights statement").closest("a").href
-    ).toContain("/license");
+    ).toContain("/copyright");
   });
 });
 
@@ -75,7 +75,7 @@ describe("Instance Card with Minmal Data", () => {
   });
   test("shows license", () => {
     expect(screen.getByText("License: Unknown").closest("a").href).toContain(
-      "/license"
+      "/copyright"
     );
   });
 });

src/components/InstanceCard/InstanceCard.tsx

@@ -10,7 +10,6 @@ import {
   Flex,
 } from "@nypl/design-system-react-components";
 import EditionCardUtils from "~/src/util/EditionCardUtils";
-import Link from "../Link/Link";
 import Ctas from "../EditionCard/Ctas";
 import PublisherAndLocation from "../EditionCard/PublisherAndLocation";
 import WorldCat from "./WorldCat";
@@ -19,6 +18,7 @@ import FeaturedEditionBadge from "../EditionCard/FeaturedEditionBadge";
 import PhysicalEditionBadge from "../EditionCard/PhysicalEditionBadge";
 import ScanAndDeliverBlurb from "../EditionCard/ScanAndDeliverBlurb";
 import UpBlurb from "../EditionCard/UpBlurb";
+import LicenseLink from "../EditionCard/LicenseLink";
 
 // Creates an Instance card out of the Edition Year and Instance object
 // Note: Edition Year only needs to be passed because `instance.publication_date`
@@ -94,7 +94,7 @@ export const InstanceCard: React.FC<{
             />
           </div>
           <WorldCat instance={instance} />
-          <Link to="/license">{EditionCardUtils.getLicense(previewItem)}</Link>
+          <LicenseLink rights={previewItem?.rights} />
           {isPhysicalEdition && <ScanAndDeliverBlurb />}
           {isUniversityPress && <UpBlurb publishers={edition.publishers} />}
         </CardContent>