async function initUiObservers(store, _router) {
	const body = document.querySelector('body');

	body.classList.add(store.state.ui.theme);

	store.watch((state) => state.ui.theme, (newTheme, oldTheme) => {
		body.classList.add(newTheme);
		body.classList.remove(oldTheme);
	});

	document.addEventListener('keypress', (event) => {
		if (event.target.tagName === 'INPUT') {
			return;
		}

		if (event.key === 's') {
			store.dispatch('setSfw', true);
		}

		if (event.key === 'n') {
			store.dispatch('setSfw', false);
		}

		if (event.key === 'd') {
			store.dispatch('setTheme', 'dark');
		}

		if (event.key === 'l') {
			store.dispatch('setTheme', 'light');
		}
	});

	await store.dispatch('fetchNotifications');
}

export default initUiObservers;