thencc / any-wallet

web3 auth for any algo wallets
https://thencc.github.io/any-wallet/
3 stars 1 forks source link

TODO add `.sync` flag in init that tells the instances on the same page whether or not to sync mobx state WITHOUT persist: true #31

Closed spencercap closed 1 year ago

spencercap commented 1 year ago

notes re adding this...


        // type XX = ReturnType<typeof makePersistable<T, P>>;
        // const propsToPersist: PersistenceStorageOptions<this> = {
        // }
        const propsToStore = [
            'todos',
            {
                key: 'activeAccount',
                serialize: (v: any) => {
                    // console.log('serialize', v);
                    // return JSON.stringify( toJS(v) );
                    return toJS(v);
                },
                deserialize: (v: any) => {
                    // console.log('deserialize', v);
                    // return observable.array(JSON.parse(v));
                    return observable(v);
                },
            },
            {
                key: 'connectedAccounts',
                serialize: (v: any) => {
                    // console.log('serialize', v);
                    // return JSON.stringify( toJS(v) );
                    return toJS(v);
                },
                deserialize: (v: any) => {
                    // console.log('deserialize', v);
                    // return observable.array(JSON.parse(v));
                    return observable.array(v);
                },
            },
        ] as const;

        const pingUpdate = () => {
            console.log('pingUpdate');
            const evt = new CustomEvent('aw-state-change', {
                detail: {
                    from: selfId,
                    // stateNew: toJS(this),
                    stateNew: this,
                },
            });
            console.log('dispatching c evt', evt);
            window.top!.dispatchEvent(evt); 
        }

        // listen only once per aw inst
        // window.top!.addEventListener('aw-state-change', async (e) => {
        //  console.log('caught aw-state-change evt', e);
        //  // console.log('from', (e as CustomEvent).detail.from);
        //  // console.log('selfId', selfId);

        //  if ((e as CustomEvent).detail.from !== selfId) {
        //      // console.log('change other store inst');
        //      doingRemoteChange = true;

        //      // works! w timeout 
        //      setTimeout(async () => {
        //          console.log('timeout hyd store');
        //          // await pStore.hydrateStore();
        //          // console.log('this', this);

        //          const dd = (e as CustomEvent).detail.stateNew;
        //          console.log('dd', dd);
        //          for (let k in dd) {
        //              let v = dd[k];
        //              // if (!v.isMobxAction) {
        //              //  //
        //              // }
        //              // console.log('tpyeof d', v);
        //              // console.log('k',k,'v', v,' - ', isObservable(v));

        //              for (let p of propsToStore) {
        //                  // console.log('p itr', k, p);

        //                  // let pk = p.key;
        //                  if (k == p.key) {
        //                      console.log('update it!', p, k);
        //                      this[k] = v;
        //                  }
        //              }
        //          }

        //          // NOTE: dont use this.doingR ("this" loses scope. becomes the event? )
        //          // doingRemoteChange = false;
        //          setTimeout(() => {
        //              doingRemoteChange = false;
        //          }, 10);

        //      }, 10);                         
        //  }
        // }, false);
spencercap commented 1 year ago

did another solution. verbose opt-in syncing state in constructor params.