feat(admin): add search with submit and safe-area layout

Add submit-based search to admin books page and switch borrows
search from debounced to submit-based for consistency. Update
layout headers and nav bars to respect mobile safe-area insets
via CSS custom properties.

src/features/admin/AdminBooksPage.tsx

@@ -18,7 +18,6 @@ import {
   AlertDialogTitle,
 } from "@/components/ui/alert-dialog"
 import { useAdminBooks, useAdminSearchBooks, useAddBook, useUpdateBook, useUpdateStock, useDeleteBook, useAdminBorrowBook } from "./hooks"
-import { usePlatform } from "@/hooks/usePlatform"
 import { useIsMobile } from "@/hooks/useIsMobile"
 import type { Book } from "@/types/api"
 import { getErrorMessage } from "@/lib/errors"
@@ -33,9 +32,8 @@ interface BorrowDialog { open: boolean; book: Book }
 const addInitial: AddDialog = { open: false }
 
 export default function AdminBooksPage() {
-  const platform = usePlatform()
   const isMobile = useIsMobile()
-  const sel = platform === "web" ? ({ "data-selectable": true } as const) : ({} as const)
+  const sel = { "data-selectable": true } as const
 
   const [searchText, setSearchText] = useState("")
   const [submitted, setSubmitted] = useState("")

src/features/admin/AdminBorrowsPage.tsx

@@ -17,16 +17,14 @@ import {
   AlertDialogTitle,
 } from "@/components/ui/alert-dialog"
 import { useAdminBorrows, useSearchBorrows, useAdminReturnBook } from "./hooks"
-import { usePlatform } from "@/hooks/usePlatform"
 import { useIsMobile } from "@/hooks/useIsMobile"
 import { formatDateTime } from "@/lib/formatters"
 import { getErrorMessage } from "@/lib/errors"
 import type { BorrowInfoVo } from "@/types/api"
 
 export default function AdminBorrowsPage() {
-  const platform = usePlatform()
   const isMobile = useIsMobile()
-  const sel = platform === "web" ? ({ "data-selectable": true } as const) : ({} as const)
+  const sel = { "data-selectable": true } as const
 
   const [searchText, setSearchText] = useState("")
   const [submitted, setSubmitted] = useState("")

src/features/books/BooksPage.tsx

@@ -7,16 +7,14 @@ import { Input } from "@/components/ui/input"
 import { Skeleton } from "@/components/ui/skeleton"
 import { useBooks, useSearchBooks, useBorrowBook } from "./hooks"
 import { useAuthStore } from "@/store/authStore"
-import { usePlatform } from "@/hooks/usePlatform"
 import { useIsMobile } from "@/hooks/useIsMobile"
 import { getErrorMessage } from "@/lib/errors"
 
 export default function BooksPage() {
   const borrow = useBorrowBook()
   const token = useAuthStore((s) => s.token)
-  const platform = usePlatform()
   const isMobile = useIsMobile()
-  const sel = platform === "web" ? ({ "data-selectable": true } as const) : ({} as const)
+  const sel = { "data-selectable": true } as const
 
   const [searchText, setSearchText] = useState("")
   const [submitted, setSubmitted] = useState("")

src/features/borrows/MyBorrowsPage.tsx

@@ -8,15 +8,13 @@ import { Input } from "@/components/ui/input"
 import { Skeleton } from "@/components/ui/skeleton"
 import { useMyBorrows, useSearchMyBorrows, useReturnBook } from "./hooks"
 import { formatDateTime } from "@/lib/formatters"
-import { usePlatform } from "@/hooks/usePlatform"
 import { useIsMobile } from "@/hooks/useIsMobile"
 import { getErrorMessage } from "@/lib/errors"
 
 export default function MyBorrowsPage() {
   const returnBook = useReturnBook()
-  const platform = usePlatform()
   const isMobile = useIsMobile()
-  const sel = platform === "web" ? ({ "data-selectable": true } as const) : ({} as const)
+  const sel = { "data-selectable": true } as const
 
   const [searchText, setSearchText] = useState("")
   const [submitted, setSubmitted] = useState("")

src/hooks/usePlatform.tsx

@@ -8,12 +8,6 @@ function isTauri(): boolean {
   return !!(window as unknown as Record<string, unknown>).__TAURI_INTERNALS__
 }
 
-// Default to safe: add no-select immediately, remove only if definitely web
-document.documentElement.classList.add("no-select")
-if (!isTauri()) {
-  document.documentElement.classList.remove("no-select")
-}
-
 export function PlatformProvider({ children }: { children: ReactNode }) {
   const [platform, setPlatform] = useState<Platform>(isTauri() ? "desktop" : "web")
 

src/index.css

@@ -140,11 +140,14 @@ html.mobile body {
 }
 
 html.no-select * {
+  -webkit-user-select: none !important;
   user-select: none !important;
 }
 
 html.no-select input,
 html.no-select textarea,
 html.no-select [data-selectable] {
+  -webkit-user-select: text !important;
   user-select: text !important;
-}
+}
+