feat: add search to author pages

api/search.ts

@@ -30,9 +30,13 @@ for (const picMapItem of unicornProfilePicMap) {
 export default async (req: VercelRequest, res: VercelResponse) => {
 	// TODO: `pickdeep` only required fields
 	const searchStr = req?.query?.query as string;
+	const authorStr = req?.query?.authorId as string;
 	if (!searchStr) return [];
 	if (Array.isArray(searchStr)) return [];
-	const posts = fuse.search(searchStr).map((item) => item.item as PostInfo);
+	let posts = fuse.search(searchStr).map((item) => item.item as PostInfo);
+	if (authorStr) {
+		posts = posts.filter((post) => post.authors.includes(authorStr));
+	}
 	const unicornProfilePicMap = posts.flatMap((post) =>
 		post.authorsMeta.map((authorMeta) => unicornProfilePicObj[authorMeta.id])
 	);

src/components/filter-search-bar/filter-search-bar.astro

@@ -1,8 +1,6 @@
 ---
-import { ProfilePictureMap } from "utils/get-unicorn-profile-pic-map";
 import styles from "./filter-search-bar.module.scss";
 import SearchField from "./search-field/search-field.astro";
-// import FilterListbox from "./filter-listbox/filter-listbox.astro";
 ---
 
 <div class={styles.iconContainer}>
@@ -11,21 +9,15 @@ import SearchField from "./search-field/search-field.astro";
 		<slot />
 	</div>
 	<div></div>
-	<!-- <FilterListbox class={styles.filterField} /> -->
 </div>
 <script>
 	const SEARCH_QUERY_KEY = "searchQuery";
 
-	import { render, createElement, Fragment } from "preact";
+	import { render, createElement } from "preact";
-	import { useState } from "preact/hooks";
 	import { PostInfo } from "types/PostInfo";
 	import { debounce } from "utils/debounce";
 	import { ProfilePictureMap } from "utils/get-unicorn-profile-pic-map";
-	import {
+	import { SearchBarHandler, SEARCH_PAGE_KEY } from "./search-bar-handler";
-		SearchBarHandler,
-		getPageFromQueryParams,
-		SEARCH_PAGE_KEY,
-	} from "./search-bar-handler";
 
 	const searchInput: HTMLInputElement = document.querySelector("#search-input");
 	const postListContainer: HTMLElement = document.querySelector(
@@ -87,7 +79,11 @@ import SearchField from "./search-field/search-field.astro";
 		abortController = new AbortController();
 		// eslint-disable-next-line no-undef
 		plausible("search", { props: { searchVal: val } });
-		fetch(`/api/search?query=${val}`, { signal: abortController.signal })
+		const authorId: string | undefined = (window as any).authorId;
+		fetch(
+			`/api/search?query=${val}${authorId ? "&authorId=" + authorId : ""}`,
+			{ signal: abortController.signal }
+		)
 			.then((res) => res.json())
 			.then(
 				(serverVal: {

src/page-components/unicorns/unicorn-page.astro

@@ -7,9 +7,10 @@ import ProfileHeader from "./profile-header/profile-header.astro";
 import { getUnicornProfilePicMap } from "utils/get-unicorn-profile-pic-map";
 import FilterSearchBar from "components/filter-search-bar/filter-search-bar.astro";
 import WordCount from "./word-count/word-count.astro";
+import { UnicornInfo } from "types/UnicornInfo";
 
 export interface UnicornTemplateProps {
-	unicorn: any;
+	unicorn: UnicornInfo;
 	posts: PostInfo[];
 	allPosts: PostInfo[];
 	rootURL: string;
@@ -26,8 +27,13 @@ const unicornProfilePicMap = await getUnicornProfilePicMap();
 const wordCount = allPosts.reduce((prev, post) => {
 	return prev + post.wordCount;
 }, 0);
+
+const authorId = unicorn.id;
 ---
 
+<script define:vars={{ authorId }}>
+	window.authorId = authorId;
+</script>
 <ProfileHeader unicornData={unicorn} />
 <main>
 	<FilterSearchBar>