core/panel/ui/CommunitySelector.tsx

78 lines
2.6 KiB
TypeScript
Raw Normal View History

2025-07-02 19:30:21 +00:00
import { createEffect, For, Show } from 'solid-js'
import { useData } from '../context/data'
import styles from '../styles/Admin.module.css'
/**
* Компонент выбора сообщества
*
* Особенности:
* - Сохраняет выбранное сообщество в localStorage
* - По умолчанию выбрано сообщество с ID 1 (Дискурс)
* - При изменении автоматически загружает темы выбранного сообщества
*/
const CommunitySelector = () => {
const { communities, selectedCommunity, setSelectedCommunity, loadTopicsByCommunity, isLoading } =
useData()
// Отладочное логирование состояния
createEffect(() => {
const current = selectedCommunity()
const allCommunities = communities()
console.log('[CommunitySelector] Состояние:', {
selectedId: current,
selectedName: allCommunities.find((c) => c.id === current)?.name,
totalCommunities: allCommunities.length
})
})
// Загружаем темы при изменении выбранного сообщества
createEffect(() => {
const communityId = selectedCommunity()
if (communityId !== null) {
console.log('[CommunitySelector] Загрузка тем для сообщества:', communityId)
loadTopicsByCommunity(communityId)
}
})
// Обработчик изменения выбранного сообщества
const handleCommunityChange = (event: Event) => {
const select = event.target as HTMLSelectElement
const value = select.value
if (value === '') {
setSelectedCommunity(null)
} else {
const communityId = Number.parseInt(value, 10)
if (!Number.isNaN(communityId)) {
setSelectedCommunity(communityId)
}
}
}
return (
<div class={styles['community-selector']}>
<select
id="community-select"
value={selectedCommunity()?.toString() || ''}
onChange={handleCommunityChange}
disabled={isLoading()}
class={selectedCommunity() !== null ? styles['community-selected'] : ''}
>
<option value="">Все сообщества</option>
<For each={communities()}>
{(community) => (
<option value={community.id.toString()}>
{community.name} {community.id === 1 ? '(По умолчанию)' : ''}
</option>
)}
</For>
</select>
<Show when={isLoading()}>
<span class={styles['loading-indicator']}>Загрузка...</span>
</Show>
</div>
)
}
export default CommunitySelector