feat: launcher-style search UI (Raycast/Spotlight)

- Replace Pagefind UI with cmdk + Pagefind low-level API
- Quick actions when empty: nav (home, blog, tags) + recent posts
- Debounced full-text search with keyboard navigation
- Pass recent posts from layout to SearchModal
- Extract cn utility to lib/utils.ts
- Remove Pagefind UI styles, add Radix overlay styling
- Align blog search bar styling with launcher

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-02-13 23:41:10 +08:00
parent 7d85446ac5
commit fe28262ef4
10 changed files with 738 additions and 217 deletions

View File

@@ -1,6 +1,7 @@
import '../styles/globals.css';
import type { Metadata } from 'next';
import { siteConfig } from '@/lib/config';
import { getAllPostsSorted } from '@/lib/posts';
import { LayoutShell } from '@/components/layout-shell';
import { ThemeProvider } from 'next-themes';
import { Playfair_Display, LXGW_WenKai_TC } from 'next/font/google';
@@ -55,12 +56,15 @@ export const metadata: Metadata = {
}
};
export default function RootLayout({
export default async function RootLayout({
children
}: {
children: React.ReactNode;
}) {
const theme = siteConfig.theme;
const recentPosts = getAllPostsSorted()
.slice(0, 5)
.map((p) => ({ title: p.title, url: p.url }));
// WebSite Schema
const websiteSchema = {
@@ -131,7 +135,7 @@ export default function RootLayout({
}}
/>
<ThemeProvider attribute="class" defaultTheme="system" enableSystem>
<LayoutShell>{children}</LayoutShell>
<LayoutShell recentPosts={recentPosts}>{children}</LayoutShell>
</ThemeProvider>
<WebVitals />
</body>