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