Spaces autofocus and prefill the search box

This commit is contained in:
Michael Telatynski 2021-03-24 14:00:52 +00:00
parent fb46815b6a
commit 4e9a2df3b0
3 changed files with 7 additions and 1 deletions

View file

@ -32,6 +32,8 @@ export default class SearchBox extends React.Component {
onKeyDown: PropTypes.func, onKeyDown: PropTypes.func,
className: PropTypes.string, className: PropTypes.string,
placeholder: PropTypes.string.isRequired, placeholder: PropTypes.string.isRequired,
autoFocus: PropTypes.bool,
initialValue: PropTypes.string,
// If true, the search box will focus and clear itself // If true, the search box will focus and clear itself
// on room search focus action (it would be nicer to take // on room search focus action (it would be nicer to take
@ -49,7 +51,7 @@ export default class SearchBox extends React.Component {
this._search = createRef(); this._search = createRef();
this.state = { this.state = {
searchTerm: "", searchTerm: this.props.initialValue || "",
blurred: true, blurred: true,
}; };
} }
@ -158,6 +160,7 @@ export default class SearchBox extends React.Component {
onBlur={this._onBlur} onBlur={this._onBlur}
placeholder={ placeholder } placeholder={ placeholder }
autoComplete="off" autoComplete="off"
autoFocus={this.props.autoFocus}
/> />
{ clearButton } { clearButton }
</div> </div>

View file

@ -570,6 +570,8 @@ const SpaceRoomDirectory: React.FC<IProps> = ({ space, initialText = "", onFinis
className="mx_textinput_icon mx_textinput_search" className="mx_textinput_icon mx_textinput_search"
placeholder={ _t("Search names and description") } placeholder={ _t("Search names and description") }
onSearch={setQuery} onSearch={setQuery}
autoFocus={true}
initialValue={initialText}
/> />
{ content } { content }

View file

@ -127,6 +127,7 @@ const AddExistingToSpaceDialog: React.FC<IProps> = ({ matrixClient: cli, space,
className="mx_textinput_icon mx_textinput_search" className="mx_textinput_icon mx_textinput_search"
placeholder={ _t("Filter your rooms and spaces") } placeholder={ _t("Filter your rooms and spaces") }
onSearch={setQuery} onSearch={setQuery}
autoComplete={true}
/> />
<AutoHideScrollbar className="mx_AddExistingToSpaceDialog_content" id="mx_AddExistingToSpaceDialog"> <AutoHideScrollbar className="mx_AddExistingToSpaceDialog_content" id="mx_AddExistingToSpaceDialog">
{ spaces.length > 0 ? ( { spaces.length > 0 ? (