+
+ )
+}
+
export function Composer({ roomId, roomName, members, rooms, disabled, onSend }: ComposerProps) {
const [value, setValue] = useState('')
const [pendingImage, setPendingImage] = useState<{ id: string; previewUrl: string } | null>(null)
@@ -76,8 +104,18 @@ export function Composer({ roomId, roomName, members, rooms, disabled, onSend }:
const [roomQuery, setRoomQuery] = useState(null)
const [roomActiveIndex, setRoomActiveIndex] = useState(0)
const [dragActive, setDragActive] = useState(false)
+ const [attachMenuOpen, setAttachMenuOpen] = useState(false)
const textareaRef = useRef(null)
const fileInputRef = useRef(null)
+ // #29: a separate input with an image/video accept hint, so mobile
+ // browsers offer their media picker (with a direct Photos/Gallery
+ // shortcut) instead of the generic chooser a fully-unrestricted `accept`
+ // falls back to (Camera / Camera Video / Files, no gallery). The
+ // unrestricted `fileInputRef` above still exists for the "File" choice --
+ // Android can't reliably offer both a gallery shortcut and "any file
+ // type" from a single input, so the attach button now opens a small menu
+ // to pick which one you want first.
+ const photoInputRef = useRef(null)
// Counts nested dragenter/dragleave pairs (the overlay, the composer box,
// the textarea are all separate elements a drag passes over) so the
// highlight doesn't flicker off every time the pointer crosses a child
@@ -362,35 +400,58 @@ export function Composer({ roomId, roomName, members, rooms, disabled, onSend }:
)}
{uploadError &&