import {ModalListScreen} from '@/components/modal-list-screen'
import {UserList} from '@/components/user-list'
import {usePagedListScreen} from '@/hooks/use-paged-list-screen'
import {friendsList} from '@/stores/friends'

export default function FriendsScreen() {
  const {items, loading, loadingMore, screenProps} =
    usePagedListScreen(friendsList)

  return (
    <ModalListScreen title="Friends" {...screenProps}>
      <UserList
        users={items}
        loading={loading}
        loadingMore={loadingMore}
        showStatus={false}
        emptyMessage="No friends yet"
      />
    </ModalListScreen>
  )
}
