Add live ticket animations and fix sidebar hydration

src/components/ui/sidebar.tsx

@@ -254,15 +254,31 @@ function Sidebar({
   )
 }
 
-function SidebarTrigger({
-  className,
-  onClick,
-  ...props
-}: React.ComponentProps<typeof Button>) {
-  const { toggleSidebar } = useSidebar()
-
-  return (
-    <Button
+function SidebarTrigger({
+  className,
+  onClick,
+  ...props
+}: React.ComponentProps<typeof Button> & { fallback?: ReactNode }) {
+  const { toggleSidebar } = useSidebar()
+  const [hydrated, setHydrated] = useState(false)
+
+  useEffect(() => {
+    setHydrated(true)
+  }, [])
+
+  if (!hydrated) {
+    return (
+      <div
+        data-sidebar="trigger"
+        data-slot="sidebar-trigger"
+        className={cn("size-7 rounded-full border border-slate-200 bg-white", className)}
+        role="presentation"
+      />
+    )
+  }
+
+  return (
+    <Button
       data-sidebar="trigger"
       data-slot="sidebar-trigger"
       variant="ghost"