diff --git a/app/search/page.tsx b/app/search/page.tsx index 1a67665..dd0eeec 100644 --- a/app/search/page.tsx +++ b/app/search/page.tsx @@ -1,10 +1,10 @@ import {H1} from "@components/elements/headers" import {getAlgoliaCredential} from "@lib/gql/gql-queries" -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 +export const dynamic = "force-static" export const metadata = { title: "Search", @@ -15,25 +15,9 @@ export const metadata = { noarchive: true, }, } -const Page = async (props: {searchParams?: Promise<{[_key: string]: string}>}) => { - const searchParams = await props.searchParams +const Page = async () => { const [appId, indexName, apiKey] = await getAlgoliaCredential() - const initialState: IndexUiState = {refinementList: {book_type: ["book"]}} - if (searchParams?.q) initialState.query = searchParams.q - if (searchParams?.subjects && initialState.refinementList) { - initialState.refinementList.book_subject = searchParams.subjects.split(",") - } - - if (!!searchParams?.["only-books"] && initialState.refinementList) { - delete initialState.refinementList.book_type - } - if (searchParams?.["published-min"] || searchParams?.["published-max"]) { - initialState.range = { - book_published: (searchParams["published-min"] || "0") + ":" + (searchParams["published-max"] || "3000"), - } - } - return (
@@ -41,13 +25,8 @@ const Page = async (props: {searchParams?: Promise<{[_key: string]: string}>}) = Search our site - {appId && indexName && initialState && apiKey && ( - + {appId && indexName && apiKey && ( + )}
diff --git a/package.json b/package.json index 4170c0e..9ed702b 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "@next/third-parties": "15.1.4", "@tailwindcss/container-queries": "^0.1.1", "@types/node": "^22.10.5", - "@types/react": "^19.0.3", + "@types/react": "^19.0.4", "@types/react-dom": "19.0.2", "algoliasearch": "5.19.0", "autoprefixer": "^10.4.20", @@ -32,7 +32,7 @@ "graphql-tag": "^2.12.6", "html-entities": "^2.5.2", "html-react-parser": "^5.2.2", - "next": "^15.2.0-canary.0", + "next": "^15.2.0-canary.2", "plaiceholder": "^3.0.0", "postcss": "^8.4.49", "qs": "^6.13.1", @@ -46,7 +46,7 @@ "sharp": "^0.33.5", "tailwind-merge": "^2.6.0", "tailwindcss": "^3.4.17", - "typescript": "^5.7.2", + "typescript": "^5.7.3", "usehooks-ts": "^3.1.0" }, "devDependencies": { diff --git a/src/components/algolia-search/algolia-search-form.tsx b/src/components/algolia-search/algolia-search-form.tsx index 7ecf267..7201ac0 100644 --- a/src/components/algolia-search/algolia-search-form.tsx +++ b/src/components/algolia-search/algolia-search-form.tsx @@ -33,6 +33,7 @@ import {CheckIcon} from "@heroicons/react/20/solid" import clsx from "clsx" import {useBoolean} from "usehooks-ts" import {twMerge} from "tailwind-merge" +import {ArrowPathIcon} from "@heroicons/react/16/solid" type Props = { appId: string @@ -41,15 +42,48 @@ type Props = { initialUiState?: IndexUiState } -const AlgoliaSearchForm = ({appId, searchIndex, searchApiKey, initialUiState = {}}: Props) => { +const AlgoliaSearchForm = ({appId, searchIndex, searchApiKey}: Props) => { const searchClient = useMemo(() => liteClient(appId, searchApiKey), [appId, searchApiKey]) + const [initialState, setInitialState] = useState({refinementList: {book_type: ["book"]}}) + const initialRender = useRef(true) + + useEffect(() => { + // if (!initialRender) return + initialRender.current = false + + const searchParams = new URLSearchParams(window.location.search) + const newInitialState: IndexUiState = {refinementList: {book_type: ["book"]}} + + const query = searchParams.get("q") + const subjects = searchParams.get("subjects") + const onlyBooks = searchParams.get("only-books") + const minYear = searchParams.get("published-min") + const maxYear = searchParams.get("published-max") + + if (query) newInitialState.query = query + if (subjects && newInitialState.refinementList) { + newInitialState.refinementList.book_subject = subjects.split(",") + } + + if (onlyBooks == "false" && newInitialState.refinementList) { + delete newInitialState.refinementList.book_type + } + if (minYear || maxYear) { + newInitialState.range = { + book_published: (minYear || "0") + ":" + (maxYear || "3000"), + } + } + setInitialState(newInitialState) + }, []) + + if (initialRender.current) return return (
{/* @ts-expect-error React types don't match the library. */} @@ -62,7 +96,8 @@ const AlgoliaSearchForm = ({appId, searchIndex, searchApiKey, initialUiState = { const Form = ({searchIndex}: {searchIndex: string}) => { const router = useRouter() const searchParams = useSearchParams() - const {value: onlyBooks, setValue: setOnlyBooks} = useBoolean(true) + + const {items: bookType, refine: refineBookType} = useRefinementList({attribute: "book_type"}) const inputRef = useRef(null) const {query, refine} = useSearchBox({}) @@ -72,7 +107,7 @@ const Form = ({searchIndex}: {searchIndex: string}) => { attribute: "book_subject", limit: 100, }) - const {refine: refineBookType} = useRefinementList({attribute: "book_type"}) + const { start: pubYearRange, range: pubYearRangeBounds, @@ -228,11 +263,8 @@ const Form = ({searchIndex}: {searchIndex: string}) => { { - setOnlyBooks(!onlyBooks) - refineBookType("book") - }} + checked={bookType.find(item => item.value === "book")?.isRefined || false} + onChange={() => refineBookType("book")} />
@@ -465,7 +497,11 @@ const HitItem = ({ useLayoutEffect(() => { if (focus) { const reduceMotion = !!window.matchMedia("(prefers-reduced-motion: reduce)")?.matches - ref.current?.scrollIntoView({behavior: reduceMotion ? "instant" : "smooth", block: "end", inline: "nearest"}) + ref.current?.scrollIntoView({ + behavior: reduceMotion ? "instant" : "smooth", + block: "end", + inline: "nearest", + }) ref.current?.focus({preventScroll: true}) } }, [focus]) diff --git a/yarn.lock b/yarn.lock index 73d5bf9..92a7744 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3611,10 +3611,10 @@ __metadata: languageName: node linkType: hard -"@next/env@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/env@npm:15.2.0-canary.0" - checksum: 10c0/62ead2020114aa0bdfc551bd6d2db0e7ce07ce047692ec5d98c6e7e5b89bbebd94bd582049f954c03b3bc7ef0932ba38960a41d90ba129f3b2c786c8d1dcf6df +"@next/env@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/env@npm:15.2.0-canary.2" + checksum: 10c0/8c25a6de60cdccf689dd741cd7724b369498784e36dcde34b48e995e63b2817b2ccf6c5621e803f468a43dbd80fd727709f85e3769fcf5e201e4c2989e55d69d languageName: node linkType: hard @@ -3627,58 +3627,58 @@ __metadata: languageName: node linkType: hard -"@next/swc-darwin-arm64@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-darwin-arm64@npm:15.2.0-canary.0" +"@next/swc-darwin-arm64@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-darwin-arm64@npm:15.2.0-canary.2" conditions: os=darwin & cpu=arm64 languageName: node linkType: hard -"@next/swc-darwin-x64@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-darwin-x64@npm:15.2.0-canary.0" +"@next/swc-darwin-x64@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-darwin-x64@npm:15.2.0-canary.2" conditions: os=darwin & cpu=x64 languageName: node linkType: hard -"@next/swc-linux-arm64-gnu@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-linux-arm64-gnu@npm:15.2.0-canary.0" +"@next/swc-linux-arm64-gnu@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-linux-arm64-gnu@npm:15.2.0-canary.2" conditions: os=linux & cpu=arm64 & libc=glibc languageName: node linkType: hard -"@next/swc-linux-arm64-musl@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-linux-arm64-musl@npm:15.2.0-canary.0" +"@next/swc-linux-arm64-musl@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-linux-arm64-musl@npm:15.2.0-canary.2" conditions: os=linux & cpu=arm64 & libc=musl languageName: node linkType: hard -"@next/swc-linux-x64-gnu@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-linux-x64-gnu@npm:15.2.0-canary.0" +"@next/swc-linux-x64-gnu@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-linux-x64-gnu@npm:15.2.0-canary.2" conditions: os=linux & cpu=x64 & libc=glibc languageName: node linkType: hard -"@next/swc-linux-x64-musl@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-linux-x64-musl@npm:15.2.0-canary.0" +"@next/swc-linux-x64-musl@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-linux-x64-musl@npm:15.2.0-canary.2" conditions: os=linux & cpu=x64 & libc=musl languageName: node linkType: hard -"@next/swc-win32-arm64-msvc@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-win32-arm64-msvc@npm:15.2.0-canary.0" +"@next/swc-win32-arm64-msvc@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-win32-arm64-msvc@npm:15.2.0-canary.2" conditions: os=win32 & cpu=arm64 languageName: node linkType: hard -"@next/swc-win32-x64-msvc@npm:15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "@next/swc-win32-x64-msvc@npm:15.2.0-canary.0" +"@next/swc-win32-x64-msvc@npm:15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "@next/swc-win32-x64-msvc@npm:15.2.0-canary.2" conditions: os=win32 & cpu=x64 languageName: node linkType: hard @@ -8165,7 +8165,7 @@ __metadata: "@storybook/testing-library": "npm:^0.2.2" "@tailwindcss/container-queries": "npm:^0.1.1" "@types/node": "npm:^22.10.5" - "@types/react": "npm:^19.0.3" + "@types/react": "npm:^19.0.4" "@types/react-dom": "npm:19.0.2" "@types/react-slick": "npm:^0.23.13" algoliasearch: "npm:5.19.0" @@ -8185,7 +8185,7 @@ __metadata: graphql-tag: "npm:^2.12.6" html-entities: "npm:^2.5.2" html-react-parser: "npm:^5.2.2" - next: "npm:^15.2.0-canary.0" + next: "npm:^15.2.0-canary.2" plaiceholder: "npm:^3.0.0" postcss: "npm:^8.4.49" prettier: "npm:^3.4.2" @@ -8205,7 +8205,7 @@ __metadata: tailwind-merge: "npm:^2.6.0" tailwindcss: "npm:^3.4.17" tsconfig-paths-webpack-plugin: "npm:^4.2.0" - typescript: "npm:^5.7.2" + typescript: "npm:^5.7.3" typescript-eslint: "npm:8.19.1" usehooks-ts: "npm:^3.1.0" languageName: unknown @@ -12022,19 +12022,19 @@ __metadata: languageName: node linkType: hard -"next@npm:^15.2.0-canary.0": - version: 15.2.0-canary.0 - resolution: "next@npm:15.2.0-canary.0" +"next@npm:^15.2.0-canary.2": + version: 15.2.0-canary.2 + resolution: "next@npm:15.2.0-canary.2" dependencies: - "@next/env": "npm:15.2.0-canary.0" - "@next/swc-darwin-arm64": "npm:15.2.0-canary.0" - "@next/swc-darwin-x64": "npm:15.2.0-canary.0" - "@next/swc-linux-arm64-gnu": "npm:15.2.0-canary.0" - "@next/swc-linux-arm64-musl": "npm:15.2.0-canary.0" - "@next/swc-linux-x64-gnu": "npm:15.2.0-canary.0" - "@next/swc-linux-x64-musl": "npm:15.2.0-canary.0" - "@next/swc-win32-arm64-msvc": "npm:15.2.0-canary.0" - "@next/swc-win32-x64-msvc": "npm:15.2.0-canary.0" + "@next/env": "npm:15.2.0-canary.2" + "@next/swc-darwin-arm64": "npm:15.2.0-canary.2" + "@next/swc-darwin-x64": "npm:15.2.0-canary.2" + "@next/swc-linux-arm64-gnu": "npm:15.2.0-canary.2" + "@next/swc-linux-arm64-musl": "npm:15.2.0-canary.2" + "@next/swc-linux-x64-gnu": "npm:15.2.0-canary.2" + "@next/swc-linux-x64-musl": "npm:15.2.0-canary.2" + "@next/swc-win32-arm64-msvc": "npm:15.2.0-canary.2" + "@next/swc-win32-x64-msvc": "npm:15.2.0-canary.2" "@swc/counter": "npm:0.1.3" "@swc/helpers": "npm:0.5.15" busboy: "npm:1.6.0" @@ -12079,7 +12079,7 @@ __metadata: optional: true bin: next: dist/bin/next - checksum: 10c0/ded544f944fe484575a4a3e1b9c90142bc1dcabd66db2e2ab6cdee44464ae34bb6ba1bb0c2c1d74ceda893e984b5a16d7e8f86eea2c2bd4d358faa609cc0328a + checksum: 10c0/f4a648fca15db6c9ecbe0c6ab2e4398f3a62e9949bf96929f87cd96be7b32f195cedfad4e9201fee0c0620c773b6ea016ab941a4adb95625b07ab0f13835fa4e languageName: node linkType: hard @@ -15473,23 +15473,23 @@ __metadata: languageName: node linkType: hard -"typescript@npm:^5.7.2": - version: 5.7.2 - resolution: "typescript@npm:5.7.2" +"typescript@npm:^5.7.3": + version: 5.7.3 + resolution: "typescript@npm:5.7.3" bin: tsc: bin/tsc tsserver: bin/tsserver - checksum: 10c0/a873118b5201b2ef332127ef5c63fb9d9c155e6fdbe211cbd9d8e65877283797cca76546bad742eea36ed7efbe3424a30376818f79c7318512064e8625d61622 + checksum: 10c0/b7580d716cf1824736cc6e628ab4cd8b51877408ba2be0869d2866da35ef8366dd6ae9eb9d0851470a39be17cbd61df1126f9e211d8799d764ea7431d5435afa languageName: node linkType: hard -"typescript@patch:typescript@npm%3A^5.7.2#optional!builtin": - version: 5.7.2 - resolution: "typescript@patch:typescript@npm%3A5.7.2#optional!builtin::version=5.7.2&hash=5786d5" +"typescript@patch:typescript@npm%3A^5.7.3#optional!builtin": + version: 5.7.3 + resolution: "typescript@patch:typescript@npm%3A5.7.3#optional!builtin::version=5.7.3&hash=5786d5" bin: tsc: bin/tsc tsserver: bin/tsserver - checksum: 10c0/f3b8082c9d1d1629a215245c9087df56cb784f9fb6f27b5d55577a20e68afe2a889c040aacff6d27e35be165ecf9dca66e694c42eb9a50b3b2c451b36b5675cb + checksum: 10c0/6fd7e0ed3bf23a81246878c613423730c40e8bdbfec4c6e4d7bf1b847cbb39076e56ad5f50aa9d7ebd89877999abaee216002d3f2818885e41c907caaa192cc4 languageName: node linkType: hard