const curbApi = props.curbApi; const componentOwnerId = props.componentOwnerId; const onChatSelected = props.onChatSelected; const activeChat = props.activeChat; const isSidebarOpen = props.isSidebarOpen; const [channels, setChannels] = useState([]); const [users, setUsers] = useState([]); const generator = () => Promise.all([ curbApi.getDMs(), curbApi.getChannels(), curbApi.getUnreadMessages(), ]); const [cachedUsers, cachedChannels, cachedUnread] = useCache( generator, "channel_container", { subscribe: true } ); useEffect(() => { const usersWN = (cachedUsers ?? []).map((u) => ({ ...u, unreadMessages: cachedUnread.chats[u.id] || 0, })); const channelsWN = (cachedChannels ?? []).map((c) => ({ ...c, unreadMessages: cachedUnread.channels[c.name] || 0, })); setUsers(usersWN); setChannels(channelsWN); }, [cachedUsers, cachedChannels, cachedUnread]); return ( <Widget src={`${componentOwnerId}/widget/Calimero.Curb.SideSelector.SideSelector`} props={{ curbApi, componentOwnerId, onChatSelected, activeChat, users, channels, isSidebarOpen, }} /> );