import { StoriesPreview } from '.'
import { UserCategoriesNames, UserCategory, composeUserCategoriesFilters } from '../assets/userCategories'
import { useAnnouncements } from '../hooks/api'
import { gotError } from '../hooks/useFetch'

type CategoryPreviewProps = {
    category: UserCategory
}

function CategoryPreview({ category }: CategoryPreviewProps) {
    const announcements = useAnnouncements(composeUserCategoriesFilters[category]())

    return (
        <section>
            <h4 className='fw-bold'>{UserCategoriesNames[category]}</h4>
            {gotError(announcements) ? (
                <p className='text-danger'>{announcements.error}</p>
            ) : (announcements.loading ? 'Загрузка...' :
                <StoriesPreview announcements={announcements.data} category={category} />
            )}
        </section>
    )
}

export default CategoryPreview