overleaf/services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.js
Alf Eaton 2328dd1705 Add useAbortController hook (#4234)
GitOrigin-RevId: 731f86a2b07cd2c3189e6ca86bba9fbbc913f429
2021-06-24 02:06:45 +00:00

45 lines
1.3 KiB
JavaScript

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)
const [error, setError] = useState(false)
const { signal } = useAbortController()
useEffect(() => {
getJSON('/user/contacts', { signal })
.then(data => {
setData(data.contacts.map(buildContact).sort(alphabetical))
})
.catch(error => setError(error))
.finally(() => setLoading(false))
}, [signal])
return { loading, data, error }
}
function buildContact(contact) {
const [emailPrefix] = contact.email.split('@')
// the name is not just the default "email prefix as first name"
const hasName = contact.last_name || contact.first_name !== emailPrefix
const name = hasName
? [contact.first_name, contact.last_name].filter(Boolean).join(' ')
: ''
return {
...contact,
name,
display: name ? `${name} <${contact.email}>` : contact.email,
}
}