Потеря значения состояния при перезагрузке страницы

Всем привет! Никак не могу разобраться с проблемой, буду рада, если кто поможет)

Ситуация такая: делаю сайт с новостями по категориям (News API) и получаю список новостей по каждой категории отдельным запросом (в зависимости от выбранного фильтра). Фильтр работает, записывается категория в состояние, новости подгружаются, но при простой перезагрузке страницы значение категории сбрасывается на null.

Часть кода компонента со страницей новостей:

const CategoryPage = ({category}) => {
const [newsList, setNewsList] = useState([]);

const {getNewsByCategory} = useNewsService();
console.log(category);

useEffect(() => {
    getNewsByCategory(category)
        .then(setNewsList)
}, [category])}

Часть кода с фильтрами:

const NewsFilter = ({setCategory}) => {
function handleCategory(category) {
    setCategory(category)
    console.log(category);
}}

Состояние category хранится в корневом компоненте App:

const [category, setCategory] = useState(null);

Так выглядит страница с загруженной категорией: