import { useState , useEffect } from 'react' ; import { Subscription } from 'rxjs' ; import { Query } from '../../..' ; import { QueryStringContract } from '../../../query/query_string' ; interface UseQueryStringProps { query ? : Query ; queryStringManager : QueryStringContract ; } export const useQueryStringManager = ( props ) => { const [ query , setQuery ] = useState < Query > ( props . query || props . queryStringManager . getQuery ( ) ) ; useEffect ( ( ) => { const subscriptions = new Subscription ( ) ; subscriptions . add ( props . queryStringManager . getUpdates$ ( ) . subscribe ( { next : ( ) => { const newQuery = props . queryStringManager . getQuery ( ) ; setQuery ( newQuery ) ; } , } ) ) ; return ( ) => { subscriptions . unsubscribe ( ) ; } ; } , [ props . queryStringManager ] ) ; return { query } ; } ;