refactor: Rename SearchResult to SearchResultItem and fix types
This commit is contained in:
parent
7828846362
commit
b8608c493c
@ -111,7 +111,7 @@ function HighlightQuery({ text, query }: { text: string; query: string }) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function SearchResult({
|
function SearchResultItem({
|
||||||
result,
|
result,
|
||||||
autocomplete,
|
autocomplete,
|
||||||
collection,
|
collection,
|
||||||
@ -187,7 +187,7 @@ function SearchResults({
|
|||||||
return (
|
return (
|
||||||
<ul {...autocomplete.getListProps()}>
|
<ul {...autocomplete.getListProps()}>
|
||||||
{collection.items.map((result) => (
|
{collection.items.map((result) => (
|
||||||
<SearchResult
|
<SearchResultItem
|
||||||
key={result.url}
|
key={result.url}
|
||||||
result={result}
|
result={result}
|
||||||
autocomplete={autocomplete}
|
autocomplete={autocomplete}
|
||||||
@ -269,9 +269,9 @@ function SearchDialog({
|
|||||||
setOpen: (open: boolean) => void;
|
setOpen: (open: boolean) => void;
|
||||||
className?: string;
|
className?: string;
|
||||||
}) {
|
}) {
|
||||||
let formRef = useRef<React.ElementRef<"form">>(null);
|
let formRef = useRef<React.ComponentRef<"form">>(null);
|
||||||
let panelRef = useRef<React.ElementRef<"div">>(null);
|
let panelRef = useRef<React.ComponentRef<"div">>(null);
|
||||||
let inputRef = useRef<React.ElementRef<typeof SearchInput>>(null);
|
let inputRef = useRef<React.ComponentRef<typeof SearchInput>>(null);
|
||||||
|
|
||||||
let close = useCallback(
|
let close = useCallback(
|
||||||
(autocomplete: Autocomplete) => {
|
(autocomplete: Autocomplete) => {
|
||||||
@ -352,7 +352,7 @@ function SearchDialog({
|
|||||||
}
|
}
|
||||||
|
|
||||||
function useSearchProps() {
|
function useSearchProps() {
|
||||||
let buttonRef = useRef<React.ElementRef<"button">>(null);
|
let buttonRef = useRef<React.ComponentRef<"button">>(null);
|
||||||
let [open, setOpen] = useState(false);
|
let [open, setOpen] = useState(false);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@ -379,7 +379,8 @@ export function Search() {
|
|||||||
let { buttonProps, dialogProps } = useSearchProps();
|
let { buttonProps, dialogProps } = useSearchProps();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setModifierKey(/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform) ? "⌘" : "Ctrl ");
|
const platform = navigator.userAgentData?.platform || navigator.platform;
|
||||||
|
setModifierKey(/(Mac|iPhone|iPod|iPad)/i.test(platform) ? "⌘" : "Ctrl ");
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: "Introduction à React"
|
title: Introduction à React
|
||||||
description: "Parlons un peu de React, ce qu'il est, ce qu'il fait et pourquoi il est si populaire."
|
description: Parlons un peu de React, ce qu'il est, ce qu'il fait et pourquoi il est si populaire.
|
||||||
tags: [Frontend, React, JavaScript, TypeScript, Bibliothèque, Interface utilisateur (UI)]
|
tags: [Frontend, React, JavaScript, TypeScript, Bibliothèque, Interface utilisateur (UI)]
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|||||||
5
app/pages/+title.ts
Normal file
5
app/pages/+title.ts
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import config from "./+config";
|
||||||
|
|
||||||
|
export function title() {
|
||||||
|
return `Synthèses et ressources pour développeurs - ${config.title}`;
|
||||||
|
}
|
||||||
7
app/pages/buildTitle.ts
Normal file
7
app/pages/buildTitle.ts
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
import { title } from "./+title";
|
||||||
|
import config from "./+config";
|
||||||
|
|
||||||
|
export default function buildTitle(pageTitle?: string) {
|
||||||
|
if (!pageTitle) return title();
|
||||||
|
return `${pageTitle} - ${config.title}`;
|
||||||
|
}
|
||||||
@ -2,7 +2,7 @@ import type { PageContext } from "vike/types";
|
|||||||
|
|
||||||
import { docsService } from "@/services/DocsService";
|
import { docsService } from "@/services/DocsService";
|
||||||
import { useConfig } from "vike-react/useConfig";
|
import { useConfig } from "vike-react/useConfig";
|
||||||
import Markdoc from "@markdoc/markdoc";
|
import buildTitle from "@/pages/buildTitle";
|
||||||
import { render } from "vike/abort";
|
import { render } from "vike/abort";
|
||||||
|
|
||||||
export type Data = Awaited<ReturnType<typeof data>>;
|
export type Data = Awaited<ReturnType<typeof data>>;
|
||||||
@ -18,8 +18,10 @@ export async function data(pageContext: PageContext) {
|
|||||||
throw render(404);
|
throw render(404);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
console.log({ doc });
|
||||||
|
|
||||||
config({
|
config({
|
||||||
title: doc.title,
|
title: buildTitle(doc.title),
|
||||||
description: doc.description,
|
description: doc.description,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user