github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-01-24 05:52:25 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #6064 from overleaf/jpa-fix-contacts-sorting

Browse source 
[web] share-project-modal: use server-side sorting of contacts

GitOrigin-RevId: fb66cf33a36b60c5014f87f001e682fa31ff7ff7
This commit is contained in:
Alf Eaton 2021-12-10 10:15:49 +00:00 committed by Copybot
parent 6a175c703b
commit 42d06a091e
2 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
services/web/frontend/js/features/share-project-modal/components/select-collaborators.js
View file

@ -37,14 +37,20 @@ export default function SelectCollaborators({
[options, selectedEmails]
)
const filteredOptions = useMemo(
() =>
matchSorter(unselectedOptions, inputValue, {
keys: ['name', 'email'],
threshold: matchSorter.rankings.CONTAINS,
}),
[unselectedOptions, inputValue]
)
const filteredOptions = useMemo(() => {
if (inputValue === '') {
return unselectedOptions
}
return matchSorter(unselectedOptions, inputValue, {
keys: ['name', 'email'],
threshold: matchSorter.rankings.CONTAINS,
baseSort: (a, b) => {
// Prefer server-side sorting for ties in the match ranking.
return a.index - b.index > 0 ? 1 : -1
},
})
}, [unselectedOptions, inputValue])
const inputRef = useRef(null)

8
services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.js
View file

@ -2,12 +2,6 @@ import { useEffect, useState } from 'react'
import { getJSON } from '../../../infrastructure/fetch-json'
import useAbortController from '../../../shared/hooks/use-abort-controller'
const contactCollator = new Intl.Collator('en')
const alphabetical = (a, b) =>
contactCollator.compare(a.name, b.name) ||
contactCollator.compare(a.email, b.email)
export function useUserContacts() {
const [loading, setLoading] = useState(true)
const [data, setData] = useState(null)
@ -18,7 +12,7 @@ export function useUserContacts() {
useEffect(() => {
getJSON('/user/contacts', { signal })
.then(data => {
setData(data.contacts.map(buildContact).sort(alphabetical))
setData(data.contacts.map(buildContact))
})
.catch(error => setError(error))
.finally(() => setLoading(false))