diff --git a/apps/server/src/routes/_protected/bookmarks/index.tsx b/apps/server/src/routes/_protected/bookmarks/index.tsx new file mode 100644 index 0000000..1ca7991 --- /dev/null +++ b/apps/server/src/routes/_protected/bookmarks/index.tsx @@ -0,0 +1,92 @@ +import type { QueryClient } from '@tanstack/react-query' +import { useMutation, useSuspenseQuery } from '@tanstack/react-query' +import { createFileRoute } from '@tanstack/react-router' +import { Plus, X } from 'lucide-react' +import { useState } from 'react' +import { orpc } from '@/client/orpc' +import { CategorySection } from '@/modules/bookmarks/components/CategorySection' +import { GreetingHeader } from '@/modules/bookmarks/components/GreetingHeader' +import { SearchBar } from '@/modules/bookmarks/components/SearchBar' + +export const Route = createFileRoute('/_protected/bookmarks/' as never)({ + component: BookmarksPage, + loader: async ({ context }: { context: { queryClient: QueryClient } }) => { + await context.queryClient.ensureQueryData(orpc.bookmarks.category.list.queryOptions()) + }, +}) + +function BookmarksPage() { + const categoriesQuery = useSuspenseQuery(orpc.bookmarks.category.list.queryOptions()) + const createCategory = useMutation(orpc.bookmarks.category.create.mutationOptions()) + const [showAddCategory, setShowAddCategory] = useState(false) + const [newCategoryName, setNewCategoryName] = useState('') + + const handleAddCategory = (e: React.FormEvent) => { + e.preventDefault() + if (newCategoryName.trim()) { + createCategory.mutate({ + name: newCategoryName.trim(), + orderId: categoriesQuery.data.length, + }) + setNewCategoryName('') + setShowAddCategory(false) + } + } + + return ( +
还没有任何分类
+创建一个分类来开始添加书签
++ 欢迎回来,{user.name} · {user.email} +
+{mod.description}
+