Implement hook for getting pending invites

[achou11]

Rough sketch of what we initially thought about:

export function usePendingInvites() {
	const queryClient = useQueryClient()
	const clientApi = useClientApi()

	const { data, isFetching } = useQuery(
		pendingInvitesQueryOptions({ clientApi }),
	)

	useEffect(() => {
		function onInviteEvent() {
			queryClient.invalidateQueries({ queryKey: getInvitesQueryKey() })
		}

		clientApi.invite.addListener('invite-received', onInviteEvent)
		clientApi.invite.addListener('invite-removed', onInviteEvent)

		return () => {
			clientApi.invite.removeListener('invite-received', onInviteEvent)
			clientApi.invite.removeListener('invite-removed', onInviteEvent)
		}
	}, [queryClient, clientApi.invite])


	// Not sure what this return value should be...
	return { data: dedupeInvites(data || []), isFetching }
}

Questions:

• We had doubts about whether we wanted this hook to be suspense-based. Given that, not entirely sure what we want the return value to look like. Are we okay with this being one of those weird exceptions to the rest of the read hooks?

• We had mentioned needing to dedupe the invites payload. Not exactly sure why or what that looks like right now.

• Should we extract the effect to its own hook and expose that separately?