* Hide suggestions if the user is typing a ln addr that is not on stacker.news
* Don't select suggestion with tab in this particular instance of InputUseSuggest
This commit is contained in:
parent
6d3482a288
commit
e907b40845
@ -394,15 +394,28 @@ function InputInner ({
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
export function UserSuggest ({ query, onSelect, dropdownStyle, children, transformUser = user => user }) {
|
export function UserSuggest ({
|
||||||
|
query, onSelect, dropdownStyle, children,
|
||||||
|
transformUser = user => user, selectWithTab = true, filterUsers = () => true
|
||||||
|
}) {
|
||||||
const [getUsers] = useLazyQuery(TOP_USERS, {
|
const [getUsers] = useLazyQuery(TOP_USERS, {
|
||||||
onCompleted: data => {
|
onCompleted: data => {
|
||||||
setSuggestions({ array: data.topUsers.users.map(transformUser), index: 0 })
|
setSuggestions({
|
||||||
|
array: data.topUsers.users
|
||||||
|
.filter((...args) => filterUsers(query, ...args))
|
||||||
|
.map(transformUser),
|
||||||
|
index: 0
|
||||||
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const [getSuggestions] = useLazyQuery(USER_SEARCH, {
|
const [getSuggestions] = useLazyQuery(USER_SEARCH, {
|
||||||
onCompleted: data => {
|
onCompleted: data => {
|
||||||
setSuggestions({ array: data.searchUsers.map(transformUser), index: 0 })
|
setSuggestions({
|
||||||
|
array: data.searchUsers
|
||||||
|
.filter((...args) => filterUsers(query, ...args))
|
||||||
|
.map(transformUser),
|
||||||
|
index: 0
|
||||||
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -449,6 +462,9 @@ export function UserSuggest ({ query, onSelect, dropdownStyle, children, transfo
|
|||||||
break
|
break
|
||||||
case 'Tab':
|
case 'Tab':
|
||||||
case 'Enter':
|
case 'Enter':
|
||||||
|
if (e.code === 'Tab' && !selectWithTab) {
|
||||||
|
break
|
||||||
|
}
|
||||||
if (suggestions.array?.length === 0) {
|
if (suggestions.array?.length === 0) {
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
@ -486,13 +502,15 @@ export function UserSuggest ({ query, onSelect, dropdownStyle, children, transfo
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
export function InputUserSuggest ({ label, groupClassName, transformUser, ...props }) {
|
export function InputUserSuggest ({ label, groupClassName, transformUser, filterUsers, selectWithTab, ...props }) {
|
||||||
const [ovalue, setOValue] = useState()
|
const [ovalue, setOValue] = useState()
|
||||||
const [query, setQuery] = useState()
|
const [query, setQuery] = useState()
|
||||||
return (
|
return (
|
||||||
<FormGroup label={label} className={groupClassName}>
|
<FormGroup label={label} className={groupClassName}>
|
||||||
<UserSuggest
|
<UserSuggest
|
||||||
transformUser={transformUser}
|
transformUser={transformUser}
|
||||||
|
filterUsers={filterUsers}
|
||||||
|
selectWithTab={selectWithTab}
|
||||||
onSelect={setOValue}
|
onSelect={setOValue}
|
||||||
query={query}
|
query={query}
|
||||||
>
|
>
|
||||||
|
@ -356,6 +356,14 @@ export function LnAddrWithdrawal () {
|
|||||||
autoFocus
|
autoFocus
|
||||||
onChange={onAddrChange}
|
onChange={onAddrChange}
|
||||||
transformUser={user => ({ ...user, name: `${user.name}@stacker.news` })}
|
transformUser={user => ({ ...user, name: `${user.name}@stacker.news` })}
|
||||||
|
selectWithTab={false}
|
||||||
|
filterUsers={(query) => {
|
||||||
|
if (!query.includes('@')) {
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
const [, domain] = query.split('@')
|
||||||
|
return 'stacker.news'.startsWith(domain)
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
<Input
|
<Input
|
||||||
label='amount'
|
label='amount'
|
||||||
|
Loading…
x
Reference in New Issue
Block a user