self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2025-01-23 18:34:02 +02:00
Code Issues Releases Activity

Adding search hotkey ctrl+shift+f

Browse Source
This commit is contained in:
Jesús Espino 2021-04-01 10:13:02 +02:00
parent 4feb217994
commit ae58abcecb
2 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
webapp/src/components/viewHeader/viewHeaderSearch.tsx
View File

@ -2,6 +2,7 @@
// See LICENSE.txt for license information. // See LICENSE.txt for license information.
import React, {useState, useRef, useEffect} from 'react' import React, {useState, useRef, useEffect} from 'react'
import {FormattedMessage, injectIntl, IntlShape} from 'react-intl' import {FormattedMessage, injectIntl, IntlShape} from 'react-intl'
import {useHotkeys} from 'react-hotkeys-hook'
import {BoardTree} from '../../viewModel/boardTree' import {BoardTree} from '../../viewModel/boardTree'
import Button from '../../widgets/buttons/button' import Button from '../../widgets/buttons/button'
@ -13,7 +14,7 @@ type Props = {
intl: IntlShape intl: IntlShape
} }
const ViewHeaderSearch = React.memo((props: Props) => { const ViewHeaderSearch = (props: Props) => {
const {boardTree, intl} = props const {boardTree, intl} = props
const searchFieldRef = useRef<Editable>(null) const searchFieldRef = useRef<Editable>(null)
@ -28,6 +29,11 @@ const ViewHeaderSearch = React.memo((props: Props) => {
setSearchValue(boardTree.getSearchText()) setSearchValue(boardTree.getSearchText())
}, [boardTree]) }, [boardTree])
useHotkeys('ctrl+shift+f', () => {
setIsSearching(true)
searchFieldRef.current?.focus(true)
})
if (isSearching) { if (isSearching) {
return ( return (
<Editable <Editable
@ -57,6 +63,6 @@ const ViewHeaderSearch = React.memo((props: Props) => {
/> />
</Button> </Button>
) )
}) }
export default injectIntl(ViewHeaderSearch) export default injectIntl(ViewHeaderSearch)

6
webapp/src/widgets/editable.tsx
View File

@ -24,13 +24,17 @@ export default class Editable extends React.Component<Props> {
return true return true
} }
public focus(): void { public focus(selectAll = false): void {
if (this.elementRef.current) { if (this.elementRef.current) {
const valueLength = this.elementRef.current.value.length const valueLength = this.elementRef.current.value.length
this.elementRef.current.focus() this.elementRef.current.focus()
if (selectAll) {
this.elementRef.current.setSelectionRange(0, valueLength)
} else {
this.elementRef.current.setSelectionRange(valueLength, valueLength) this.elementRef.current.setSelectionRange(valueLength, valueLength)
} }
} }
}
public blur = (): void => { public blur = (): void => {
this.saveOnBlur = false this.saveOnBlur = false