Stubbed out authoring list and book view components

src/components/nodes/cards/sup-book/sup-book-card.tsx

@@ -17,17 +17,11 @@ const SupBookCard = ({node, headingLevel, ...props}: Props) => {
       aria-labelledby={node.id}
       isArticle
     >
-
-      <div className="flex flex-col">
-        <Heading className="text-m2 order-last [&_a]:text-black [&_a]:hocus:text-digital-red" id={node.id}>
-          <Link href={node.path}>
-            {node.title}
-          </Link>
-        </Heading>
-        <div className="font-bold order-first">
-          Publication
-        </div>
-      </div>
+      <Heading className="text-m2 order-last [&_a]:text-black [&_a]:hocus:text-digital-red" id={node.id}>
+        <Link href={node.path}>
+          {node.title}
+        </Link>
+      </Heading>
     </ImageCard>
   )
 }

src/components/paragraphs/stanford-lists/list-paragraph.tsx

@@ -6,7 +6,7 @@ import {cache, ElementType, HtmlHTMLAttributes} from "react";
 import {
   Maybe,
   NodeStanfordCourse, NodeStanfordEvent, NodeStanfordNews,
-  NodeStanfordPage, NodeStanfordPerson, NodeStanfordPublication,
+  NodeStanfordPage, NodeStanfordPerson, NodeStanfordPublication, NodeSupBook,
   NodeUnion,
   ParagraphStanfordList
 } from "@lib/gql/__generated__/drupal.d";
@@ -125,6 +125,10 @@ const getViewPagedItems = cache(async (viewId: string, displayId: string, contex
     case "stanford_publications--chicago_list":
       tags.push("views:stanford_publication");
       break
+
+    case "sup_books--book_list":
+      tags.push("views:sup_book");
+      break
   }
 
   const headers = await buildHeaders();
@@ -182,6 +186,12 @@ const getViewPagedItems = cache(async (viewId: string, displayId: string, contex
         items = graphqlResponse.stanfordSharedTags?.results as unknown as NodeUnion[]
         break
 
+      case "sup_books--book_list":
+        filters = getViewFilters(["term_node_taxonomy_name_depth", "sup_book_work_id_number_value"], contextualFilter)
+        graphqlResponse = await client.supBooks({filters, ...queryVariables});
+        items = graphqlResponse.supBooksView?.results as unknown as NodeSupBook[]
+        break
+
       default:
         console.warn(`Unable to find query for view: ${viewId} display: ${displayId}`)
         break;

src/components/paragraphs/sup-pre-built/pre-built-author-list.tsx

@@ -0,0 +1,13 @@
+import {HTMLAttributes} from "react";
+
+type Props = HTMLAttributes<HTMLDivElement>;
+
+const PreBuiltAuthorList = async ({...props}: Props) => {
+  // Fetch all the books, sort by authors, and then build pagination and side alpha selection.
+  return (
+    <div {...props}>
+      Authoring list
+    </div>
+  )
+}
+export default PreBuiltAuthorList;

src/components/paragraphs/sup-pre-built/pre-built-paragraph.tsx

@@ -1,6 +1,7 @@
 import {HtmlHTMLAttributes} from "react";
 import {ParagraphSupPreBuilt} from "@lib/gql/__generated__/drupal.d";
 import PrebuiltSearchForm from "@components/paragraphs/sup-pre-built/pre-built-search-form";
+import PreBuiltAuthorList from "@components/paragraphs/sup-pre-built/pre-built-author-list";
 
 type Props = HtmlHTMLAttributes<HTMLDivElement> & {
   paragraph: ParagraphSupPreBuilt
@@ -10,6 +11,9 @@ const PreBuiltParagraph = ({paragraph, ...props}: Props) => {
   switch (paragraph.supPrebuiltComponent) {
     case "search_form":
       return <PrebuiltSearchForm {...props}/>
+    case "book_author_list":
+      return <PreBuiltAuthorList {...props}/>
   }
+  console.warn(`Unknown prebuilt component ${paragraph.supPrebuiltComponent}`)
 }
 export default PreBuiltParagraph

src/components/views/sup-books/book-list-view.tsx

@@ -0,0 +1,26 @@
+import {NodeSupBook} from "@lib/gql/__generated__/drupal";
+import PagedList from "@components/elements/paged-list";
+import SupBookCard from "@components/nodes/cards/sup-book/sup-book-card";
+
+type Props = {
+  /**
+   * List of nodes to display.
+   */
+  items: NodeSupBook[]
+  /**
+   * If those nodes titles should display as <h2> or <h3>
+   */
+  headingLevel?: "h2" | "h3"
+}
+
+const BookListView = ({items, headingLevel}: Props) => {
+  return (
+    <PagedList ulProps={{className: "list-unstyled grid grid-cols-3 gap-10"}} itemsPerPage={20}>
+      {items.map(item =>
+        <SupBookCard key={item.id} node={item} headingLevel={headingLevel}/>
+      )}
+    </PagedList>
+  )
+}
+
+export default BookListView;

src/components/views/view.tsx

@@ -16,9 +16,10 @@ import {
   NodeStanfordNews,
   NodeStanfordPage,
   NodeStanfordPerson,
-  NodeStanfordPublication,
+  NodeStanfordPublication, NodeSupBook,
   NodeUnion
 } from "@lib/gql/__generated__/drupal.d";
+import BookListView from "@components/views/sup-books/book-list-view";
 
 interface Props {
   /**
@@ -115,6 +116,12 @@ const View = async ({viewId, displayId, items, headingLevel = "h3"}: Props) => {
         items={items as NodeStanfordPublication[]}
         headingLevel={headingLevel}
       />
+
+    case "sup_books--book_list":
+      return <BookListView
+        items={items as NodeSupBook[]}
+        headingLevel={headingLevel}
+      />
   }
 }
 export default View;

src/lib/gql/view-queries.drupal.gql

@@ -147,3 +147,14 @@ query stanfordSharedTags($filters: StanfordSharedTagsContextualFilterInput, $pag
         }
     }
 }
+
+query supBooks($filters: SupBooksViewContextualFilterInput, $pageSize: Int = 3, $page: Int $offset: Int) {
+    supBooksView(contextualFilter: $filters, pageSize: $pageSize, page: $page, offset: $offset) {
+        results {
+            ...FragmentNodeSupBookTeaser
+        }
+        pageInfo {
+            ...FragmentViewPageInfo
+        }
+    }
+}