On gqless core, how can I listen to subsequent proxies access? (to subscribe to changes)

[outerlook]

I'm trying to integrate gqless with svelte.

I know I can use

const selectionHooks = new Set<Selection>()

resolved(() => query.me.name, {
	onSelection: selection => selectionHooks.add(selection) 
})

then I can listen to cache changes on this selection and ask my component to update on that.

But is there somehow to listen to changes/new selections accessing proxies in this way?

const me = resolved( query.me )

me.name;
me.address.street;

Because as far as I know it would not know there are this new selections outside resolved.

I've tried reading react implementation that uses interceptor/globalInterceptor but I did not understand how could them differentiate if the intercepted selectors where called on another component rendering at the same time.

How could I know when some proxy is accessed downstream and update only components that really accessed this properties?

Please, tell me if my question isn't clear enough.

[outerlook]

I've managed to get this to work creating a new proxy outside client's query

    const hookSelections = new Set<Selection>()

    // this will execute a function inside interceptors that will add the selections used during that function
    // I didn't test for performance.
    const wrapIntercept = (fn: () => any) => {
        const interceptor = interceptorManager.createInterceptor()
        interceptor.selectionAddListeners.add(selection => {
            if (selection) hookSelections.add(selection)
        })
        interceptor.selectionCacheListeners.add(selection => {
            if (selection) hookSelections.add(selection)
        })
        interceptor.selectionCacheRefetchListeners.add(selection => {
            if (selection) hookSelections.add(selection)
        })
        const value = fn()
        interceptorManager.removeInterceptor(interceptor)
        return value
    }

    // if it is a function (query.user({id})) this will reproxy the result
    const proxyFnHandler: ProxyHandler<{}> = {
        apply(target: any, thisArg: any, argArray: any[]): any {
            const returnValue = wrapIntercept(() =>
                Reflect.apply(target, thisArg, argArray)
            )

            if (!isProxy(returnValue)) {
                return returnValue
            }

            return new Proxy(returnValue, handler)
        }
    }

    // the normal handler
    const handler: ProxyHandler<{}> = {
        set(target, key, value) {
            return Reflect.set(target, key, value)
        },
        get(target, key, receiver) {


            // PS: would be simpler to getInterception for this proxy then listen.
            // but I don't know how to get the interception if the result is a scalar.
            const returnValue = wrapIntercept(() =>
                Reflect.get(target, key, receiver)
            )
            if (debug) console.log({ returnValue })

            if (!isProxy(returnValue)) {
                if (typeof returnValue !== 'function') {
                    // scalar
                    return returnValue
                }
                // this must be a function
                return new Proxy(returnValue, proxyFnHandler)
            }

            return new Proxy(returnValue, handler)
        }
    }

    // Proxied query that when new props are being consumed, add to selection hooks
    const proxiedQuery = new Proxy(clientQuery, handler)


    // you should then listen to cache changes. If change occurs and the selection is present, you should update your component, etc.