feat: add search to author pages

This commit is contained in:
Corbin Crutchley
2022-11-13 09:12:28 -08:00
parent d18ddb0c5a
commit 9d2c1644c6
3 changed files with 19 additions and 13 deletions

View File

@@ -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])
);

View File

@@ -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 { useState } from "preact/hooks";
import { render, createElement } from "preact";
import { PostInfo } from "types/PostInfo";
import { debounce } from "utils/debounce";
import { ProfilePictureMap } from "utils/get-unicorn-profile-pic-map";
import {
SearchBarHandler,
getPageFromQueryParams,
SEARCH_PAGE_KEY,
} from "./search-bar-handler";
import { SearchBarHandler, 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: {

View File

@@ -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>