// ob
const [the_npc, set_the_npc] = useState<null | npc>(null)
useEffect(() => {
	const ob = npc_focu$.subscribe(npc => {
		set_the_npc(npc)
	})
	return () => ob.unsubscribe()
}, [])
// change
npc.name = 'new name'
npc_focu$.next(npc)

npc_focu$.pipe(shallowCopy()))

import { OperatorFunction, Observable, Operator, Subscriber } from 'rxjs'

class ShallowCopySubscriber<T> extends Subscriber<T> {
	destination: Subscriber<T>
	constructor(destination: Subscriber<T>) {
		super(destination)
		this.destination = destination
	}

	protected _next(value: T) {
		let result: T = value
		try {
			switch (typeof value) {
				case 'object':
					const tostring = Object.prototype.toString.call(value)
					if (Array.isArray(value)) {
						result = [...value] as any
					} else if (tostring === '[object Object]') {
						result = { ...value }
					} else if (value instanceof Set) {
						result = new Set(value) as any
					} else if (value instanceof Map) {
						result = new Map(value) as any
					}
					break

				default:
					break
			}
		} catch (err) {
			this.destination.error(err)
			return
		}
		this.destination.next(result)
	}
}

class ShallowCopyOperator<T> implements Operator<T, T> {
	call(subscriber: Subscriber<T>, source: any): any {
		return source.subscribe(new ShallowCopySubscriber(subscriber))
	}
}

export function shallowCopy<T>(): OperatorFunction<T, T> {
	return (source: Observable<T>) => source.lift(new ShallowCopyOperator())
}