Add files via upload

frontend/src/components/UI/Drawer.jsx

@@ -0,0 +1,24 @@
+import { useEffect } from 'react'
+export default function Drawer({ isOpen, onClose, children }) {
+  useEffect(() => {
+    const h = (e) => { if (e.key === 'Escape') onClose() }
+    if (isOpen) document.addEventListener('keydown', h)
+    return () => document.removeEventListener('keydown', h)
+  }, [isOpen, onClose])
+  return (
+    <>
+      {isOpen && <div className="fixed inset-0 z-40 bg-black/50 backdrop-blur-sm" onClick={onClose} />}
+      <div
+        className={`fixed bottom-0 left-0 right-0 z-50 bg-surface-raised border-t border-surface-border rounded-t-2xl shadow-2xl transition-transform duration-300 ease-in-out ${isOpen ? 'translate-y-0' : 'translate-y-full'}`}
+        style={{ maxHeight: '65vh' }}
+      >
+        <div className="relative flex items-center justify-between px-6 py-3 border-b border-surface-border">
+          <div className="absolute left-1/2 -translate-x-1/2 top-2 w-10 h-1 bg-surface-border rounded-full" />
+          <div className="flex-1" />
+          <button onClick={onClose} className="text-text-muted hover:text-gold transition-colors text-lg">✕</button>
+        </div>
+        <div className="overflow-y-auto" style={{ maxHeight: 'calc(65vh - 52px)' }}>{children}</div>
+      </div>
+    </>
+  )
+}