Update suggestions query with new api hook
This commit is contained in:
parent
ae0fd07580
commit
e72476d577
2 changed files with 26 additions and 28 deletions
|
@ -1,25 +1,24 @@
|
||||||
import { renderHook } from '@testing-library/react-hooks';
|
import { __stub } from 'soapbox/api';
|
||||||
|
import { renderHook, waitFor } from 'soapbox/jest/test-helpers';
|
||||||
import { mock, queryWrapper, waitFor } from 'soapbox/jest/test-helpers';
|
|
||||||
|
|
||||||
import useOnboardingSuggestions from '../suggestions';
|
import useOnboardingSuggestions from '../suggestions';
|
||||||
|
|
||||||
describe('useCarouselAvatars', () => {
|
describe('useCarouselAvatars', () => {
|
||||||
describe('with a successul query', () => {
|
describe('with a successul query', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
mock.onGet('/api/v2/suggestions')
|
__stub((mock) => {
|
||||||
.reply(200, [
|
mock.onGet('/api/v2/suggestions')
|
||||||
{ source: 'staff', account: { id: '1', acct: 'a', account_avatar: 'https://example.com/some.jpg' } },
|
.reply(200, [
|
||||||
{ source: 'staff', account: { id: '2', acct: 'b', account_avatar: 'https://example.com/some.jpg' } },
|
{ source: 'staff', account: { id: '1', acct: 'a', account_avatar: 'https://example.com/some.jpg' } },
|
||||||
], {
|
{ source: 'staff', account: { id: '2', acct: 'b', account_avatar: 'https://example.com/some.jpg' } },
|
||||||
link: '<https://example.com/api/v2/suggestions?since_id=1>; rel=\'prev\'',
|
], {
|
||||||
});
|
link: '<https://example.com/api/v2/suggestions?since_id=1>; rel=\'prev\'',
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('is successful', async() => {
|
it('is successful', async() => {
|
||||||
const { result } = renderHook(() => useOnboardingSuggestions(), {
|
const { result } = renderHook(() => useOnboardingSuggestions());
|
||||||
wrapper: queryWrapper,
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => expect(result.current.isFetching).toBe(false));
|
await waitFor(() => expect(result.current.isFetching).toBe(false));
|
||||||
|
|
||||||
|
@ -29,13 +28,13 @@ describe('useCarouselAvatars', () => {
|
||||||
|
|
||||||
describe('with an unsuccessul query', () => {
|
describe('with an unsuccessul query', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
mock.onGet('/api/v2/suggestions').networkError();
|
__stub((mock) => {
|
||||||
|
mock.onGet('/api/v2/suggestions').networkError();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('is successful', async() => {
|
it('is successful', async() => {
|
||||||
const { result } = renderHook(() => useOnboardingSuggestions(), {
|
const { result } = renderHook(() => useOnboardingSuggestions());
|
||||||
wrapper: queryWrapper,
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => expect(result.current.isFetching).toBe(false));
|
await waitFor(() => expect(result.current.isFetching).toBe(false));
|
||||||
|
|
||||||
|
|
|
@ -3,8 +3,7 @@ import { useInfiniteQuery } from '@tanstack/react-query';
|
||||||
import { fetchRelationships } from 'soapbox/actions/accounts';
|
import { fetchRelationships } from 'soapbox/actions/accounts';
|
||||||
import { importFetchedAccounts } from 'soapbox/actions/importer';
|
import { importFetchedAccounts } from 'soapbox/actions/importer';
|
||||||
import { getLinks } from 'soapbox/api';
|
import { getLinks } from 'soapbox/api';
|
||||||
import { useAppDispatch } from 'soapbox/hooks';
|
import { useApi, useAppDispatch } from 'soapbox/hooks';
|
||||||
import API from 'soapbox/queries/client';
|
|
||||||
|
|
||||||
type Account = {
|
type Account = {
|
||||||
acct: string
|
acct: string
|
||||||
|
@ -36,10 +35,14 @@ type Suggestion = {
|
||||||
account: Account
|
account: Account
|
||||||
}
|
}
|
||||||
|
|
||||||
const getV2Suggestions = async(dispatch: any, pageParam: any): Promise<{ data: Suggestion[], link: string | null, hasMore: boolean }> => {
|
|
||||||
return dispatch(async() => {
|
export default function useOnboardingSuggestions() {
|
||||||
|
const api = useApi();
|
||||||
|
const dispatch = useAppDispatch();
|
||||||
|
|
||||||
|
const getV2Suggestions = async(pageParam: any): Promise<{ data: Suggestion[], link: string | undefined, hasMore: boolean }> => {
|
||||||
const link = pageParam?.link || '/api/v2/suggestions';
|
const link = pageParam?.link || '/api/v2/suggestions';
|
||||||
const response = await API.get<Suggestion[]>(link);
|
const response = await api.get<Suggestion[]>(link);
|
||||||
const hasMore = !!response.headers.link;
|
const hasMore = !!response.headers.link;
|
||||||
const nextLink = getLinks(response).refs.find(link => link.rel === 'next')?.uri;
|
const nextLink = getLinks(response).refs.find(link => link.rel === 'next')?.uri;
|
||||||
|
|
||||||
|
@ -53,13 +56,9 @@ const getV2Suggestions = async(dispatch: any, pageParam: any): Promise<{ data: S
|
||||||
link: nextLink,
|
link: nextLink,
|
||||||
hasMore,
|
hasMore,
|
||||||
};
|
};
|
||||||
});
|
};
|
||||||
};
|
|
||||||
|
|
||||||
export default function useOnboardingSuggestions() {
|
const result = useInfiniteQuery(['suggestions', 'v2'], ({ pageParam }) => getV2Suggestions(pageParam), {
|
||||||
const dispatch = useAppDispatch();
|
|
||||||
|
|
||||||
const result = useInfiniteQuery(['suggestions', 'v2'], ({ pageParam }) => getV2Suggestions(dispatch, pageParam), {
|
|
||||||
keepPreviousData: true,
|
keepPreviousData: true,
|
||||||
getNextPageParam: (config) => {
|
getNextPageParam: (config) => {
|
||||||
if (config.hasMore) {
|
if (config.hasMore) {
|
||||||
|
|
Loading…
Reference in a new issue