import debounce from 'lodash/debounce'; import React from 'react'; import { FormattedMessage } from 'react-intl'; import ScrollableList from 'soapbox/components/scrollable-list'; import { Button, Card, CardBody, Stack, Text } from 'soapbox/components/ui'; import AccountContainer from 'soapbox/containers/account-container'; import { useOnboardingSuggestions } from 'soapbox/queries/suggestions'; const SuggestedAccountsStep = ({ onNext }: { onNext: () => void }) => { const { data, fetchNextPage, hasNextPage, isFetching } = useOnboardingSuggestions(); const handleLoadMore = debounce(() => { if (isFetching) { return null; } return fetchNextPage(); }, 300); const renderSuggestions = () => { if (!data) { return null; } return (