2021-06-30 20:31:29 +00:00
|
|
|
import Cursor from './cursor'
|
|
|
|
import { useCoopSelector } from 'state/coop/coop-state'
|
2021-06-30 20:56:42 +00:00
|
|
|
import { useSelector } from 'state'
|
2021-06-30 20:31:29 +00:00
|
|
|
|
|
|
|
export default function Presence(): JSX.Element {
|
|
|
|
const others = useCoopSelector((s) => s.data.others)
|
2021-06-30 20:56:42 +00:00
|
|
|
const currentPageId = useSelector((s) => s.data.currentPageId)
|
2021-06-30 20:31:29 +00:00
|
|
|
|
2021-07-01 14:03:02 +00:00
|
|
|
if (!others) return null
|
|
|
|
|
2021-06-30 20:31:29 +00:00
|
|
|
return (
|
|
|
|
<>
|
2021-07-01 14:03:02 +00:00
|
|
|
{Object.values(others)
|
|
|
|
.filter(({ presence }) => presence?.pageId === currentPageId)
|
|
|
|
.map(({ connectionId, presence }) => {
|
|
|
|
return (
|
|
|
|
<Cursor
|
|
|
|
key={`cursor-${connectionId}`}
|
|
|
|
color={'red'}
|
|
|
|
duration={presence.duration}
|
|
|
|
times={presence.times}
|
|
|
|
bufferedXs={presence.bufferedXs}
|
|
|
|
bufferedYs={presence.bufferedYs}
|
|
|
|
/>
|
|
|
|
)
|
|
|
|
})}
|
2021-06-30 20:31:29 +00:00
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|