1// A mirror of the remote tracker windows. 2import * as React from 'react' 3import * as Container from '../util/container' 4import * as Constants from '../constants/tracker2' 5import * as Styles from '../styles' 6import useSerializeProps from '../desktop/remote/use-serialize-props.desktop' 7import useBrowserWindow from '../desktop/remote/use-browser-window.desktop' 8import {serialize, ProxyProps} from './remote-serializer.desktop' 9import {intersect} from '../util/set' 10import {mapFilterByKey} from '../util/map' 11 12const MAX_TRACKERS = 5 13const windowOpts = {hasShadow: false, height: 470, transparent: true, width: 320} 14 15const RemoteTracker = (props: {trackerUsername: string}) => { 16 const {trackerUsername} = props 17 const details = Container.useSelector(state => Constants.getDetails(state, trackerUsername)) 18 const users = Container.useSelector(state => state.users) 19 const {blockMap, infoMap} = users 20 const config = Container.useSelector(state => state.config) 21 const {avatarRefreshCounter, following, followers, httpSrvToken, httpSrvAddress, username} = config 22 const {assertions, bio, followersCount, followingCount, fullname, guiID} = details 23 const {hidFromFollowers, location, reason, teamShowcase} = details 24 const waiting = Container.useSelector(state => state.waiting) 25 const {counts, errors} = waiting 26 const trackerUsernames = new Set([trackerUsername]) 27 const waitingKeys = new Set([Constants.waitingKey]) 28 const blocked = blockMap.get(trackerUsername)?.chatBlocked || false 29 const p: ProxyProps = { 30 assertions, 31 avatarRefreshCounter, 32 bio, 33 blockMap: mapFilterByKey(blockMap, trackerUsernames), 34 blocked, 35 counts: mapFilterByKey(counts, waitingKeys), 36 darkMode: Styles.isDarkMode(), 37 errors: mapFilterByKey(errors, waitingKeys), 38 followers: intersect(followers, trackerUsernames), 39 followersCount, 40 following: intersect(following, trackerUsernames), 41 followingCount, 42 fullname, 43 guiID, 44 hidFromFollowers, 45 httpSrvAddress, 46 httpSrvToken, 47 infoMap: mapFilterByKey(infoMap, trackerUsernames), 48 location, 49 reason, 50 resetBrokeTrack: false, 51 showTracker: true, 52 state: details.state, 53 teamShowcase, 54 trackerUsername, 55 username, 56 } 57 58 const windowComponent = 'tracker2' 59 const windowParam = trackerUsername 60 useBrowserWindow({ 61 windowComponent, 62 windowOpts, 63 windowParam, 64 windowPositionBottomRight: true, 65 windowTitle: `Tracker - ${trackerUsername}`, 66 }) 67 68 useSerializeProps(p, serialize, windowComponent, windowParam) 69 70 return null 71} 72 73const RemoteTrackers = () => { 74 const state = Container.useSelector(s => s) 75 const {usernameToDetails} = state.tracker2 76 return ( 77 <> 78 {[...usernameToDetails.values()].reduce<Array<React.ReactNode>>((arr, u) => { 79 if (arr.length < MAX_TRACKERS && u.showTracker) { 80 arr.push(<RemoteTracker key={u.username} trackerUsername={u.username} />) 81 } 82 return arr 83 }, [])} 84 </> 85 ) 86} 87 88export default RemoteTrackers 89