From a63fe9756b40bbc7c2db99aa06bf3b4de26dc022 Mon Sep 17 00:00:00 2001 From: Mike Decker Date: Thu, 9 May 2024 13:16:43 -0700 Subject: [PATCH] Styled the search results, the carousel and added an award winner views --- app/search/page.tsx | 6 +- package.json | 2 +- .../algolia-search/algolia-search-form.tsx | 154 +++++------- .../algolia-search/hits/default.tsx | 69 ++++++ .../algolia-search/hits/sup-book.tsx | 62 +++++ src/components/elements/select-list.tsx | 6 +- src/components/elements/slideshow.tsx | 14 +- src/components/global/page-header.tsx | 2 +- src/components/images/header-logo-lg.tsx | 56 +++-- src/components/menu/main-menu.tsx | 25 +- src/components/menu/side-nav.tsx | 12 +- .../stanford-lists/list-paragraph.tsx | 9 +- .../page-title-banner-paragraph.tsx | 13 +- .../sup-carousel/sup-carousel-paragraph.tsx | 152 +++++++++--- .../views/sup-books/book-list-view.tsx | 13 +- src/components/views/view.tsx | 1 + src/lib/gql/__generated__/drupal.d.ts | 73 +++++- src/lib/gql/__generated__/queries.ts | 29 ++- src/lib/gql/fragments-paragraph.drupal.gql | 7 +- src/lib/gql/view-queries.drupal.gql | 12 + src/lib/hooks/usePageHasTopBanner.tsx | 18 ++ tailwind.config.js | 8 +- yarn.lock | 231 +++++++++++++++++- 23 files changed, 762 insertions(+), 212 deletions(-) rename app/search/algolia-search.tsx => src/components/algolia-search/algolia-search-form.tsx (75%) create mode 100644 src/components/algolia-search/hits/default.tsx create mode 100644 src/components/algolia-search/hits/sup-book.tsx create mode 100644 src/lib/hooks/usePageHasTopBanner.tsx diff --git a/app/search/page.tsx b/app/search/page.tsx index 6e0b5ccc..543e952f 100644 --- a/app/search/page.tsx +++ b/app/search/page.tsx @@ -1,8 +1,8 @@ import {H1} from "@components/elements/headers"; import {getConfigPage} from "@lib/gql/gql-queries"; import {StanfordBasicSiteSetting} from "@lib/gql/__generated__/drupal.d"; -import AlgoliaSearch from "./algolia-search"; import {IndexUiState} from "instantsearch.js/es/types/ui-state"; +import AlgoliaSearchForm from "@components/algolia-search/algolia-search-form"; // https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config export const revalidate = false; @@ -34,12 +34,12 @@ const Page = async ({searchParams}: { searchParams?: { [_key: string]: string } return (
-
+

Search

{(siteSettingsConfig?.suSiteAlgoliaId && siteSettingsConfig?.suSiteAlgoliaIndex && siteSettingsConfig?.suSiteAlgoliaSearch) && <> - { +const AlgoliaSearchForm = ({appId, searchIndex, searchApiKey, initialUiState = {}}: Props) => { const searchClient = useMemo(() => algoliasearch(appId, searchApiKey), [appId, searchApiKey]) return (
@@ -33,13 +33,13 @@ const AlgoliaSearch = ({appId, searchIndex, searchApiKey, initialUiState = {}}: initialUiState={{[searchIndex]: initialUiState}} future={{preserveSharedStateOnUnmount: true}} > - +
) } -const SearchForm = ({searchIndex}: { searchIndex: string }) => { +const Form = ({searchIndex}: { searchIndex: string }) => { const router = useRouter() const searchParams = useSearchParams(); @@ -111,7 +111,7 @@ const SearchForm = ({searchIndex}: { searchIndex: string }) => { {
-
-

Filter by

+
+

+ Filter by +

+ {currentRefinements.filter(refinement => refinement.attribute === "book_subject").length > 0 &&
    {currentRefinements.filter(refinement => refinement.attribute === "book_subject").map(refinement => { return refinement.refinements.map((item, i) =>
  • {item.value}
-
- -
+
+