GauthierWebDev/memento-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: Remove unnecessary code and improve hierarchy display

Browse Source
This commit is contained in:
Gauthier Daniels 2025-04-20 12:53:07 +02:00
parent 9526b1ae9d
commit 8ed5451c37
2 changed files with 34 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/components/Search.telefunc.ts
View File

@ -1,9 +0,0 @@
import { buildFlexSearch } from "@/services/FlexSearchService";
import { docCache } from "@/services/DocCache";
export const onSearch = async (query: string) => {
const docs = docCache.fetchDocs();
const search = buildFlexSearch(docs);
return search(query, 5);
};

52
app/components/Search.tsx
View File

@ -8,9 +8,11 @@ import {
createEffect, createEffect,
createSignal, createSignal,
} from "solid-js"; } from "solid-js";
import { Dialog, DialogPanel } from "terracotta";
import { useDebounce } from "@/hooks/useDebounce";
import { Highlighter } from "solid-highlight-words"; import { Highlighter } from "solid-highlight-words";
import { useDebounce } from "@/hooks/useDebounce";
import { Dialog, DialogPanel } from "terracotta";
import { navigation } from "@/libs/navigation";
import { navigate } from "vike/client/router"; import { navigate } from "vike/client/router";
import { useId } from "@/hooks/useId"; import { useId } from "@/hooks/useId";
import clsx from "clsx"; import clsx from "clsx";
@ -127,6 +129,18 @@ function SearchResultItem(props: { result: SearchResult; query: string }) {
const { close } = useContext(SearchContext); const { close } = useContext(SearchContext);
const id = useId(); const id = useId();
const getHierarchy = (): string[] => {
const sectionTitle = navigation.find((section) => {
return section.links.find(
(link) => link.href === props.result.url.split("#")[0],
);
})?.title;
return [sectionTitle, props.result.pageTitle].filter(
(x): x is string => typeof x === "string",
);
};
return ( return (
<li <li
class="group block cursor-default rounded-lg px-3 py-2 aria-selected:bg-slate-100 hover:bg-slate-100" class="group block cursor-default rounded-lg px-3 py-2 aria-selected:bg-slate-100 hover:bg-slate-100"
@ -150,28 +164,30 @@ function SearchResultItem(props: { result: SearchResult; query: string }) {
> >
<HighlightQuery text={props.result.title} query={props.query} /> <HighlightQuery text={props.result.title} query={props.query} />
</div> </div>
{/* {props.result.length > 0 && ( {getHierarchy().length > 0 && (
<div <div
id={`${id}-hierarchy`} id={`${id}-hierarchy`}
aria-hidden="true" aria-hidden="true"
class="mt-0.5 truncate text-xs whitespace-nowrap text-slate-500 dark:text-slate-400" class="mt-0.5 truncate text-xs whitespace-nowrap text-slate-500 dark:text-slate-400"
> >
{hierarchy.map((item, itemIndex, items) => ( <For each={getHierarchy()}>
<Fragment key={itemIndex}> {(item, itemIndex) => (
<HighlightQuery text={item} query={query} /> <>
<span <HighlightQuery text={item} query={props.query} />
class={ <span
itemIndex === items.length - 1 class={
? "sr-only" itemIndex() === getHierarchy().length - 1
: "mx-2 text-slate-300 dark:text-slate-700" ? "sr-only"
} : "mx-2 text-slate-300 dark:text-slate-700"
> }
/ >
</span> /
</Fragment> </span>
))} </>
)}
</For>
</div> </div>
)} */} )}
</li> </li>
); );
} }