import {of} from 'rxjs'
import {useObservable} from '../util/useObservable'
import {useUserColorManager} from './provider'
import {UserColor} from './types'
import React from 'react'

export function useUserColor(userId: string | null): UserColor | null {
  const manager = useUserColorManager()
  return useObservable(
    userId === null ? of(null) : React.useMemo(() => manager.listen(userId), [userId])
  )
}

import {of} from 'rxjs'
import {useObservable} from '../util/useObservable'
import {useUserColorManager} from './provider'
import {UserColor} from './types'
import React from 'react'

export function useUserColor(userId: string | null): Readonly<UserColor> | null {
  const manager = useUserColorManager()
  return useObservable(
    userId === null ? of(null) : React.useMemo(() => manager.listen(userId), [userId])
  )
}

--- 
+++ 
@@ -4,7 +4,7 @@
 import {UserColor} from './types'
 import React from 'react'
 
-export function useUserColor(userId: string | null): Readonly<UserColor> | null {
+export function useUserColor(userId: string | null): UserColor | null {
   const manager = useUserColorManager()
   return useObservable(
     userId === null ? of(null) : React.useMemo(() => manager.listen(userId), [userId])
[base] Fix readonly being applied twice for user color
