import { browser , Runtime } from 'webextension-polyfill-ts' ; import { ATOM_LOG , ATOM_LOG_ITEM , CONTENT_TO_BACKGROUND_MESSAGE , } from '../types' ; type ATOM_EVENT = { from : string ; type : ATOM_LOG_ITEM [ 'type' ] ; key : string ; value : any ; } ; const log = [ ] ; let port ; const sendData = ( data ) => port . postMessage ( data ) ; let id = 0 ; window . onmessage = ( { data } ) => { if ( data && data . from === 'state-atom' ) { const payload = { type : data . type , key : data . key , value : data . value , uid : id ++ , time : Date . now ( ) , } ; if ( ! port ) { port = browser . runtime . connect ( browser . runtime . id , { name : 'atomic-state-devtool' , } ) ; port . onMessage . addListener ( ( ) => { sendData ( { type : 'HYDRATION' , value : log } ) ; } ) ; } log . push ( payload ) ; sendData ( payload ) ; } } ;