chore: upgrade to react 19 beta and next 14 canary

components/site-header.tsx

@@ -1,27 +1,20 @@
 "use client";
 
-import { useCallback } from "react";
 import Link from "next/link";
 
 import { siteConfig } from "@/config/site";
 import { cn } from "@/lib/style";
+import { useSidebar } from "@/hooks/use-sidebar";
 import * as icons from "@/components/icons";
 import { Menu } from "@/components/icons";
 import { ThemeToggle } from "@/components/theme-toggle";
-import { SidebarStatus, useSetSidebarStatus, useSidebarStatus } from "@/contexts/sidebar";
 
 type Props = {
   className?: string;
 };
 
 export function SiteHeader({ className }: Props) {
-  const setSidebarStatus = useSetSidebarStatus();
-  const sidebarStatus = useSidebarStatus();
-  const handleMenuToggle = useCallback(() => {
-    setSidebarStatus(
-      sidebarStatus === SidebarStatus.Open ? SidebarStatus.Closed : SidebarStatus.Open
-    );
-  }, [sidebarStatus, setSidebarStatus]);
+  const { toggleSidebar } = useSidebar();
 
   return (
     <header className={cn("flex items-center justify-between px-4", className)}>
@@ -29,17 +22,18 @@ export function SiteHeader({ className }: Props) {
         <button
           type="button"
           className="flex items-center rounded p-1.5 hover:bg-accent"
-          onClick={handleMenuToggle}
+          onClick={toggleSidebar}
         >
           <Menu />
         </button>
+        {/* @ts-expect-error react 19 beta error */}
         <Link className="text-lg" href="/">
           {siteConfig.name}
         </Link>
       </div>
       <div className="flex gap-x-1">
         <a
-          className="group h-10 w-10 rounded-md p-2"
+          className="group size-10 rounded-md p-2"
           href={siteConfig.links.github}
           target="_blank"
           rel="noreferrer"